码迷,mamicode.com
首页 > 移动开发 > 详细

map area (append)

时间:2014-09-12 23:35:44      阅读:427      评论:0      收藏:0      [点我收藏+]

标签:style   http   color   io   os   ar   div   sp   cti   

<html>
<body>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<!--<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>-->
<script >
    $(function(){
        $("map area").hover(function(){
            $("#content").empty().append(this.alt).show();;

        },function(){
            $("#content").hide();
        })
    })
</script>
<img
src="eg_planets.jpg"
border="0" usemap="#planetmap"
alt="Planets" />

<map name="planetmap" id="planetmap">

<area
shape="circle"
coords="180,139,14"
href ="/example/html/venus.html"
target ="_blank"
alt="Venus" />

<area
shape="circle"
coords="129,161,10"
href ="/example/html/mercur.html"
target ="_blank"
alt="Mercury" />

<area
shape="rect"
coords="0,0,110,260"
href ="/example/html/sun.html"
target ="_blank"
alt="Sun" />

</map>

<div id="content" style="position: absolute;top: 50%;left: 50%;display: none;width: 200px;height: 20px;background-color: red;">

</div>
</body>
</html>

map area (append)

标签:style   http   color   io   os   ar   div   sp   cti   

原文地址:http://my.oschina.net/glelaine/blog/313086

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!