码迷,mamicode.com
首页 > Web开发 > 详细

正益无线首页jQuery焦点图

时间:2015-06-26 14:44:31      阅读:162      评论:0      收藏:0      [点我收藏+]

标签:

分享一款正益无线首页jQuery焦点图,带索引按钮,自动轮播切换特效焦点图代码。

技术分享

在线预览    源码下载

实现的代码。

html代码:

<div id="slideBox" class="slideBox">
    <div class="hd">
        <ul><li></li><li></li><li></li></ul>
    </div>
    <div class="bd">
        <ul>
            <li style="background: url(images/banner2_1.jpg) 50% 0px no-repeat;">
                <div id="a3"></div>
                <div id="a4"></div>
                <div id="a5"></div>
            </li>
            <li style="background: url(images/banner4.png) 50% 0px no-repeat;">
                <div id="a12"></div>
                    <div id="a11"></div>
            </li>
            <li class="banner1">
                <a href="http://www.w2bc.com" target="_blank" class="content1">
                    <div id="a20"></div>
                        <div class="b2_word">
                            <var id="a21"></var><span id="a23"></span><var id="a22">而生</var>
                        </div>
                    <div id="a24">AppCan引领企业进入移动管理新时代</div>
                </a>
            </li>
        </ul>    
    </div>
</div>

<script src="js/jquery.SuperSlide.2.1.1.js"></script> 
<script type="text/javascript">
// 轮播
$(".slideBox").slide({mainCell:".bd ul",effect:"leftLoop",autoPlay:true,
    startFun:function(i,c){
    del();
    switch(i){
                case 0:
                        $("#a3").addClass(animation3);
                        $("#a4").addClass(animation4);
                        $("#a5").addClass(animation5);
                        break;
                case 1:
                        $("#a11").addClass(animation8);
                        $("#a12").addClass(animation9);

                        break;
                // case 2:
                        // $("#a8").addClass(‘animation6‘);
                        // $("#a9").addClass(‘animation7‘);
                        // $("#a10").addClass(‘animation7‘);
                        // break;
                case 2:
             
                       $(".content1 #a20").addClass(animation20);
                        $(".b2_word #a21").addClass(animation21);
                        $(".b2_word #a22").addClass(animation21);
                        $(".b2_word #a23").addClass(animation20);
                        $(".content1 #a24").addClass(animation22);
                        break;
                default:break;
            }
    }
});
</script>

via:http://www.w2bc.com/Article/45590

正益无线首页jQuery焦点图

标签:

原文地址:http://www.cnblogs.com/liaohuolin/p/4602114.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!