`

html img使用地图点击事件

    博客分类:
  • js
阅读更多
<img style="border:1px solid red;" src="localdata/logo/home_logo_#getOwnerCode().png?rnd=#getCurrTime_YYYYMMDDHHMMSS()" usemap="#pointMap" />
			<map name="pointMap">
        		<area shape="rect" coords="151,0,242,48" id="backDiyHome" />
            </map>

//点击返回定制首页
	jQuery("#backDiyHome").click(function(){
		_PAGE.initDiyHome();
	});

 

		<img src="../images/recycle/table1.png" id="pointExchange" usemap="#point_map"></img> 
		<map name="point_map" id="point_map">
    		<area shape="rect" coords="0,0,553,52" id="smallRecycle" />
    		<area shape="rect" coords="553,0,825,52" id="largeRecycle"/>
        </map>

//点击更换图片1
	jQuery("#largeRecycle").click(function(){
		_PAGE.pointExchange();
	});
	
	//点击更换图片2
	jQuery("#smallRecycle").click(function(){
		_PAGE.pointExchange2();
	});

 

 

注意:ID不支持,使用name

分享到:
评论

相关推荐

    HTML5 绘制地图方案

    3. **事件处理**:jVectorMap提供了丰富的事件监听器,例如点击地图区域时触发的`onRegionClick`事件,你可以根据需要编写回调函数,实现地图的交互功能。 4. **自定义样式**:通过设置样式属性,你可以改变地图的...

    全国各省市分开的地图 已经切片为html

    2. 利用HTML5的`&lt;img&gt;`标签,通过设置不同的`src`属性来加载不同省市的地图切片,同时使用`&lt;a&gt;`标签为每个切片设置链接,点击后跳转至相应省市的详细页面。 3. 结合现代前端框架(如React或Vue.js)和库(如Leaflet...

    html5+svg交互式3D商场地图代码

    SVG还支持事件监听,使得用户可以通过点击、拖动等方式与地图进行交互。 CSS(Cascading Style Sheets)在这里用于样式化HTML元素和SVG图形,使其符合设计需求。`css`文件夹中可能包含多个CSS文件,分别处理全局...

    全国各省市地图html版本

    切片后的HTML文件通常包含了图片元素(如&lt;img&gt;标签)和必要的CSS或JavaScript,以实现地图的正确显示和交互功能。 标签“各省市地图”进一步确认了内容性质,强调了这是中国所有省级行政区域的地图集合。 压缩包中...

    html图像地图map标签的使用

    ### HTML图像地图(map)标签的使用 在网页设计与开发中,HTML的`&lt;map&gt;`标签扮演着一个非常重要的角色,它允许我们为图像创建可交互的热点区域,即所谓的图像映射(image-map)。通过这种方式,用户可以点击图像上的...

    JS 调用天地图地图服务

    例如监听地图点击事件: ```javascript map.on('click', function(e) { console.log('点击坐标:', e.lnglat); }); ``` 9. **服务调用** - 天地图还提供了查询、定位、轨迹等服务,开发者可以通过API调用。...

    shandong地图HTML.rar

    另外,为了提升用户体验,JavaScript文件可能会处理用户的交互事件,例如点击地图上的某个区域弹出详细信息框,或者在搜索框中输入地名自动完成匹配。 总的来说,"shandong地图HTML.rar"可能是一个包含交互式山东省...

    仿美团外卖商家百度地图

    本项目旨在实现反向解析地址、自动地图搜索、选择区域跳转以及地图点击与拖拽定位等功能,以提供用户友好的地图服务。下面将详细阐述这些知识点: 1. **百度地图API**:百度地图API是百度提供的地图服务接口,...

    疫情地图htmljsjava

    - 交互设计:响应用户的鼠标点击或触摸事件,展示或隐藏数据详情,或者跳转到相关页面。 - 动画效果:例如,动态加载数据或平滑过渡到新的数据显示。 3. Java后端支持 虽然“疫情地图htmljsjava”主要强调前端...

    jQuery的百度地图自定义标注信息代码.zip

    在IT行业中,jQuery是一款广泛使用的JavaScript库,它简化了HTML文档遍历、事件处理、动画设计和Ajax交互等任务。而“jQuery的百度地图自定义标注信息代码”则结合了这两者的功能,提供了在百度地图上自定义标注点并...

    基于腾讯地图的坐标拾取器

    这款拾取器允许用户通过模糊查询找到多个地点,并且可以直接在地图上点击选取精确的坐标点。尽管由于上传限制无法查看实际效果,但根据描述,它应该具有良好的用户体验和易用性,适合集成到各种Web应用中。 首先,...

    开源 WebGIS:地图发布与地图服务_v2.pdf

    Web中的图层设计和交互元素,如点击事件、图例展示、比例尺控制等,是创建交互式地图应用时不可或缺的部分。 地图的内嵌比例尺和图例是地图使用的重要辅助元素,它们可以帮助用户理解地图的尺度和表示的地理信息。...

    js实现自己的网页地图可添加自己的标准和事件

    我们可以创建HTML元素(如`div`或`img`),然后设置其位置为地图上的特定坐标。使用JavaScript的DOM操作方法,如`createElement`、`appendChild`和`style`属性,我们可以动态地在地图上添加、删除或修改这些标志。 ...

    百度地图周边搜索

    可能还会包含一些事件监听器,用于响应用户的交互,比如点击地图上的标记以查看详细信息。 `mapfind-detail.js`文件可能与展示搜索结果的详细信息有关。当用户点击某个搜索结果时,这个文件中的函数可能会被触发,...

    jquery网络销售地图点击城市弹出信息层代码

    总结一下,实现"jquery网络销售地图点击城市弹出信息层代码"主要涉及以下步骤: 1. 创建HTML地图结构,定义可点击的城市区域。 2. 引入jQuery库并编写JavaScript代码,监听城市区域的点击事件。 3. 当事件触发时,...

    百度地图 infoBox 自定义信息框

    在本文中,我们将深入探讨如何使用百度地图API创建自定义的infoBox信息框,并实现自定义标注点模式。首先,让我们了解下基础概念。 百度地图API(Application Programming Interface)是百度提供的一套JavaScript库...

    如何制作一份疫情场所分布地图?(附数据和源码)

    同时,为了实现良好的用户交互,可能还需要使用JavaScript事件监听和处理,如点击事件,以响应用户的操作请求。 总的来说,制作疫情场所分布地图是一个综合性的任务,涵盖了地图API的使用、JSON数据处理、前端开发...

    全国各省市SVG地图.zip

    例如,可以使用JavaScript库如D3.js来处理SVG元素,实现地图的动态渲染,如数据驱动的地图颜色变化,或者添加地图上的热点区域。 对于开发者来说,这个SVG地图集非常实用,无论是用于教育、新闻报道还是数据分析...

    html5+svg交互式3D商场地图代码.zip

    在HTML5中,JavaScript可以与SVG元素进行交互,例如,通过监听用户的鼠标或触摸事件,实现图形的点击、拖动、旋转等操作。可能使用了`addEventListener`函数来绑定事件处理程序,以及`transform`属性来改变SVG元素的...

    html map 标签使用

    通常情况下,`&lt;map&gt;`标签会配合`&lt;img&gt;`标签一起使用,其中`&lt;img&gt;`标签的`usemap`属性值应与`&lt;map&gt;`标签的`name`或`id`属性值相匹配。 ##### 2.2 标签结构 `&lt;map&gt;`标签的基本结构如下: ```html &lt;img src="image....

Global site tag (gtag.js) - Google Analytics