map area 用法示例

基础用法参考:点击查阅文档

代码示例:

    <div>
        <img src="./media/img/1-130Z2000247.jpg" usemap="#areaTest">
        <map name="areaTest" id="areaTest">
            <area shape="circ" coords="50,50,50" id="circ">
            <area shape="rect" coords="100,100,300,300" id="rect">
            <area shape="poly" coords="0,100,50,150,100,200,150,250,100,300,50,350" id="poly">
            <area shape="default" id="default">
        </map>
    </div>
    <!-- <script src="./plugin/vue.js"></script> -->
    <script src="./plugin/jquery-3.1.0.js"></script>
    <script>
        $('#circ').on('click',function() {
            console.log($(this))
            console.log('circ')
        })
        $('#rect').on('click',function() {
            console.log($(this))
            console.log('rect')
        })
        $('#poly').on('click',function() {
            console.log($(this))
            console.log('poly')
        })
        $('#default').on('click',function() {
            console.log($(this))
            console.log('default')
        })
    </script>

你可能感兴趣的:(HTML)