jquery.SerialScroll plugin 滚动图片

Demo : http://demos.flesler.com/jquery/serialScroll/

Example code here :

<%@ Page Language=”C#” AutoEventWireup=”true” CodeBehind=”Default.aspx.cs” Inherits=”ScrollJquery._Default” %>

http://www.blogger.com/>
http://www.blogger.com/>

Jquery Scroll


jQuery.easing.easeOutQuart = function (x, t, b, c, d) {
return -c * ((t=t/d-1)*t*t*t - 1) + b;
};
jQuery(function(){
$(‘#slideshow’).serialScroll({
items:’li’,
prev:’#screen2 a.prev’,
next:’#screen2 a.next’,
start:0, //as we are centering it, start at the 2nd
duration:2000, //auto timer , changed the image it to next image
force:true,
interval:1,
cycle:true, //don’t pull back once you reach the end
jump:true,
interval:5000
});
}
);


#screen2
{
position: relative;
width: 300px;
margin: 20px;
}
#screen2 #buttons
{
border: 1px solid #777;
margin-bottom: 5px;
width: 300px;
}
#screen2 #buttons a
{
margin: 10px 10px;
color: #69C;
}
#screen2 .prev
{
float: left;
}
#screen2 .next
{
float: right;
}
#slideshow
{
overflow: hidden;
width: 300px;
border: 1px solid #777;
}
#slideshow ul
{
width: 900px;
padding-left: 0px;
margin: 0px;
}
#slideshow li
{
float: left;
cursor: pointer;
}

Previous Next

  • ![](Palawan Island Philippines.jpg)
  • ![](Peaceful Getaway Maldives.jpg)

Copyright © Bruce Huang All rights reserved.