jQuery鼠标经过地图城市标注显示详细信息代码【原创

来源:https://www.sucaihuo.com/js/2374.html 2017-07-10 20:17浏览(1503) 收藏

jQuery鼠标经过地图城市标注显示详细信息代码,jQuery地图城市标注代码,鼠标经过某个城市标注时切换显示该城市的文字介绍说明信息。
jQuery鼠标经过地图城市标注显示详细信息代码
分类:其它特效 > 地图 难易:
查看演示 下载资源 下载积分: 30 积分

js代码

<script type="text/javascript"> $(document).ready(function(){ $(".e_map_tags li").mouseover(function(){ $(this).addClass("centers").siblings("li").removeClass("centers"); var index=$(this).index(); $(".m_content").eq(index).show().siblings(".m_content").hide(); }); //左右切换 //点击左箭头 $(".m_left").click(function(){ //获取当前左切换 父亲的 index var sideindexL=$(this).parents(".m_content").index(); //全部隐藏 $(".m_content").hide(); //父亲的上一个显示 $(this).parents(".m_content").prev(".m_content").fadeIn(); //地图对应index添加默认样式 $(".e_map_tags li").eq(sideindexL-1).addClass("centers").siblings("li").removeClass("centers"); //当左切换为第一个时候 第一个显示 if(sideindexL==0){ $(".m_content:first").show(); alert("前面没有了!") $(".e_map_tags li").eq(0).addClass("centers").siblings("li").removeClass("centers"); } }); //点击右箭头 $(".m_right").click(function(){ //获取页面全部.m_content 的数量 var sideindexR=$(this).parents(".m_content").index(); $(".m_content").hide(); $(this).parents(".m_content").next(".m_content").fadeIn(); $(".e_map_tags li").eq(sideindexR+1).addClass("centers").siblings("li").removeClass("centers"); if(sideindexR==2){//这里的数字 是你地图的个数减去1 $(".m_content:last").show(); alert("最后一个了!") $(".e_map_tags li").eq(sidelenAll).addClass("centers").siblings("li").removeClass("centers"); } }); }); </script>

标签: 地图城市标注
声明:本文为原创文章,如需转载,请注明来源sucaihuo.com并保留原文链接:https://www.sucaihuo.com/js/2374.html
评论0
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791

1 2