多项目滑动 动画切换效果 分组滑动
js和css文件请到演示页面查看源码获取
XML/HTML Code
- <div class="container">
- <div class="main">
- <div id="mi-slider" class="mi-slider">
- <ul>
- <li><a href="#"><img src="images/1.jpg" alt="img01"><h4>Boots</h4></a></li>
- <li><a href="#"><img src="images/2.jpg" alt="img02"><h4>Oxfords</h4></a></li>
- <li><a href="#"><img src="images/3.jpg" alt="img03"><h4>Loafers</h4></a></li>
- <li><a href="#"><img src="images/4.jpg" alt="img04"><h4>Sneakers</h4></a></li>
- </ul>
- <ul>
- <li><a href="#"><img src="images/5.jpg" alt="img05"><h4>Belts</h4></a></li>
- <li><a href="#"><img src="images/6.jpg" alt="img06"><h4>Hats & Caps</h4></a></li>
- <li><a href="#"><img src="images/7.jpg" alt="img07"><h4>Sunglasses</h4></a></li>
- <li><a href="#"><img src="images/8.jpg" alt="img08"><h4>Scarves</h4></a></li>
- </ul>
- <ul>
- <li><a href="#"><img src="images/9.jpg" alt="img09"><h4>Casual</h4></a></li>
- <li><a href="#"><img src="images/10.jpg" alt="img10"><h4>Luxury</h4></a></li>
- <li><a href="#"><img src="images/11.jpg" alt="img11"><h4>Sport</h4></a></li>
- </ul>
- <ul>
- <li><a href="#"><img src="images/12.jpg" alt="img12"><h4>Carry-Ons</h4></a></li>
- <li><a href="#"><img src="images/13.jpg" alt="img13"><h4>Duffel Bags</h4></a></li>
- <li><a href="#"><img src="images/14.jpg" alt="img14"><h4>Laptop Bags</h4></a></li>
- <li><a href="#"><img src="images/15.jpg" alt="img15"><h4>Briefcases</h4></a></li>
- </ul>
- <nav>
- <a href="#">Shoes</a>
- <a href="#">Accessories</a>
- <a href="#">Watches</a>
- <a href="#">Bags</a>
- </nav>
- </div>
- </div>
- </div><!-- /container -->
JavaScript Code
- <script src="js/jquery.catslider.js"></script>
- <script>
- $(function() {
- $( '#mi-slider' ).catslider();
- });
- </script>
原文地址:http://www.freejs.net/article_jquerytupiantexiao_299.html
相关推荐
Android ViewPager实现仿QQ多页面滑动切换以及动画效果
java Swing多Jpanel仿安卓苹果桌面动态切换滑动效果
【Jquery经典特效26】jQuery动画背景滑动切换效果
android程序,滑动屏幕切换页面,anim文件夹里有进、出的移动、缩放、旋转等多种切换动画效果文件。
自定义ViewPager (禁止滑动和去除切换效果) viewPager.setNoScroll(true);//禁止手动滑动
可以放到移动端的html5动画切换效果 默认也可以自动切换 支持鼠标点击拖动、滑动 使用方法: 1、将head中的样式引入到你的样式表中 2、将body中需要的代码部分拷贝过去即可
这是一个博客中的一个demo,只供浏览运行效果。 博客:http://blog.csdn.net/qiantujava/article/details/22689297
RecyclerView实现Item滑动加载进入动画效果,详情链接地址http://blog.csdn.net/u012341052?viewmode=contents
jQuery动画背景滑动切换效果是一款鼠标悬停在图片上后,左侧的图片向上移动半个图片的距离。
HTML实现的Tab切换效果,点击滑动和触控滑动(SlideTouch插件),资源里面是源码!
介绍:BottomMenuSlideGradientSwipe是一个仿微信6.0左右滑动渐变切换效果的demo,特分享与大家探讨 [目前上面只有一个自己写的自定义AlertDialog对话框,有兴趣的朋友可以看一下,当然肯定没得前段时间出来的那个...
公司最近不忙,自己又近期学了core animation,就想找个好玩的动画实现一下...好了,这个demo整体上我感觉还是可以的,效果图是模拟器测试的,如果学习动画,建议测试有在真机上了,因为毕竟mac和iphone还是有区别的。
功能介绍: 引导界面导航效果 ... 支持 ViewPager 各种切换动画 支持选中特定页面 支持监听 item 点击事件 加载网络数据时支持占位图设置,避免出现整个广告条空白的情况 多个 ViewPager 跟随滚动
jQuery实现的动画背景滑动切换效果源码.zip
基于JQuery的一款滑动切换插件,就是大家熟悉的滑动门和选项卡,也称为Tab标签,不过本插件内含有多款标签,有的带有动画效果,带有注释,不熟悉网页的也可轻松上手。一些代码注释: * defaultIndex - 默认选中的...
左右切换,细化比较多的banner动画效果,使用方法简单,依次调用css、js、html即可,大小可以任意修改