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

三张图堆叠式立体轮播图效果在网页前端开发过程中经常会做到，之前不想费心费力自己弄，习惯使用一些成熟的jquery轮播图插件（如slick.js、Owl-Carousel.js）改造实现，效果也算是差强人意。这次在bilibili上看到有人分享相同效果的代码，下载下来发现代码挺简单，效果也比较合适，于是就在原代码的基础上对html、css和js都进行了些小修改，结果比较符合自己的要求。 HTML代码： <div class="owl"> <div id="stacked"> <div class="item">...

Owl Carousel 是一个强大、实用但小巧的 jQuery 幻灯片插件，兼容包括 IE6、IE7在内的所有浏览器，需要jquery 1.7 及以上版本。Owl Carousel 提供了众多的参数、回调函数及自定义事件，所以它几乎可以满足你的所有要求。它具有一下特点： 兼容所有浏览器 支持响应式 支持 CSS3 过度 支持触摸事件 支持 JSON 及自定义 JSON 格式 支持进度条 支持自定义事件 支持延迟加载 支持自适...

$(window).load(function() { $('.flexslider').flexslider({ animation: "fade", //String: Select your animation type, "fade" or "slide"图片变换方式：淡入淡出或者滑动 slideDirection: "horizontal", //String: Select the sliding direction, "horizontal" or "vertical"图片设置为滑动式时的滑动方向：左右或者上下 slidesho...

Coin Slider是款很小巧，简单易用，具有多种图片过渡效果的jquery幻灯片插件。 使用方法： 下载插件：http://pan.baidu.com/s/1pJNriFD 引用文件： <script type="text/javascript" src="jquery-1.4.2.js"></script> <script type="text/javascript" src="coin-slider.min.js"></script> <link rel="sty...

幻灯片是网站最常使用的网页效果之一，KinSlideshow幻灯片插件非常好用，需要元素结构简单，CSS基本不需要作多改动，只需要设置调用函数，即可实现超炫的轮播效果！兼容IE6/IE7/IE8/IE9,FireFox,Chrome*,Opera的 jQuery. KinSlideshow幻灯片插件，功能很多，基本能满足在网页上使用幻灯片(焦点图)效果。 KinSlideshow默认设置效果代码： jQuery： $(function(){ $("#KinSlideshow").KinSlideshow(); }) ...

网站经常用到的jQuery幻灯片，需要元素结构很简单，只需要调用函数。 jQuery部分代码： $(function(){ $("#KinSlideshow").KinSlideshow({ moveStyle:"right", titleBar:{titleBar_height:30,titleBar_bgColor:"#08355c",titleBar_alpha:0.5}, titleFont:{TitleFont_size:12,TitleFont_color:"#FFFFFF",TitleFont_weight:"normal"}, ...