网站内容滑块 FerroSlider
来源:互联网 发布:淘宝店经营技巧 编辑:程序博客网 时间:2024/05/16 07:34
该插件让你可以用一个非同寻常非常酷的方式来编排网站的内容,并且通过一个滑动的方式来导航它们。最终效果类似于Mac或Linux的多重桌面。
查看原文
查看在线演示Demo和更多原文内容教程:
http://www.ibloger.net/article/1221.html
插件描述:FerroSlider是一款强大的全局布局插件,允许我们通过滑动切换整个页面来显示内容,能让我们快速地布局出一个酷炫的网站,是一个很有用的jqeury插件。支持Ajax请求
使用步骤
1、引入以下的js和css文件(请以实际的demo效果为准)
<link rel="stylesheet" href="query.ferro.ferroSlider.css" type="text/css"><script src="jquery-1.6.1.min.js" type="text/javascript"></script><script src="jquery.easing.1.3.js" type="text/javascript"></script><script src="jquery.ferro.ferroSlider-1.2.min.js" type="text/javascript"></script>
2、在head标签中加入以下js代码(请以实际的demo效果为准)
<script type="text/javascript"> $(document).ready(function () { $('.slidingSpaces').ferroSlider(); });</script>
3、在body标签中加入以下格式的html代码
<div id="div1" class="slidingSpaces" title="Page 1" style="background-color:red"> first page</div><div id="div2" class="slidingSpaces" title="Page 2" style="background-color:aqua"> second page </div><div id="div3" class="slidingSpaces" title="Page 3"> third page </div><div id="div4" class="slidingSpaces" title="Page 4"> fourth page </div><div id="div5" class="slidingSpaces" title="Page 5"> fifth page </div>
参数配置
在线演示:http://www.alessandroferrini.it/lab/jQueryPlugins/ferroSlider/docs/index.php#demos
官网:http://www.alessandroferrini.it/lab/jQueryPlugins/ferroSlider/docs
Demo1:http://www.alessandroferrini.it/lab/jQueryPlugins/ferroSlider/demos/demo0.html
Demo2:http://www.alessandroferrini.it/lab/jQueryPlugins/ferroSlider/demos/demo1.html
Demo3:http://www.alessandroferrini.it/lab/jQueryPlugins/ferroSlider/demos/demo2.html
Demo4:http://www.alessandroferrini.it/lab/jQueryPlugins/ferroSlider/demos/demo3.html
Demo5:http://www.alessandroferrini.it/lab/jQueryPlugins/ferroSlider/demos/demo4.html
Demo6:http://www.alessandroferrini.it/lab/jQueryPlugins/ferroSlider/demos/demo5.html
Demo7:http://www.alessandroferrini.it/lab/jQueryPlugins/ferroSlider/demos/demo6.html
- 网站内容滑块 FerroSlider
- CSS实现内容滑块
- 引用块内容
- 网站内容
- 移动Web内容滑块 – Swipe JS
- 10 个旨在美化网站的 HTML5 滑块设计
- 读取网站内容
- 2008交互网站内容
- 网站内容很好...
- 网站策划分析内容
- 网站内容的组织
- 企业网站制作内容
- 提升网站内容可读性
- 网站内容编辑
- java获取网站内容
- Excel抓取网站内容
- 做好网站内容重要性
- 网站内容质量分析
- 机器学习之——机器学习应用建议
- 易语言屏蔽优酷广告代码
- DM8168_ETV_V1.1开发板mount主机常见问题
- 利用 LeakCanary 来检查 Android 内存泄漏
- http返回压缩包解压
- 网站内容滑块 FerroSlider
- Create a New Maven Project in Eclipse
- 我的android学习之路
- EditText设置光标最后
- CentOS中,使用PHP-FPM+Nginx运行PHP网站
- 向HashSet插入自定义对象判断是否重复
- Java仿Windows记事本源代码
- NAND Flash的坏块
- linux课堂笔记----磁盘管理