javascript - map 热点area如何做到自适应啊.
怪我咯
怪我咯 2017-04-10 15:48:56
[JavaScript讨论组]

有一张全屏的背景图是1920px. 要在上面加几个可点击区域链接.当然想到的是map. area来做吧

可问题来了 如何做到在不同像素的显示器做到可点区域取值正确啊 ?

百度查到说是用js拿到现在的innerWidth然后除以你之前定义好像素;

var resutl = current.innerrWidth/1920;
area.coords * result;

这样的话取值还是不太正确.有偏差

怪我咯
怪我咯

走同样的路,发现不同的人生

全部回复(2)
阿神

是这个意思不?
background肯定不是自适应宽度的吧? 这1920px里面也不会在两边留黑的地方(如图示意)有内容可点击吧?
假定一个红色区域,比如宽1000px,只需要注意一下分辨率或者窗口尺寸宽度不足的时候调整一下左偏移值就可以了,红色relative, 蓝色可点击区域absolute这样不就可以找好位置么?

话说现在怎么还有这么奇葩的需求- - 整个一张背景图上面找地方做可点击热点,不考虑hover或者active时候的变化么。。

======================
内容主体宽度是固定的吧?

背景上内容主体部分加相对定位,然后可点击部分用绝对定位控制就OK。

阿神

js完成加载时遍历所有热点,然后重新赋值,就这样

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号