SuperSlider 2.x 无缝滚动在IE浏览器的兼容问题

用SuperSlider2.1.3（JQuery1.6.2）做向左无缝滚动效果，vis=7，在Chrome浏览器下正常，IE11下，每次只有一个在滚动，查询SuperSlider2.1.3的常见问题栏目后，找到下面的说明。根据说明将li的Width计算好进行了样式设置，该问题解决。

另外，发现开始比较卡，待处理。

http://www.superslide2.com/blog/?p=61
SuperSlide滚动的遮罩层宽/高怎么计算的？如何设置具体一个值？
当我们使用滚动效果，例如：left、leftLoop、top、topLoop、leftMarquee、topMarquee等的时候，SuperSlide会自动设置一个“遮罩层（tempWrap）”来限制可视范围，超出范围的将会被隐藏起来。

可视范围取决于 vis 参数和一个滚动元素的宽高，例如：
参数vis：3，effect：left；滚动元素为li。即li左滚动，可视范围为3个li宽度。
公式： tempWrap宽度 = li宽度 * vis = （li的width + li的padding + li的margin）*3

SuperSlider 2.x 无缝滚动在IE浏览器的兼容问题相关推荐

js自下而上无缝滚动
js自下而上无缝滚动的小例子,能兼容ie8 鼠标悬停时可以停止滚动 function scrollup(){ if(box.scrollTop>=l1.offsetHeight){ //滚动条距 ...
html5轮播怎么自动换图,如何使用JavaScript实现“无缝滚动自动播放”轮播图效果...
在一些项目开发中,我们经常需要使用到轮播图,但是没有深入学习的情况下做轮播图是非常困难的. 思路分成小问题来解决 1. 动态生成序号12345 页面有多少li(图片),就有多少序号 2. 点击序号. ...
Vue 之 vue-seamless-scroll 实现简单自动无缝滚动，且添加对应点击事件的简单整理
Vue 之 vue-seamless-scroll 实现简单自动无缝滚动,且添加对应点击事件的简单整理目录 Vue 之 vue-seamless-scroll 实现简单自动无缝滚动,且添加对应点击事 ...
vue实现列表的无缝滚动
前言: 在有无缝滚动的需求的时候我第一时间想的是轮播图,但是想弄一个列表那种的效果,轮播图就实现的就只能自己写个表头,这样用户体验不好,这里经过我自己使用,不管是兼容还是跨浏览器(版本较高)都是可以的 ...
原生js实现无缝滚动
水平方向无缝滚动滚动支持图片,文字原理 :一个大的盒子中放置两个盒子,通过设置offsetWidth,scrollLeft的关系来实现,而且还用到定时器函数setInterval,当手指移动上去定 ...
原生JS实现PC端无缝滚动轮播图、匀速轮播图、匀速动画
offset家族的了解 1.offsetHeight:元素的offsetHeight是一种元素CSS高度的衡量标准,包括元素的边框.内边距和元素的水平滚动条(如果存在且渲染的话),不包含:before ...
html图片自动向左滚动代码,图片无缝滚动代码(向左/向下/向上)
想必大家都注意到的不循环滚动,所以出现了很多替代脚本,或iframe或JS输出,不管怎么做,都略显麻烦.下面说一下这个相对简单的实现思路:一个设定宽度并且隐藏超出它宽度的内容的容器demo,里面放de ...
vue 文字上下循环滚动_基于 Vue 无缝滚动组件Vue-Seamless-Scroll
今天给小伙伴们推荐一款超棒的Vue无缝滚动组件VueSeamlessScroll. vue-seamless-scroll 基于 vue.js 构建的简单实用的无缝滚动组件.满足丰富的配置需求,支持上 ...
JQuery控制图片无缝滚动
经常有人问怎么在HTML上制作图片的无缝滚动,我自己在一些项目中也会经常用到的,今天花了些时间,上网搜索了一下,下了些源码回来看了一下,发现都是只能在IE下能够滚动的,而且都是光<html> ...

SuperSlider 2.x 无缝滚动在IE浏览器的兼容问题

SuperSlider 2.x 无缝滚动在IE浏览器的兼容问题相关推荐

最新文章

热门文章