• JavaScript 图像地图

    JavaScript 图像地图：图像地图指的是带有可点击区域的图像。

    简单的 HTML 图像映射

    <html>

    <body>

    <img src="../i/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>

    </body>
    </html>
    添加了 JavaScript 的图像映射

    <html>
    <head>
    <script type="text/javascript">
    function writeText(txt)
    {
    document.getElementById("desc").innerHTML=txt
    }
    </script>
    </head>

    <body>
    <img src="../i/eg_planets.jpg"  border="0" usemap="#planetmap" alt="Planets" />

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

    <area shape="circle" coords="180,139,14"
    onMouseOver="writeText('直到 20 世纪 60 年代，金星一直被认为是地球的孪生姐妹，因为金星是离我们最近的行星，同时还由于两者拥有很多共同的特征。')"
    href ="../example/html/venus.html"  target ="_blank" alt="Venus" />

    <area shape="circle" coords="129,161,10"
    onMouseOver="writeText('从地球上是很难研究水星的，这样由于它和太阳的距离总是很近。')"
    href ="../example/html/mercur.html"  target ="_blank" alt="Mercury" />

    <area shape="rect" coords="0,0,110,260"
    onMouseOver="writeText('太阳和类似木星这样的气态行星是到目前为止太阳系中最大的物体。')"
    href ="../example/html/sun.html"  target ="_blank" alt="Sun" />

    </map>

    <p id="desc"></p>

    </body>
    </html>


     
  • 相关阅读:
    AIX中设备管理
    重置Brocade光纤交换机的管理IP地址
    博科 5300 光纤交换机配置 备份和恢复
    博科 5300 光纤交换机配置
    博科光纤交换机常用指令
    RHEL6使用系统自带多路径软件配置多路径
    Linux使用storcli工具查看服务器硬盘和raid组信息
    Linux文件管理
    Linux目录管理
    前端开发JS——jQuery常用方法
  • 原文地址：https://www.cnblogs.com/zwq194/p/1735493.html
Copyright © 2020-2023  润新知