最近做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. HDU.3177Crixalis's Equipment(贪心)

    题目来源:3177 题目分析:一只蝎子要搬动一堆装备到一个容量为V的洞里面,每个装备有两个属性,一个是固有体积A,放置之后洞的剩余空间就会减少A,一个是移动体积B,只有当体积B小于等于当前洞的剩余体积 ...

  2. 【清真dp】cf1144G. Two Merged Sequences

    成就:赛后在cf使用错误的贪心通过一题 成就:在cf上赛后提交hack数据 成就:在cf上赛后hack自己 题目大意 有一长度$n \le 2\times 10^5$的序列,要求判断是否能够划分为一个 ...

  3. ssm整合-图片上传功能（转）

    本文介绍 ssm (Spring+SpringMVC+Mybatis)实现上传功能. 以一个添加用户的案例介绍(主要是将上传文件). 一.需求介绍 我们要实现添加用户的时候上传图片(其实任何文件都可以 ...

  4. django+xadmin在线教育平台（八）

    4-5 user modesl.py设计 循环引用: 设计app时每个app都有model   mark 如图:我们在user中定义usercourse记录用户学习的课程.会有两个外键:user和co ...

  5. js函数的默认参数

    function f(flag, start, end, msg){ flag = flag == false ? flag : true; start = start || null; start ...

  6. scrapy--json(360美图)

    之前开始学习scrapy,接触了AJax异步加载.一直没放到自己博客,趁现在不忙,也准备为下一个爬虫做知识储存,就分享给大家. 还是从爬取图片开始,先上图给大家看看成果,QAQ. 一.图片加载的方法 ...

  7. 在ubuntu上安装subline

    Sublime Text is a most popular, lightweight and smart cross-platform text and source code editor wit ...

  8. vue 点击当前元素添加class 去掉兄弟的class

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...

  9. C语言基础篇（三） 指针

    导航: 1.指针     2. 数组     3. 结构体,共用体     4. 内存分布图     5. 段错误分析 ----->x<------------->x<---- ...

  10. [BZOJ2527] [Poi2011]Meteors（整体二分）

    对于单个国家,可以对答案进行二分,每次找出此时的陨石数量,如果大于需要的那么答案就在[l,mid],否则就在[mid+1,r]里面 而对于很多国家,也可以进行二分,solve(l,r,L,R)表示询问 ...