Table of Contents
2005 闪亮登场
2006 扬帆起航
2007 内外兼修
Home php教程 php手册 很酷的时间轴插件jquery特效

很酷的时间轴插件jquery特效

Jun 07, 2016 am 11:39 AM

jQuery Timelinr时间轴插件可以滑动切换、水平和垂直滚动、支持键盘方向键,并且支持鼠标滚轮
很酷的时间轴插件jquery特效

页面底部有演示、免费下载链接。若是想看更多js特效、网站源码、 js教程请访问 http://www.sucaihuo.com/js 还有演示DEMO,最主要是可以免费下载。1、<br> 示例中#timeline为展示区,#dates为时间轴,年份作为主轴,#issues作为内容展示区,即对应主轴点年份的内容,id必须对应上。<br> <div>  <br>    <ul>  <br>     <li><a>2005</a></li>  <br>     <li><a>2006</a></li>  <br>     <li><a>2007</a></li> <br>     ... <br>    </ul>  <br>    <ul>  <br>     <li> <h1 id="闪亮登场">2005 闪亮登场</h1> <p>2005年,呱呱坠地。界面清爽、功能俱全、操作简单易上手,是大家都喜爱的网络家园。出生不久,就有越来越多的朋友到我这里分享自己的生活。</p> </li>  <br>     <li> <h1 id="扬帆起航">2006 扬帆起航</h1> <p>2006年,咿呀学语。面对每天千万级的用户访问,技术GG帮我优化了架构,设计师MM帮我设计了欢迎动画等个性化装扮,“妈妈再也不担心我404了”!</p> </li>  <br>     <li> <h1 id="内外兼修">2007 内外兼修</h1> <p>2007年,初长成。咱推出了信息中心和好友圈,开始向SNS社区转型;首创4.0全屏模式,更加美观大方。</p> </li>  <br>      ... <br>   </ul>  <br>   <a></a> <!-- 用于点击展示前一项内容 --> <br>   <a></a> <!-- 用于点击展示后一项内容 --> <br> </div> <br> 2、<br> 接着引入jQuery库和jQuery Timelinr插件。另外,若是需要支持滚轮事件,必须引入jquery.mousewheel.js。<br> <script></script>  <br> <script></script>  <br> <script></script><br> 3、<br> 调用时间轴插件,实现垂直滚动,并且支持鼠标滚轮滚动,代码如下:<br> $().timelinr({ <br>     orientation: 'vertical',//垂直滚动 <br>     issuesSpeed: 300,// 对应内容区的滚动速度,可为100~1000之间的数字,或者设置为'slow', 'normal' or 'fast' <br>     datesSpeed: 100,//主轴滚动速度,可为100~1000之间的数字,或者设置为'slow', 'normal' or 'fast' <br>     arrowKeys: 'true',//支持方向键 <br>     startAt: 3,//初始化起点,即初始化轴点位置,数字 <br>     mousewheel: 'true' //是否支持鼠标滚轮 <br> });<br> 4、<br> 查看更多Timelinr参数设置,请进:http://www.sucaihuo.com/js/23.html查看该jQuery特效演示及免费下载,请访问:http://www.sucaihuo.com/js/23.html

AD:真正免费,域名+虚机+企业邮箱=0元

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
2 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
Repo: How To Revive Teammates
4 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: How To Get Giant Seeds
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Learn about introductory code examples for Python programming Learn about introductory code examples for Python programming Jan 04, 2024 am 10:50 AM

Learn about Python programming with introductory code examples Python is an easy-to-learn, yet powerful programming language. For beginners, it is very important to understand the introductory code examples of Python programming. This article will provide you with some concrete code examples to help you get started quickly. Print HelloWorldprint("HelloWorld") This is the simplest code example in Python. The print() function is used to output the specified content

PHP variables in action: 10 real-life examples of use PHP variables in action: 10 real-life examples of use Feb 19, 2024 pm 03:00 PM

