(转)OL2中设置鼠标的样式
http://blog.csdn.net/gisshixisheng/article/details/49496289
概述:
在OL2中,鼠标默认是箭头,地图移动时,鼠标样式是移动样式;很多时候,为了形象起见,我们总是希望鼠标在地图上的时候和移动地图的时候鼠标的样式不是默认的效果,本文讲述如何实现这样的效果。
实现方式:
通过下面的代码实现修改鼠标样式。
map.layerContainerDiv.style.cursor = ("url(img/openhand.cur),default");
在地图初始化完成后,设置地图的样式,并添加map的move和moveend事件,实现的完整代码如下:
- <!DOCTYPE html>
- <html>
- <head lang="en">
- <meta charset="UTF-8">
- <title>openlayers map</title>
- <link rel="stylesheet" href="http://localhost/olapi/theme/default/style.css" type="text/css">
- <style>
- html, body{
- padding:0;
- margin:0;
- height:100%;
- width:100%;
- overflow: hidden;
- font-size: 12px;
- }
- #map1{
- width: 500px;
- height: 500px;
- float: left;
- overflow: hidden;
- border: 1px solid #f0e68c;
- }
- </style>
- <script src="../../../plugin/OpenLayers-2.13.1/OpenLayers.js"></script>
- <script src="../../../plugin/jquery/jquery-1.8.3.js"></script>
- <script>
- var map1;
- $(function(){
- var bounds = new OpenLayers.Bounds(
- 73.45100463562233, 18.16324718764174,
- 134.97679764650596, 53.531943152223576
- );
- var options = {
- controls: [],
- maxExtent: bounds,
- maxResolution: 0.2403351289487642,
- projection: "EPSG:4326",
- units: 'degrees'
- };
- map1 = new OpenLayers.Map('map1', options);
- var wms = new OpenLayers.Layer.WMS(
- "Geoserver layers - Tiled",
- "http://localhost:8088/geoserver/lzugis/wms",
- {
- "LAYERS": "province",
- "STYLES": '',
- format: 'image/png'
- },
- {
- buffer: 0,
- displayOutsideMaxExtent: true,
- isBaseLayer: true,
- yx : {'EPSG:4326' : true}
- }
- );
- map1.addLayer(wms);
- map1.addControl(new OpenLayers.Control.Zoom());
- map1.addControl(new OpenLayers.Control.Navigation());
- map1.zoomToExtent(bounds);
- map1.layerContainerDiv.style.cursor = ("url(img/openhand.cur),default");
- map1.events.register("move", map1, function(){
- map1.layerContainerDiv.style.cursor = ("url(img/closedhand.cur),default");
- });
- map1.events.register("moveend", map1, function(){
- map1.layerContainerDiv.style.cursor = ("url(img/openhand.cur),default");
- });
- });
- </script>
- </head>
- <body>
- <div id="map1"></div>
- </body>
- </html>
(转)OL2中设置鼠标的样式的更多相关文章
- 【Java】在JTable中设置鼠标监听器,点击操作对应数据
最终效果 鼠标点击JTable中任一数据,修改相应的信息. 确定点击的行和列 package com.dao; import java.awt.event.MouseAdapter; import j ...
- 对span设置鼠标光标样式
<html> <body> <p>请把鼠标移动到单词上,可以看到鼠标指针发生变化:</p> <span style="cursor:au ...
- Extjs中设置只读的样式问题
废话不多说,直接上代码: view.down('#imageFile').hide(); view.down('#save_button').hide(); view.show(); view.d ...
- flash中设置文本字体样式
txt.setTextFormat(tf); txt.defaultTextFormat = tf;
- Html中<a>标签的样式的设置
html中<a>标签的样式的设置.. ------------------------ <html> <head> <title>这是网页选项卡的名称& ...
- Qt中设置widget背景颜色/图片的注意事项(使用样式表 setStyleSheet())
在Qt中设置widget背景颜色或者图片方法很多种:重写paintEvent() , 调色板QPalette , 样式表setStyleSheet等等. 但是各种方法都有其注意事项,如果不注意则很容易 ...
- wxpython 设置鼠标样式
鼠标指针被设置为放大镜样式.可用的鼠标指针样式有: wx.CURSOR_ARROWwx.CURSOR_RIGHT_ARROWwx.CURSOR_BLANKwx.CURSOR_BULLSEYEwx.CU ...
- Winform中设置ZedGraph曲线图的字体样式是避免出现边框
场景 Winforn中设置ZedGraph曲线图的属性.坐标轴属性.刻度属性: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/10 ...
- Winform中设置ZedGraph鼠标悬浮显示举例最近曲线上的点的坐标值和X轴与Y轴的标题
场景 Winform中设置ZedGraph鼠标双击获取距离最近曲线上的点的坐标值: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/ ...
随机推荐
- new出来的对象无法调用@Autowired注入的Spring Bean
@Autowired注入Spring Bean,则当前类必须也是Spring Bean才能调用它,不能用new xxx()来获得对象,这种方式获得的对象无法调用@Autowired注入的Bean. 1 ...
- SiteMesh2-sitemesh.xml的其它映射器的用法
在sitemesh.xml中做常用的三个映射器,总结如下: 映射器元素的顺序确定优先级.良好的应用程序应使用以下顺序, Parameter query = ParameterDecoratorMapp ...
- sql-server-storage-internals
https://www.simple-talk.com/sql/database-administration/sql-server-storage-internals-101/
- MS SQL SERVER 书BOOK
http://www.cnblogs.com/lyhabc/p/4833248.html
- windows下检測文件改变
这个主要是应用在我前一篇博客里提到的脚本热载入功能. 主要实现的功能检測目录内文件的变化(改变.新增.删除.重命名),当发现改变的时候通知lua又一次载入脚本.基本上就是一个windows api的使 ...
- HDU1813:Escape from Tetris(IDA)
Problem Description 因为整日整夜地对着这个棋盘,Lele最终走火入魔.每天一睡觉.他就会梦到自己会被人被扔进一个棋盘中,一直找不到出路,然后从梦中惊醒.久而久之,Lele被搞得精神 ...
- 0x0118消息就是WM_SYSTIMER
http://social.msdn.microsoft.com/Forums/vstudio/en-US/c0f9bac9-d211-4b8b-ba99-f5a0ed0d2e0a/what-is-w ...
- Codesys——PLCopen基本运动控制功能块的使用方法总结
MC_Halt 在MC_MoveVelocity模式下,用MC_Halt停止其轴,当前轴的状态由 ContinuousMotion(当前转速)--->DiscreteMotion(速度不为0)- ...
- 【POJ 2559】 Largest Rectangle in a Histogram
[题目链接] http://poj.org/problem?id=2559 [算法] 单调栈 [代码] #include <algorithm> #include <bitset&g ...
- 44. Ext信息提示对话框
转自:https://www.cnblogs.com/glsqh/p/5920500.html Ext.window.MessageBox是一个工具类,他继承自Ext.window.Windoe对象, ...