EasySlider 图片滚动的JQuery插件的改版(支持多张图片同时显示)

最新推荐文章于 2021-06-17 18:17:45 发布

weixin_30539625

最新推荐文章于 2021-06-17 18:17:45 发布

阅读量131

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/SeaSun/archive/2009/11/13/1602830.html

版权

本来的只是支持一张的显示.经过我的一些小改.现在可以支持多张了.只要设置quantity这个属性就行了.默认为一张.

效果图

我美感很差.不过足以说明,大家将就下.

给全代码 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">Code

< HTML >
< HEAD >
   < TITLE > New Document </ TITLE >
   < META NAME ="Generator" CONTENT ="EditPlus" >
   < META NAME ="Author" CONTENT ="" >
   < META NAME ="Keywords" CONTENT ="" >
   < META NAME ="Description" CONTENT ="" >
   < SCRIPT LANGUAGE ="JavaScript" type ="text/javascript" src ="JQuery/jquery_min.js" ></ SCRIPT >
   < SCRIPT LANGUAGE ="JavaScript" type ="text/javascript" src ="JQuery/easySlider1.5.js" ></ SCRIPT >
   < link href ="CSS/Pic.css" rel ="stylesheet" type ="text/css" />
   < script type ="text/javascript" >
      $( function (){ // alert();
        $( " #easyslider " ).easySlider(
        {
        auto: true , // 是否一开始自动滑动
        prevId: " prevpic " ,
        nextId: " nextpic " , // 下一张的Id,随便你起.用来触发click事件.例如我这里的:<a href="#;" id="nextpic">下一张</a>
        continuous: true , // 是否连续,即到最后一张,点击下一张后会跳到第一张,反之亦然
        quantity: 2 // 显示的图片个数
        }
        );

    });
   </ script >
</ HEAD >

< BODY >
   < div class ="picshow" id ="easyslider" >
     < ul >
         < li >< a href ="http://templatica.com/preview/30" >< img src ="images/01.jpg" alt ="Css Template Preview" /></ a ></ li >
         < li >< a href ="http://templatica.com/preview/7" >< img src ="images/02.jpg" alt ="Css Template Preview" /></ a ></ li >
         < li >< a href ="http://templatica.com/preview/25" >< img src ="images/03.jpg" alt ="Css Template Preview" /></ a ></ li >
         < li >< a href ="http://templatica.com/preview/26" >< img src ="images/04.jpg" alt ="Css Template Preview" /></ a ></ li >
         < li >< a href ="http://templatica.com/preview/27" >< img src ="images/05.jpg" alt ="Css Template Preview" /></ a ></ li >
     </ ul >
   </ div >
   < div class ="aclick" >
       < a href ="#;" id ="prevpic" > 上一张 </ a >< a href ="#;" id ="nextpic" > 下一张 </ a >
   < div >
</ BODY >
</ HTML >

例子在这里下载: /Files/SeaSun/easySliderAmend.zip

JS文件在这里下载: /Files/SeaSun/easySlider改后的.zip

如果有什么问题,不要找我啊.哈哈..我不负责任的啊.高手请路过.

转载于:https://www.cnblogs.com/SeaSun/archive/2009/11/13/1602830.html

weixin_30539625

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
EasySlider 图片滚动的JQuery插件的改版(支持多张图片同时显示)

本来的只是支持一张的显示.经过我的一些小改.现在可以支持多张了.只要设置quantity这个属性就行了.默认为一张.效果图我美感很差.不过足以说明,大家将就下.给全代码<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.0Transitional//EN">Code<HTML><HEAD><TITLE>N...
复制链接

扫一扫