知识 分享 互助 懒人建站

    懒人建站专注于网页素材下载,提供网站模板、网页设计、ps素材、图片素材等,服务于【个人站长】【网页设计师】和【web开发从业者】的代码素材与设计素材网站。

    懒人建站提供网页素材下载、网站模板
    知识 分享 互助!

    仿淘宝上下翻滚的jquery图片切换特效

    作者:速博娱乐是什么 来源:jquery特效 2011-05-10 人气:
    仿淘宝网首页上下翻滚的jquery图片切换特效,滚动方式为上下翻滚切换的焦点幻灯片特效,jquery.Slide.js已经被压缩不是原始的jquery文件,不过不影响使用和修改,完全可以自己重写部分

    仿淘宝网首页上下翻滚的jquery图片切换特效,收集与网络,原作者未知,滚动方式为上下翻滚切换的焦点幻灯片特效,基于jquery,jquery.Slide.js已经被压缩不是原始的jquery文件,不过不影响使用和修改,完全可以自己重写部分样式,如果你重写的样式不生效可以在css样式后面加 !important ,如:#btnlistID li{ color:#ffffff!important;}

    jquery代码如下:

    <script src="http://sbylssm.985sunbet.com/js/jquery/1.3/jquery.min.js" type="text/javascript"></script>
    <script src="js/jquery.Slide.js" type="text/javascript"></script>
    <script type="text/javascript">
    $(function(){
        $("#taobaoSlide").KinSlideshow({
                moveStyle:"down",
                intervalTime:8,
                mouseEvent:"mouseover",
                titleFont:{TitleFont_size:14,TitleFont_color:"#ffffff"}
        });
    })
    </script>
    <style>
    #btnlistID li{ color:#ffffff!important;}
    </style>

    这里引用了谷歌的http://sbylssm.985sunbet.com/js/jquery/1.3/jquery.min.js,你可以换成你自己的引用路径。

    $("#taobaoSlide").KinSlideshow 这里的# taobaoSlide 是你 jquery图片切换特效 容器的ID。

    moveStyle:"down", 这里的 down 你可以试试 left   呵呵,聪明的你一定知道什么意思了。

    titleFont:{TitleFont_size:14,TitleFont_color:"#ffffff"}  这是字号 和字体 颜色了。

    #btnlistID li{ color:#ffffff!important;} 这个样式是可以控制那个数字颜色的,数字的颜色默认是黑色,你想改变这个颜色你可以用这种方式,

    其他地方的样式也可以用这种方式改变。

    jquery图片切换特效 容器的HTML代码如下:

    <div id="taobaoSlide" style="visibility:hidden;">
            <a href="http://sbylssm.985sunbet.com/" target="_blank"><img src="images/1.jpg" alt="懒人建站为您提供-基于jquery特效" width="500" height="200" /></a>
            <a href="http://sbylssm.985sunbet.com/JS/" target="_blank"><img src="images/2.jpg" alt="懒人建站为您分享基于jquery 特效,分享是一种精神" width="500" height="200" /></a>
            <a href="http://sbylssm.985sunbet.com/jquery/" target="_blank"><img src="images/1.jpg" alt="懒人建站为您提供-jquery 图片特效,jquery 菜单特效" width="500" height="200" /></a>
            <a href="http://sbylssm.985sunbet.com/" target="_blank"><img src="images/2.jpg" alt="懒人建站 jquery 特效" width="500" height="200" /></a>
        </div>

    这个不多解释,

    你还要问怎么在你的页面中调用?这里说的基本很清楚了,还是不明白?那看演示吧,看演示里面怎么调用的。

    类似这样的
    <a href="http://sbylssm.985sunbet.com/JS/" target="_blank"><img src="images/2.jpg" alt="懒人建站为您分享基于jquery 特效,分享是一种精神" width="500" height="200" /></a>
    一条一条的文章列表的读取应该不是什么难事吧!

     

    ↓ 查看全文

    仿淘宝上下翻滚的jquery图片切换特效由懒人建站收集整理,您可以自由传播,请主动带上本文链接

    懒人建站就是免费分享,觉得有用就多来支持一下,没有能帮到您,懒人也只能表示遗憾,希望有一天能帮到您。

    仿淘宝上下翻滚的jquery图片切换特效-最新评论

    网站地图 圣淘沙娱乐官网 申博会员官网 菲彩国际线上博彩
    申博娱乐 申博娱乐官方网站 菲律宾太阳城网址 申博太阳城最新网址
    600w彩票网m.600w.org cp138彩票网直营网 伯乐彩票网登入 博彩游戏皇冠列车
    博狗开户 永利娱乐信誉如何 新世纪娱乐澳门 菲彩娱乐
    KK娱乐备用 百利宫娱乐备用网址 菲彩国际线上博彩 圣淘沙娱乐bc2013
    238PT.COM 122TGP.COM 697XTD.COM 438psb.com 729XTD.COM
    18888shenbo.com 987XTD.COM 898sj.com 617XTD.COM S618F.COM
    55sbsun.com 8CJS.COM 44sbsg.com 189sunbet.com 171sj.com
    8AQS.COM 132psb.com S6182.COM 79jbs.com S6184.COM