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监听图片,这样在图片大小变化的时候,热区依然在相应的位置

动态设置热区coords的坐标的更多相关文章

  1. JavaScript DOM编程基础精华03(动态设置,层的操作,性能问题)

    代码是否需要放置到onload中  //如果js代码需要操作页面上的元素,则将该代码放到onload里面.         //因为当页面加载完毕之后页面上才会有相关的元素 //如果js代码中没有操作 ...

  2. android ImageView网络图片加载、动态设置尺寸、圆角..

    封装了一个关于ImageView的辅助类,该类可以方便实现网络图片下载的同时,动态设置图片尺寸.圆角.....一系列连贯的操作,无样式表,java代码实现所有功能,使用很方便. package com ...

  3. 根据屏幕大小动态设置字体rem

    1.根据屏幕大小动态设置字体rem var docEl = document.documentElement, //当设备的方向变化(设备横向持或纵向持)此事件被触发.绑定此事件时, //注意现在当浏 ...

  4. 动态设置和访问cxgrid列的Properties(转)

    原文:http://www.cnblogs.com/hnxxcxg/archive/2010/05/24/2940711.html 动态设置和访问cxgrid列的Properties 设置: cxGr ...

  5. SSRS动态设置文本框属性

    SSRS可以通过表达式动态设置文本框所有的属性,比如字体,字号,是否加粗,如下图所示: 汉字和数字英文字母占用的空间不一样,一个汉字占用两个数字和英文字母的空间,VB里有LENB取得字节数,这SSRS ...

  6. 【Android疑难杂症】GridView动态设置Item的宽高导致第一个Item不响应或显示不正常的问题

    前言 这个问题在之前做一个盒子项目时遇到过,最近又遇到了,使用GridView遇到的非常奇葩的问题,这里记录分享一下. 声明 欢迎转载,但请保留文章原始出处:)  博客园:http://www.cnb ...

  7. 如果动态设置json对象的key

    项目中要求动态设置json的key属性,如果按照一般的json设置方法是不行的.假如你把一个key设置为一个变量的话,那么最后js解析出来的就是key为这个变量名而不是这个变量的值. 解决:通过使用 ...

  8. Android 通过Java代码生成创建界面。动态生成View,动态设置View属性。addRules详解

    废话不多说,本文将会层层深入给大家讲解如何动态的生成一个完整的界面. 本文内容: Java代码中动态生成View Java代码中动态设置View的位置,以及其他的属性 LayoutParams详解 一 ...

  9. easyui表单多重验证,动态设置easyui控件

    要实现的功能:在做添加学生信息的时候,利用easyui的验证功能判断 学号是否重复和学号只能为数字 最终效果如下图: 但在做这个的过程中,遇到了一系列的问题: 扩展validatebox的验证方法,最 ...

随机推荐

  1. 生产者消费者模式-Java实现

    感知阶段 随着软件业的发展,互联网用户的日渐增多,并发这门艺术的兴起似乎是那么合情合理.每日PV十多亿的淘宝,处理并发的手段可谓是业界一流.用户访问淘宝首页的平均等待时间只有区区几秒,但是服务器所处理 ...

  2. thinkphp3.2----设置静态缓存

    开启静态缓存后,页面刷新时获取的是静态页面,控制器增加输出内容时页面还是一样,除非超过缓存时间或html结构发生变化才重新生成页面缓存 1.定义静态缓存目录 define("HTML_PAT ...

  3. [web]深入理解Session和Cookie

    一.理解Cookie 由于http是一种无状态的协议,当用户的一次访问结束后,后端的服务器就无法知道下一次来访问的请求是不是上一次的用户了.那么Cookie的作用就是用户通过http访问一个服务器时, ...

  4. 读《3M 利率分析新框架》

    目录 读<3M 利率分析新框架> 前言 传统的利率研究框架 3M 利率研究新框架 Macro Monetary Macro Prudence 总结 参考文献 <3M 利率分析新框架& ...

  5. px,em, rem的区别,在项目中怎么使用rem.

    一.px px像素,绝对单位.像素px是相对于显示器屏幕分辨率而言的,是一个虚拟的长度单位,是计算机系统的数字化图像长度单位,如果px要换算成物理长度单位,需要指定精度DPI. 二.em em是相对长 ...

  6. session和cookie的知识总结

    1.HTTP协议 由HTTP客户端发起一个请求,建立一个到服务器指定端口(默认是80端口)的TCP连接.HTTP服务器则在那个端口监听客户端发送过来的请求.一旦收到请求,服务器(向客户端)发回一个状态 ...

  7. selectComponent是ok的,小程序组件 component方式,让子页面重绘

    this.selectComponent('#news').init(); 其中news是父级xml文件引用子组件的时给子组件的id. 当父级传给子级的数据有变化时,需要子页面重绘,所以就用上面那行代 ...

  8. java设计模式学习笔记

    简介 设计模式可以分为五类 接口型 模式:适配器模式,外观模式,合成模式,桥接模式 职责型 模式:单例模式,观察者模式,调停者模式,代理模式,职责链模式,享元模式 构造型 模式:构建者模式,工厂方法模 ...

  9. Storm个人学习总结

    https://www.jianshu.com/p/c7fba7d6a24d https://www.cnblogs.com/peak-c/p/6297794.html https://blog.cs ...

  10. excel时间戳转化为标准日期(日期转化为日期戳)

    最近在学习python将数据导入到excel,发现日期变成数字而不是日期格式的问题. 第一眼看去肯定是excel单元格格式问题,一般excel单元格格式为常规,而常规处理日期时就显示为数字,所以就想到 ...