动态设置热区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监听图片,这样在图片大小变化的时候,热区依然在相应的位置
动态设置热区coords的坐标的更多相关文章
- JavaScript DOM编程基础精华03(动态设置,层的操作,性能问题)
代码是否需要放置到onload中 //如果js代码需要操作页面上的元素,则将该代码放到onload里面. //因为当页面加载完毕之后页面上才会有相关的元素 //如果js代码中没有操作 ...
- android ImageView网络图片加载、动态设置尺寸、圆角..
封装了一个关于ImageView的辅助类,该类可以方便实现网络图片下载的同时,动态设置图片尺寸.圆角.....一系列连贯的操作,无样式表,java代码实现所有功能,使用很方便. package com ...
- 根据屏幕大小动态设置字体rem
1.根据屏幕大小动态设置字体rem var docEl = document.documentElement, //当设备的方向变化(设备横向持或纵向持)此事件被触发.绑定此事件时, //注意现在当浏 ...
- 动态设置和访问cxgrid列的Properties(转)
原文:http://www.cnblogs.com/hnxxcxg/archive/2010/05/24/2940711.html 动态设置和访问cxgrid列的Properties 设置: cxGr ...
- SSRS动态设置文本框属性
SSRS可以通过表达式动态设置文本框所有的属性,比如字体,字号,是否加粗,如下图所示: 汉字和数字英文字母占用的空间不一样,一个汉字占用两个数字和英文字母的空间,VB里有LENB取得字节数,这SSRS ...
- 【Android疑难杂症】GridView动态设置Item的宽高导致第一个Item不响应或显示不正常的问题
前言 这个问题在之前做一个盒子项目时遇到过,最近又遇到了,使用GridView遇到的非常奇葩的问题,这里记录分享一下. 声明 欢迎转载,但请保留文章原始出处:) 博客园:http://www.cnb ...
- 如果动态设置json对象的key
项目中要求动态设置json的key属性,如果按照一般的json设置方法是不行的.假如你把一个key设置为一个变量的话,那么最后js解析出来的就是key为这个变量名而不是这个变量的值. 解决:通过使用 ...
- Android 通过Java代码生成创建界面。动态生成View,动态设置View属性。addRules详解
废话不多说,本文将会层层深入给大家讲解如何动态的生成一个完整的界面. 本文内容: Java代码中动态生成View Java代码中动态设置View的位置,以及其他的属性 LayoutParams详解 一 ...
- easyui表单多重验证,动态设置easyui控件
要实现的功能:在做添加学生信息的时候,利用easyui的验证功能判断 学号是否重复和学号只能为数字 最终效果如下图: 但在做这个的过程中,遇到了一系列的问题: 扩展validatebox的验证方法,最 ...
随机推荐
- 23.each和map函数
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Navigator 传值
iOS 导航器 http://wiki.jikexueyuan.com/project/react-native/navigator-ios.html import React, { Componen ...
- 启动与销毁Activity
启动与销毁Activity 编写:kesenhoo - 原文:http://developer.android.com/training/basics/activity-lifecycle/start ...
- linux的sed(增删改查)使用方法
sed的增删改查的基本操作 参考:https://www.cnblogs.com/0zcl/p/6855740.html 01:增(a) 2个sed命令,分别是:(这些操作都是在内存中进行的,所以不会 ...
- [Alpha]Scrum Meeting#3
github 本次会议项目由PM召开,时间为4月3日晚上10点30分 时长15分钟 任务表格 人员 昨日工作 下一步工作 木鬼 撰写团队贡献分配计划(issue#39) 调整&分配工作 SiM ...
- [转] Jenkins pipeline 踩坑集合
[From] https://testerhome.com/topics/10328 前言 最近由于项目需要,接触到了Jenkins 2.0版本,其中最重要的特性就是提供了对pipeline的支持.简 ...
- archlinux安装串口终端ckermit
1. 将usb转串口连接到PC上.通过dmesg命令可以查看USB转串口是否被PC识别. 显示 ……attachec to ttyUSB0即被识别. linux系统一般有USB转串口驱动(PL ...
- crontab例行性共作
一.单一工作调度 at [-mldv] TIME at -c 工作号码 -m:当at工作结束后,即是没有输出信息,以email通知用户该工作已完成 -l:at -l相当于atq,列出目前系统上所有的a ...
- C运算符和表达式
C语言入门(5)——运算符与表达式 版权声明:本文为博主尹成联系QQ77025077,微信18510341407原创文章,欢迎转载侵权不究. https://blog.csdn.net/yinch ...
- Java 的多态
1 多态的概念 多态(?) 可以理解为多种状态/多种形态 同一事物,由于条件不同,产生的结果不同 程序中的多态 同一引用类型,使用不同的实例而执行结果不同的. 同:同一个类型,一般指父类. ...