最近做MOBILE的HTML5开发，人体图和页面一样，需要自适应不同的手机屏幕，蛋疼的是coords里面的标记是固定的，图片自适应后，锚点的标记就会产生空白区域，看了下
https://github.com/stowball/jQuery-rwdImageMaps rwd这个JQ的插件可以搞定，郁闷的是JQ太庞大了，太损耗性能了，先标记下，然后用JO或者JMOBI来重构。
$(document).ready(function(e) {

    $('img[usemap]').rwdImageMaps();

});

锚点自适应 map area coords的更多相关文章

  1. html中map area 热区自适应的原生js实现方案

    在做自适应网页的时候,如果在图片中使用了热区map.图片可以通过样式实现:图片大小随页面变化,但是MAP中每个area的坐标并不能通过css直接实现自适应.这篇文章就介绍通过原生js来实现:MAP中每 ...

  2. 如何为图片添加热点链接？（map + area）

    所谓图片热点链接就是为图片指定一个或多个区域以实现点击跳转到指定的页面.简单来说就是点击某一区域就能跳转到相应的页面,而无需点击整个图片才能跳转. 说到图片热点链接,我首先想到了map + area, ...

  3. 谈谈html中一些比较"偏门"的知识(map&area；iframe；label)

    说明:这里所说的"偏门"只是相对于本人而言,记录在此,加深印象.也希望有需要的朋友能获得些许收获! 1.空元素(void):没有内容的元素. 常见的有:<br>,< ...

  4. HTML图片热区map area的用法

    <area>标记主要用于图像地图,通过该标记可以在图像地图中设定作用区域(又称为热点),这样当用户的鼠标移到指定的作用区域点击时,会自动链接到预先设定好的页面.其基本语法结构如下: < ...

  5. [转]如何为图片添加热点链接？（map + area）

    原文地址:https://www.cnblogs.com/jf-67/p/8135004.html 所谓图片热点链接就是为图片指定一个或多个区域以实现点击跳转到指定的页面.简单来说就是点击某一区域就能 ...

  6. HTML图片热区 map area 标签

    实例 <img src ="planets.gif" alt="Planets" usemap ="#planetmap" /> ...

  7. map+area标签

    map标签是用于定义一个客户端的图像映射即带有可点击区域的一幅图像,配合area标签 area 元素永远嵌套在 map 元素内部.area 元素可定义图像映射中的区域 例:要实现一幅地图上鼠标点击或者 ...

  8. Can't find kernel text map area from kcore

    kernel : 4.9.51kexec-tools : 2.0.4 1.~ # ./kexec -p /boot/vmlinuz --initrd=/boot/initrd --command-li ...

  9. html5在手机端关于 map area中的自适应

    https://github.com/stowball/jQuery-rwdImageMaps用这一个插件可自适应!!!

随机推荐

  1. currency 过滤器

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  2. 记一次EBS正式环境补丁安装的过程

    因菏泽能源上线需求,需要在8009上修复集团8000环境上已经修复的所有补丁程序,修复前做应用及数据库层备份,完成修复后解决并发管理器无法启动的问题.此为概述. 应用层备份 应用层的备份采用直接压缩备 ...

  3. ionic 命令cordova

    安装android platform : ionic platform add android 安装一维码cordova插件 :cordova plugin add https://github.co ...

  4. Python 初始—(字符编码解码)

    字符编码之间的编码转换则需要通过Unicode 进行转换,那么需要一个编码和解码实现与Unicode进行关联转换 例如utf-8转gbk utf-8----decode----->Unicode ...

  5. springMVC-数据绑定

    定义: 将http请求中参数绑定到Handler业务方法 常用数据绑定类型 1.  基本数据类型 不能为其它类型和null值 2.  包装类 可以为其它对象,全部转成null值 3.  数组 多个对象 ...

  6. IDEA怎么生成UML类图

    说之前先说一下Diagram这个单词,意思是图表; 示意图; 图解; [数] 线图的意思. 打开设置 File->Setting或windows下按Ctrl+Alt+S 在搜索框中输入Diagr ...

  7. spring boot+log4j2快速使用（一）

    log4j是Apache的一个开源项目,log4j2和log4j是一个作者,只不过log4j2是重新架构的一款日志组件,他抛弃了之前log4j的不足,以及吸取了优秀的logback的设计重新推出的一款 ...

  8. C#基础-异常处理与自定义异常

    异常处理 static void Main(string[] args) { Console.WriteLine("请输入一个数字:"); try { // 监测可能出现异常代码 ...

  9. 简单php实现同一时间内一个账户只允许在一个终端登陆

    在账户表的基础上,我新建了一个账户account_session表,用来记录登录账户的account_id和最新一次登录成功用户的session_id,然后首先要修改登录方法:每次登录成功后,要将登录 ...

  10. 百度MIP校验错误整理与解决方法

    MIP校验工具地址: https://www.mipengine.org/validator/validate 1.强制性标签缺失或错误 错误提示:line 1,col 1: 强制性标签'<sc ...