http://blog.csdn.net/gisshixisheng/article/details/49496289

概述：

在OL2中，鼠标默认是箭头，地图移动时，鼠标样式是移动样式；很多时候，为了形象起见，我们总是希望鼠标在地图上的时候和移动地图的时候鼠标的样式不是默认的效果，本文讲述如何实现这样的效果。

实现方式：

通过下面的代码实现修改鼠标样式。

map.layerContainerDiv.style.cursor = ("url(img/openhand.cur),default");


在地图初始化完成后，设置地图的样式，并添加map的move和moveend事件，实现的完整代码如下：




  1. <!DOCTYPE html>
    2. 

  2. <html>
    3. 

  3. <head lang="en">
    4. 

  4. <meta charset="UTF-8">
    5. 

  5. <title>openlayers map</title>
    6. 

  6. <link rel="stylesheet" href="http://localhost/olapi/theme/default/style.css" type="text/css">
    7. 

  7. <style>
    8. 

  8. html, body{
    9. 

  9. padding:0;
    10. 

  10. margin:0;
    11. 

  11. height:100%;
    12. 

  12. width:100%;
    13. 

  13. overflow: hidden;
    14. 

  14. font-size: 12px;
    15. 

  15. }
    16. 

  16. #map1{
    17. 

  17. width: 500px;
    18. 

  18. height: 500px;
    19. 

  19. float: left;
    20. 

  20. overflow: hidden;
    21. 

  21. border: 1px solid #f0e68c;
    22. 

  22. }
    23. 

  23. </style>
    24. 

  24. <script src="../../../plugin/OpenLayers-2.13.1/OpenLayers.js"></script>
    25. 

  25. <script src="../../../plugin/jquery/jquery-1.8.3.js"></script>
    26. 

  26. <script>
    27. 

  27. var map1;
    28. 

  28. $(function(){
    29. 

  29. var bounds = new OpenLayers.Bounds(
    30. 

  30. 73.45100463562233, 18.16324718764174,
    31. 

  31. 134.97679764650596, 53.531943152223576
    32. 

  32. );
    33. 

  33. var options = {
    34. 

  34. controls: [],
    35. 

  35. maxExtent: bounds,
    36. 

  36. maxResolution: 0.2403351289487642,
    37. 

  37. projection: "EPSG:4326",
    38. 

  38. units: 'degrees'
    39. 

  39. };
    40. 

  40. map1 = new OpenLayers.Map('map1', options);
    41. 

  41. var wms = new OpenLayers.Layer.WMS(
    42. 

  42. "Geoserver layers - Tiled",
    43. 

  43. "http://localhost:8088/geoserver/lzugis/wms",
    44. 

  44. {
    45. 

  45. "LAYERS": "province",
    46. 

  46. "STYLES": '',
    47. 

  47. format: 'image/png'
    48. 

  48. },
    49. 

  49. {
    50. 

  50. buffer: 0,
    51. 

  51. displayOutsideMaxExtent: true,
    52. 

  52. isBaseLayer: true,
    53. 

  53. yx : {'EPSG:4326' : true}
    54. 

  54. }
    55. 

  55. );
    56. 

  56. map1.addLayer(wms);
    57. 

  57. map1.addControl(new OpenLayers.Control.Zoom());
    58. 

  58. map1.addControl(new OpenLayers.Control.Navigation());
    59. 

  59. map1.zoomToExtent(bounds);
    60. 

  60. map1.layerContainerDiv.style.cursor = ("url(img/openhand.cur),default");
    61. 

  61. map1.events.register("move", map1, function(){
    62. 

  62. map1.layerContainerDiv.style.cursor = ("url(img/closedhand.cur),default");
    63. 

  63. });
    64. 

  64. map1.events.register("moveend", map1, function(){
    65. 

  65. map1.layerContainerDiv.style.cursor = ("url(img/openhand.cur),default");
    66. 

  66. });
    67. 

  67. });
    68. 

  68. </script>
    69. 

  69. </head>
    70. 

  70. <body>
    71. 

  71. <div id="map1"></div>
    72. 

  72. </body>
    73. 

  73. </html>


												


											
