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. 1.4－动态路由协议OSPF③
			
    OSPF的路由汇总 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~                         用默认的网络地址 因为 无论在何种路 ...
    
			
    2. 
						
  2. androidannotations的background和UiThread配合使用參考
			
    简单介绍 androidannotations在开发中的代码规范思考:(MVC思考)时间太紧,先贴代码: Activity的代码: package edu.njupt.zhb.main; import ...
    
			
    3. 
						
  3. Go语言用堆排序的方法进行一千万个int随机数排序.
			
    上篇文章用的是quicksort方法排序,可是假设用高速排序法对反复率非常高的slice排序的时候,时间复杂度会激增,速度相当慢 所以尝试了一下堆排序,实验结果,感觉挺好的.以下是代码,大家能够參考一 ...
    
			
    4. 
						
  4. Python3基础（十一） 类的拓展
			
    在类的初印象中,我们已经简单的介绍了类,包括类的定义.类对象和实例对象.本文将进一步学习类的继承.迭代器.发生器等等. 一.类的继承 单继承 派生类的定义如下: class DerivedClassN ...
    
			
    5. 
						
  5. Java Web开发基础（1）-Servlet
			
    概述 Servlet技术是对webserver的扩展,要理解这个,可能先了解一下什么是Webserver以及它的功能,特别是它的不足是非常有帮助的,可參考:点击打开链接.另外.Servlet也是一个用 ...
    
			
    6. 
						
  6. sql_server_action
			
    ''' SELECT * FROM Info_Roles WHERE Flag=1 LIMIT 2; select top y * from 表 where 主键 not in(select top  ...
    
			
    7. 
						
  7. HDU 5862Counting Intersections
			
    Counting Intersections Time Limit: 12000/6000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/ ...
    
			
    8. 
						
  8. XAML实例教程系列 - 命名空间(NameSpace) 三
			
    XAML实例教程系列 - 命名空间(NameSpace) 2012-05-28 14:14 by jv9, 2205 阅读, 10 评论, 收藏, 编辑 上一篇曾提及XAML中,每个对象元素的声明是对 ...
    
			
    9. 
						
  9. .net连接MySQL数据库的方案与实例演示
			
    以下的文章主要是向大家描述的是.net连接MySQL数据库的实际操作方法与其实例的演示.net连接MySQL数据库的实际操作方案我们主要是将其分成三部分,以下的文章就有其详细内容的描述. http:/ ...
    
			
    10. 
						
  10. cf2.25
			
    T1 题意:判断给出的数中有多少不同的大于的数. content:傻逼题,5min手速 T2 题意:给出p.y,输出y~p+1中最大一个不是2-p的倍数的数. content:答案很简单,但是很难想到 ...
    
			
    11.