zoukankan      html  css  js  c++  java
  • 动态设置热区coords的坐标

    window.onresize = adjuest;
            function adjuest(){
                var picw = $(".imgbox img").width();
                var pich = $(".imgbox img").height();
                var x1 = parseInt(picw*0.28755);
                var y1 = parseInt(pich*0.511167);
                var x2 = parseInt(picw*0.39931);
                var y2 = parseInt(pich*0.5783333);
    
                var andx1 = parseInt(picw*0.28755);
                var andy1 = parseInt(pich*0.62);
                var andx2 = parseInt(picw*0.39931);
                var andy2 = parseInt(pich*0.671667);
                $("#ios").attr("coords",'"'+x1+','+y1+','+x2+','+y2+'"')
                $("#android").attr("coords",'"'+andx1+','+andy1+','+andx2+','+andy2+'"')
            }
            adjuest();

    事先算出热区的位置如
      <area shape="rect" coords="338,308,609,589" href="/" class="box" target="_blank" >
      比例参数 = 338/图片在当前电脑的真实宽度

    再用window.onresize监听图片,这样在图片大小变化的时候,热区依然在相应的位置
  • 相关阅读:
    containerd 与安全沙箱的 Kubernetes 初体验
    dubbo-go 中的 TPS Limit 设计与实现
    MVC
    DataGridView移动上下行
    Jquery hover 事件
    MVC
    MVC 基本概念
    AJAX简单封装
    ViewState
    PostBack
  • 原文地址:https://www.cnblogs.com/wanghaonull/p/6586808.html
Copyright © 2011-2022 走看看