（转）OL2中设置鼠标的样式的更多相关文章
	

    
								
  1. 【Java】在JTable中设置鼠标监听器，点击操作对应数据
		
    最终效果 鼠标点击JTable中任一数据,修改相应的信息. 确定点击的行和列 package com.dao; import java.awt.event.MouseAdapter; import j ...
    
		
    2. 
						
  2. 对span设置鼠标光标样式
		
    <html> <body> <p>请把鼠标移动到单词上,可以看到鼠标指针发生变化:</p> <span style="cursor:au ...
    
		
    3. 
						
  3. Extjs中设置只读的样式问题
		
    废话不多说,直接上代码:   view.down('#imageFile').hide(); view.down('#save_button').hide(); view.show(); view.d ...
    
		
    4. 
						
  4. flash中设置文本字体样式
		
    txt.setTextFormat(tf);  txt.defaultTextFormat = tf;
    
		
    5. 
						
  5. Html中<a>标签的样式的设置
		
    html中<a>标签的样式的设置.. ------------------------ <html> <head> <title>这是网页选项卡的名称& ...
    
		
    6. 
						
  6. Qt中设置widget背景颜色/图片的注意事项（使用样式表 setStyleSheet()）
		
    在Qt中设置widget背景颜色或者图片方法很多种:重写paintEvent() , 调色板QPalette , 样式表setStyleSheet等等. 但是各种方法都有其注意事项,如果不注意则很容易 ...
    
		
    7. 
						
  7. wxpython 设置鼠标样式
		
    鼠标指针被设置为放大镜样式.可用的鼠标指针样式有: wx.CURSOR_ARROWwx.CURSOR_RIGHT_ARROWwx.CURSOR_BLANKwx.CURSOR_BULLSEYEwx.CU ...
    
		
    8. 
						
  8. Winform中设置ZedGraph曲线图的字体样式是避免出现边框
		
    场景 Winforn中设置ZedGraph曲线图的属性.坐标轴属性.刻度属性: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/10 ...
    
		
    9. 
						
  9. Winform中设置ZedGraph鼠标悬浮显示举例最近曲线上的点的坐标值和X轴与Y轴的标题
		
    场景 Winform中设置ZedGraph鼠标双击获取距离最近曲线上的点的坐标值: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/ ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. J2SE基础:5.面向对象的特性2
			
    Final的使用 final在类之前 表示该类是终于类.表示该类不能再被继承. final在方法之前 表示该方法是终于方法,该方法不能被不论什么派生的子类覆盖. final在变量之前 表示变量的值在初 ...
    
			
    2. 
						
  2. Android 学习历程摘要（三）
			
    1.proguard混淆:对与Activity等不应进行混淆.否则系统将找不到生命周期函数:JSON字符串要考虑混淆之后是否会影响字段名:native方法也不混淆,否则调用不到 2.ListView的 ...
    
			
    3. 
						
  3. Mahout--（一）数据承载
			
    mahout API英文解释:https://builds.apache.org/job/Mahout-Quality/javadoc/ 推荐数据的处理是大规模的,在集群环境下一次要处理的数据可能是数 ...
    
			
    4. 
						
  4. NodeJS经常使用模块收集
			
    收集了NodeJS开发中经常使用的一些模块. MVC框架 - Express Express 是轻量灵活的Nodejs Web应用框架.它能够高速地搭建站点. Express框架建立在Nodejs内置 ...
    
			
    5. 
						
  5. 由文字生成path后制作写字的动画
			
    在看以下这个开源组件的时候,发现一个非常棒的方法,能够将文字生成path,这样就能够作出用笔写字的效果了. https://github.com/MP0w/MPParallaxCollection 关 ...
    
			
    6. 
						
  6. CSS经典布局之弹性布局
			
    当我们在浏览浏览器的时候,经常会放大/缩小浏览器的显示比例,或者在不同的设备上.所处的分辨率也不尽同样. 因此.我们须要学习一个新的知识:弹性盒模型. 弹性盒模型 实现项目对齐,方向,排序(即使项目大 ...
    
			
    7. 
						
  7. 【bzoj1028】[JSOI2007]麻将
			
    首先枚举等待牌,再枚举对子牌.   然后1~n扫一遍,如果现在 s[i]不能被3整除,那么必须跟后两个数搭配几下变成能被3整除的.然后如果能被3整除,那么只要三个连续的一组可行,则三个相同的一组必定也 ...
    
			
    8. 
						
  8. samba访问其他服务器文件权限设置
			
    chown lynn.feng:lynn.feng nelson/ 我们知道档案权限对于一个系统的安全重要性,也知道档案的权限对于使用者与群组的相关性, 那如何修改一个档案的属性与权限呢? 我们这里介 ...
    
			
    9. 
						
  9. Hadoop之父Doug Cutting：Lucene到Hadoop的开源之路
			
    Hadoop之父Doug Cutting:Lucene到Hadoop的开源之路 Doug Cutting,凭借自己对工作的热情和脚踏实地的态度,开创了Lucene和Nutch两个成功的开源搜索引擎项目 ...
    
			
    10. 
						
  10. 洛谷P3402 最长公共子序列
			
    题目背景 DJL为了避免成为一只咸鱼,来找Johann学习怎么求最长公共子序列. 题目描述 经过长时间的摸索和练习,DJL终于学会了怎么求LCS.Johann感觉DJL孺子可教,就给他布置了一个课后作 ...
    
			
    11.