jQuery实现的双滑动图片显示效果_时代Java(NowJava.com) -JS/jQuery代码 -演示与下载 -时代Java
Download dualSliderDemo pack (version 0.3)

dualSlider //

When one animation just isn't enough...Problems/Feature requests

dualSlider options

auto:true,
autoDelay: 6000,
easingCarousel: "swing",
easingDetails: "easeOutBack",
durationCarousel: 1000,
durationDetails: 600

Changelog

0.2 - Tested and fixed for IE6+, auto loops, manual pause/play controls
0.3 - Now with seamless looping!

dualSlider demo

As you can see pretty much any html can go in the panels from your CMS, you just need to format them with CSS

A little bit of documentation

It's fairly simple to get this going, just copy and paste markup from this file if need be.

01. The easiest thing you can do is download the quick start pack and modify as you wish :)

02. If you don't want to do that then you can take the elements individually and build them into an existing site. Start by getting all of the dependant files that are listed up top, including dualSlider.

03. You will also need some CSS to get this going, or it won't work at all. To get started just copy it from jquery.dualSlider.0.3.css.

04. Now include all of these files in the <head> of your html document .

05. Once this is all done you need to get the markup onto the page, you can view the source of this document to get an idea of how that works, it can either be static or come out of a database, but thats up to you. If it's out of a database no worries, the paging is built dynamically by the plugin.

06. Initialise the plugin as per previously given, view source for an example.

07. and relax...


代码整理:时代Java(NowJava.com) 更多相关效果,请到时代Java(NowJava.com) 脚本下载栏目

注:此代码仅供学习交流,请勿用于商业用途。

时代Java(NowJava.com)素材中心整理。




下载代码说明
X关闭

基于jQuery实现的双滑动图片显示效果

jquery实现的图片滑动展示效果,非常酷的是,这个效果实现了左右双滑动显示效果,左边的是图片滑动,右边的是文字滑动展示,图文配合,非常实用