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. iOS推断当前控制器是否在显示
			
    当点击一个cell或者button的事件,处理比較耗时,在异步线程中执行中.当子线程得到执行结果时可能不在当前控制器上了.此时我们须要取消子线程后边的事情. 此刻,当得到结果时须要推断是否在当前控制器 ...
    
			
    2. 
						
  2. Java程序学习中各阶段的建议
			
    第一部分:对于尚未做过Java工作的同学,包括一些在校生以及刚准备转行Java的同学. 一.Java基础 首先去找一个Java的基础教程学一下,这里可以推荐一个地址,或者你也可以参照这个地址上去找相应 ...
    
			
    3. 
						
  3. GitHub 高速上手 ---- 创建密钥，连接
			
    首先要在GitHub上创建一个帐号,因为本地Git仓库和GitHub仓库之间的传输是通过SSH加密的,所以要在本地生成一个私钥和一个密钥 命令,后面跟的邮箱.要跟你自己的:增加输出的位置:能够不用设置 ...
    
			
    4. 
						
  4. 从头认识Spring-1.9 内部类注入Bean
			
    这一章节我们来讨论一下内部类注入Bean. 1.domain 蛋糕类:(跟前一章节的一样) package com.raylee.my_new_spring.my_new_spring.ch01.to ...
    
			
    5. 
						
  5. Elasticsearch安装中文分词插件ik
			
    Elasticsearch默认提供的分词器,会把每一个汉字分开,而不是我们想要的依据关键词来分词.比如: curl -XPOST "http://localhost:9200/userinf ...
    
			
    6. 
						
  6. 【BZOJ 3032】 七夕祭
			
    [题目链接] https://www.lydsy.com/JudgeOnline/problem.php?id=3032 [算法] 交换左右两个相邻格子的摊点,不会改变这一行的摊点个数 交换上下两个相 ...
    
			
    7. 
						
  7. Spark2.0 VS Spark 1.*  -------SparkSession的区别
			
    Spark .0以前版本: val sparkConf = new SparkConf().setAppName("soyo") val spark = new SparkCont ...
    
			
    8. 
						
  8. 如何为你的Go应用创建轻量级Docker镜像？
			
    介绍 多什么? 简单来讲,多阶段. 多阶段允许在创建Dockerfile时使用多个from,它非常有用,因为它使我们能够使用所有必需的工具构建应用程序.举个例子,首先我们使用Golang的基础镜像,然 ...
    
			
    9. 
						
  9. mysql的启动和停止
			
    1.检查数据库服务器是否开启:任务管理器-->后台进程-->查看mysqld是否存在.存在说明开启了,反之没开启 2.管理员运行cmd,输入重启指令:net start **(**数据库名 ...
    
			
    10. 
						
  10. bzoj2427:[HAOI2010]软件安装(Tarjan+tree_dp)
			
    2427: [HAOI2010]软件安装 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 1053  Solved: 424[Submit][Statu ...
    
			
    11.