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. LeetCode 771.  Jewels and Stones (宝石与石头)
			
    题目标签:Hash Table 这一题很简单,题目给了两个string:J 和 S. 只要把J 里面的 char 放入HashSet,再遍历S找出有多少个石头是宝石. Java Solution: R ...
    
			
    2. 
						
  2. 如何用分布式缓存服务实现Redis内存优化
			
    Redis是一种支持Key-Value等多种数据结构的存储系统,其数据特性是“ALL IN MEMORY”,因此优化内存十分重要.在对Redis进行内存优化时,先要掌握Redis内存存储的特性比如字符 ...
    
			
    3. 
						
  3. UVA - 10691 Subway
			
    题目大意:给定n个点.要求建造尽量少得铁路(从原点发射出的射线).使得全部点到铁路的最短距离小于d. 解题思路:题目能够转化成区间选点问题,即以极角来表示铁轨.然后计算出每一个区间可行的极角范围,进行 ...
    
			
    4. 
						
  4. YTU 2797: 复仇者联盟之关灯
			
    2797: 复仇者联盟之关灯 时间限制: 1 Sec  内存限制: 128 MB 提交: 563  解决: 160 题目描述 输入n(1~500)盏灯并编号,输入1~9(包含1和9)的数字m,灭掉编号 ...
    
			
    5. 
						
  5. 大文件Copy 大数据量复制
			
    private void button3_Click(object sender, EventArgs e)        {                        Thread thread ...
    
			
    6. 
						
  6. extern_c
			
    (1)    使用extern和包含头文件来引用函数有什么区别呢?extern的引用方式比包含头文件要简洁得多!extern的使用方法是直截了当的,想引用哪个函数就用extern声明哪个函数.这大概是 ...
    
			
    7. 
						
  7. JSP-Runoob：JSP 语法
			
    ylbtech-JSP-Runoob:JSP 语法 1.返回顶部 1. JSP 语法 本小节将会简单地介绍一下JSP开发中的基础语法. 脚本程序 脚本程序可以包含任意量的Java语句.变量.方法或表达 ...
    
			
    8. 
						
  8. Python机器学习算法 — KNN分类
			
    KNN简介 K最近邻(k-Nearest Neighbor,KNN)分类算法,是一个理论上比较成熟的方法,也是最简单的机器学习算法之一.KNN分类算法属于监督学习. 最简单最初级的分类器是将全部的训练 ...
    
			
    9. 
						
  9. python - 解决 ModuleNotFoundError: No module named 'pip'
			
    1.pip的版本为 9.0.3  想用 pip install -U pip 更新下包,但是在更新过程中出现了报错,如下所示: 2.然后尝试用pip install pandas包,提示 Module ...
    
			
    10. 
						
  10. 如何看待B站疑似源码泄漏的问题？
			
    今天突然看到关于B站源码泄漏事.网曝B站整个网站后台工程源码遭泄露,开源项目平台Github上疑似出现了Bilibili网站后台工程,内含部分用户名密码.目前官方还没对此事作出任何回应,所以还无法确定 ...
    
			
    11.