菜单

通过swiper.js插件实现单边三张图片重叠轮播效果

通过swiper.js插件实现单边三张图片重叠轮播效果

常见的堆叠轮播效果,基于Swiper 8.4.7版本的创意效果参数effect: 'creative'实现。 HTML代码: <link rel="stylesheet" type="text/css" href="../css/swiper-bundle.css" media="screen"/> <!--Swiper 8.4.7--> <script src="../js/swiper-bundle.min.js"></script><!--Swiper 8.4.7--> <div...

jQuery/Zepto 3D透视圆形/椭圆形旋转木马轮播插件cloud9carousel

jQuery/Zepto 3D透视圆形/椭圆形旋转木马轮播插件cloud9carousel

cloud9carousel是一款与jQuery和Zepto配合使用、支持多个轮播实例、支持任何HTML元素、速度流畅、专注于性能的3D透视旋转木马插件,使用requestAnimationFrame方法固定FPS来实现平滑过渡动画、自动开启GPU来支持CSS 转换动画(自动判断是否支持),有onLoaded、onRendered、onAnimationFinished三个回调函数,支持元素倒影(需要reflection.js插件)、自动轮播、鼠标滚轮切换、点击切换。 演示:http://specious.git...

TweenMax实现网页元素无缝循环跑马灯效果代码记录

TweenMax实现网页元素无缝循环跑马灯效果代码记录

炮马灯效果通过基础的js代码或HTML的marquee标签都能实现,如果想学习TweenMax插件不妨通过其跑马灯效果代码入手会比较容易理解。 1、下载插件:http://www.tweenmax.com.cn/source/ 把压缩后文件夹里的src/minified/TweenMax.min.js和src/minified/plugins/ModifiersPlugin.min.js文件复制到自己的Web项目 TweenMax.min.js:核心工具 ModifiersPlugin.min.js:基础插件,...

slick.js插件实现监听video视频播放结束再自动轮播的代码

slick.js是常用的轮播图插件,监听video视频播放是常用的轮播模块效果。和SuperSlide.js插件、Swiper插件实现当前焦点有视频就暂停自动轮播,等视频播放结束再继续自动轮播的实现原理基本一样,就是先判断当前焦点是否有视频,如果有视频就调用暂停轮播的插件方法,使用addEventListener监听视频是否播放结束,然后再调用启用轮播的插件方法和立即播放下一屏的插件方法。 使用到的slick.js插件方法有:slickPause、slickPlay、slickNext;使用到的slick.js插件回调函数有:afterChange;使用到的js事件有:end...