PhotoSwipe 自适应高度
2018-01-23 10:09
169 查看
最近在做仿微信的图片预览,点击图片放大,并左右滑动,使用的Photoswiper插件,插件很好用,流畅度什么的都很好,就是一个data-size固定宽高比很恶心,看了很多资料,都没有解决,在快放弃这个插件的时候找到了解决方法,
在插件中加上红色的代码即可。
已经使用过了,兼容iOS、Android,在网上看到的办法,虽然能解决问题,但是只能兼容iOS。
如果对你又帮助,请问我打call:),点赞。
for(var i = 0; i < numNodes; i++) { 4000 figureEl = thumbElements[i]; // <figure> element // include only element nodes if(figureEl.nodeType !== 1) { continue; } linkEl = figureEl.children[0]; // <a> element var img = new Image(); img.src = linkEl.getAttribute('href'); linkEl.setAttribute('data-size', img.naturalWidth + 'x' + img.naturalHeight); size = linkEl.getAttribute('data-size').split('x'); // create slide object item = { src: linkEl.getAttribute('href'), w: parseInt(size[0], 10), h: parseInt(size[1], 10) }; if(figureEl.children.length > 1) { // <figcaption> content item.title = figureEl.children[1].innerHTML; } if(linkEl.children.length > 0) { // <img> thumbnail element, retrieving thumbnail url item.msrc = linkEl.children[0].getAttribute('src'); } item.el = figureEl; // save link to element for getThumbBoundsFn items.push(item); }
在插件中加上红色的代码即可。
已经使用过了,兼容iOS、Android,在网上看到的办法,虽然能解决问题,但是只能兼容iOS。
如果对你又帮助,请问我打call:),点赞。
相关文章推荐
- Android中RecycleView使用GridLayoutManager时自适应高度
- Label高度自适应
- CSS DIV自适应高度布局
- 自适应高度
- iOS UITextView输入时自适应高度,placeholderLabel的设置。
- 跨域iframe的高度自适应
- float浮动之后高度自适应失效解决方案
- div 自适应高度 自动填充剩余高度
- js脚本实现iframe框架自适应高度
- 二分栏的布局,自适应高度。
- Iframe 自适应高度并实时监控高度变化的js代码
- //iframe自适应高度[在IE6 IE7 FF下测试通过]
- iframe高度自适应
- 实现iFrame自适应高度
- IOS吐槽狂人:字体自适应高度(系统自带的)
- UItableview自适应高度
- Label的高度自适应和UItableViewCell的高度自适应
- CSS hack 多DIV嵌套 自适应高度问题
- iframe自适应高度(简单经典)兼容ie6-ie9 ,firefox,opera,chrome
- iframe的自适应高度及iframe中含有页签的高度动态适应