基于jQuery超级酷动画滑动插件

分享一款基于jQuery超级酷动画滑动插件。这是一款基于jquery.pogo-slider插件实现的多个滑块切换特效。效果图如下:

在线预览   源码下载

实现的代码。

html代码:

       <div class="pogoSlider" id="js-main-slider">

            <div class="pogoSlider-slide" data-transition="slideOverLeft" data-duration="1000" style="background-image:url(img/slide1.jpg);"></div>
            <div class="pogoSlider-slide " data-transition="fold" data-duration="1000" style="background-image:url(img/slide2.jpg);"></div>
            <div class="pogoSlider-slide " data-transition="shrinkReveal" data-duration="1000" style="background-image:url(img/slide3.jpg);"></div>

        </div><!-- .pogoSlider -->

via:http://www.w2bc.com/article/2015-10-15-jquery-image-focus-change

时间: 2024-10-10 03:05:16

基于jQuery超级酷动画滑动插件的相关文章

推荐20款基于 jQuery &amp; CSS 的文本效果插件

jQuery 和 CSS 可以说是设计和开发行业的一次革命.这一切如此简单,快捷的一站式服务.jQuery 允许你在你的网页中添加一些真正令人惊叹的东西而不用付出很大的努力,要感谢那些优秀的 jQuery 插件. 所以今天我们将展示一些很酷的文本效果插件,将帮助你为你的 Web 页面创建一些很酷的和动态的东西.这里是20个基于 jQuery & CSS 的文本效果插件. 您可能感兴趣的相关文章 12款经典的白富美型 jQuery 图片轮播插件 让网站动起来!12款优秀的 jQuery 动画插件

基于jQuery图像碎片切换效果插件FragmentFly

基于jQuery图像碎片切换效果插件FragmentFly.这是一款只需三步轻松完成碎片动画,参数可调,使用方便. 在线预览   源码下载 部分代码: <div class="all_wrap"> <div class="wrap_head"> <div id="fragment_title"> </div> </div> <div class="wrap_middle&

基于jquery的提示框JavaScript 插件,类Bootstrap

目录 基于jquery的提示框JavaScript 插件,类Bootstrap 基于jquery的提示框JavaScript 插件,类Bootstrap 源码 github地址: https://github.com/Ethan-Xie/message 实例 通过此此插件可以为提示栏添加自动/点击消失的功能 用法 需引入message.css与message.js <link rel="stylesheet" href="message.css"> &l

jQuery超酷下拉插件6种效果演示

原始的下拉框很丑啦, 给大家一款jQuery超酷下拉插件6种效果 效果预览 下载地址 实例代码 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 <div class="container">                       <section class="main clearfix">                 <select id="cd-dr

一款基于jquery ui的动画提交表单

今天要给大家分享一款基于jquery ui的动画提交表单.这款提交表单的的效果是以动画的形式依次列表所需填写的信息.效果非常不错,效果图如下: 在线预览   源码下载 实现的代码. html代码: <div align="center"> <form id="myform"> <div id="bloc_recherche_couleur"> <div id="etape0_recherche&

分享一款基于jquery的圆形动画按钮

之前为大家介绍过一款纯css3实现的圆形旋转分享按钮.今天要给大家带来一款基于jquery的圆形动画按钮.这款按钮鼠标经过的时候以边框转圈,然后逐渐消息,在实例中给出了四种颜色的demo.效果图如下: 在线预览   源码下载 实现的代码. html代码: <figure class='red'> <div class='icon'> i</div> <div class='circle'> </div> </figure> <f

基于jquery的锚点滚动插件(百度百科效果) anchorScroll.js

1.插进使用场景 请打开https://baike.baidu.com/item/%E6%97%A5%E6%9C%AC%E5%8A%A8%E7%94%BB#hotspotmining,查看百度百科页面效果. 2.插件源代码: /* * 作者:孟繁贵 * 2017-08-25 * 版本:1.0 */ jQuery.anchorScroll = function(elem1, elem2) { var currObj, offsetTop = 0, h2List = new Array(), h3L

基于jQuery鼠标悬停上下滑动导航条

基于jQuery鼠标悬停上下滑动导航条.这是一款蓝色好看的鼠标响应式网站导航菜单特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div id="menu2" class="menu"> <ul> <li><a href="#">首 页</a></li> <li><a href="#">预报预警</a

基于jQuery图片元素网格布局插件

基于jQuery图片元素网格布局插件是一款可以将图片或HTML元素均匀分布排列为网格布局的jQuery插件jMosaic.效果图如下: 在线预览   源码下载 实现的代码. html代码: <center><h3>演示1</h3></center> <div class="pictures"> <img src="img/pics-001.jpg" width="600" heig