PHP variables store values ​​during program runtime and are crucial for building dynamic and interactive WEB applications. This article takes an in-depth look at PHP variables and shows them in action with 10 real-life examples. 1. Store user input $username=$_POST["username"];$passWord=$_POST["password"]; This example extracts the username and password from the form submission and stores them in variables for further processing. 2. Set the configuration value $database_host="localhost";$database_username="username";$database_pa

From beginner to proficient: Code implementation of commonly used data structures in Go language From beginner to proficient: Code implementation of commonly used data structures in Go language Mar 04, 2024 pm 03:09 PM

Title: From Beginner to Mastery: Code Implementation of Commonly Used Data Structures in Go Language Data structures play a vital role in programming and are the basis of programming. In the Go language, there are many commonly used data structures, and mastering the implementation of these data structures is crucial to becoming a good programmer. This article will introduce the commonly used data structures in the Go language and give corresponding code examples to help readers from getting started to becoming proficient in these data structures. 1. Array Array is a basic data structure, a group of the same type

How to use PHP to write inventory management function code in the inventory management system How to use PHP to write inventory management function code in the inventory management system Aug 06, 2023 pm 04:49 PM

How to use PHP to write the inventory management function code in the inventory management system. Inventory management is an indispensable part of many enterprises. For companies with multiple warehouses, the inventory management function is particularly important. By properly managing and tracking inventory, companies can allocate inventory between different warehouses, optimize operating costs, and improve collaboration efficiency. This article will introduce how to use PHP to write code for inventory warehouse management functions, and provide you with relevant code examples. 1. Establish the database before starting to write the code for the inventory warehouse management function.

Java implements simple bubble sort code Java implements simple bubble sort code Jan 30, 2024 am 09:34 AM

The simplest code example of Java bubble sort Bubble sort is a common sorting algorithm. Its basic idea is to gradually adjust the sequence to be sorted into an ordered sequence through the comparison and exchange of adjacent elements. Here is a simple Java code example that demonstrates how to implement bubble sort: publicclassBubbleSort{publicstaticvoidbubbleSort(int[]arr){int

Go language programming examples: code examples in web development Go language programming examples: code examples in web development Mar 04, 2024 pm 04:54 PM

"Go Language Programming Examples: Code Examples in Web Development" With the rapid development of the Internet, Web development has become an indispensable part of various industries. As a programming language with powerful functions and superior performance, Go language is increasingly favored by developers in web development. This article will introduce how to use Go language for Web development through specific code examples, so that readers can better understand and use Go language to build their own Web applications. 1. Simple HTTP Server First, let’s start with a

Huawei Cloud Edge Computing Interconnection Guide: Java code examples to quickly implement interfaces Huawei Cloud Edge Computing Interconnection Guide: Java code examples to quickly implement interfaces Jul 05, 2023 pm 09:57 PM

Huawei Cloud Edge Computing Interconnection Guide: Java Code Samples to Quickly Implement Interfaces With the rapid development of IoT technology and the rise of edge computing, more and more enterprises are beginning to pay attention to the application of edge computing. Huawei Cloud provides edge computing services, providing enterprises with highly reliable computing resources and a convenient development environment, making edge computing applications easier to implement. This article will introduce how to quickly implement the Huawei Cloud edge computing interface through Java code. First, we need to prepare the development environment. Make sure you have the Java Development Kit installed (

Java file operations and cloud storage integration: explore endless possibilities Java file operations and cloud storage integration: explore endless possibilities Feb 27, 2024 pm 04:55 PM

1. Basics of Java file operations In Java, file operations are a basic and important function. You can use the File class and related methods in the Java class library to create, read, write, and delete files. The File class provides a rich API that can meet most file operation needs. Create a file Filefile=newFile("sample.txt");file.createNewFile();Write a fileFileWriterwriter=newFileWriter(file);writer.write("Hello,World!");writer.close();Read a file Fi

See all articles