您好,欢迎来到源码搜藏!分享精神,快乐你我!提示:担心找不到本站?在百度搜索“源码搜藏”,网址永远不丢失!
  • 首 页
  • 在线工具
  • 当前位置:首页 > 网页特效 > jQuery特效 >

    皮皮时光机全屏滚动jquery特效

    时间:2014-06-30 17:37 来源:互联网 作者:源码搜藏 浏览:收藏 挑错 推荐 打印

    效果预览 进入下载地址列表

    皮皮时光机全屏滚动jquery特效皮皮时光机全屏滚动jquery特效是一款非常漂亮的皮皮时光机网站全屏滚动代码特效,此特效目前非常流行,广泛应用于各种产品介绍页面,此滚动特效基于jQuery插件jquery.mousewheel.min.js,效果还是很流畅的,滚屏的数量取决于scroll_box scroll_xx的个数,当然导航的数量也得跟着修改相应的数量,大家可以根据此插件改造自己的产品介绍页面。jquery全屏滚动代码索引按钮


    <script type="text/javascript">
    $(document).ready(function(){
    //头部更多应用下拉
    $(".more_app a:first").click(function(){
    $(this).siblings("div").show();
    });
    $(".more_app div").mouseenter(function(){
    $(this).show();
    }).mouseleave(function(){
    $(this).hide();
    });
    /*用户名下拉列表*/
    $(".head_rig .user .nick").click(function(){
    $(this).siblings("ul").show();
    });
    $(".head_rig .user ul:first").mouseenter(function(){
    $(this).show();
    }).mouseleave(function(){
    $(this).hide();
    });
    });
    /*banner幻灯js*/
    $(function(){
    var aPage = $('.index_login .lef a'); //分页按钮
    var aImg = $('.index_banner ul li'); //图像集合
    var iSize = aImg.size(); //图像个数
    var index = 0; //切换索引
    var t;
    $('.up').click(function(){ //左边按钮点击
    index--;
    if(index<0){
    index=iSize-1
    }
    change(index);
    })
    $('.down').click(function(){    //右边按钮点击
    index++;
    if(index>iSize-1){
    index=0
    }
    change(index);
    })
    //分页按钮点击
    aPage.click(function(){
    index = $(this).index();
    change(index);
    });
    //切换过程
    function change(index){
    aPage.removeClass('current');
    aPage.eq(index).addClass('current');
    aImg.stop();
    //隐藏除了当前元素,所以图像
    aImg.eq(index).siblings().animate({opacity:0},1000);
    //显示当前图像
    aImg.eq(index).animate({opacity:1},1000);
    }
    function autoshow() {
    index=index+1;
    if(index<=iSize-1){
       change(index);
    }else{
    index=0;
    change(index);
    }
    }
    int=setInterval(autoshow,5000);
    function clearInt() {
    $('.banner_page a.up,.banner_page a.down').mouseover(function() {
    clearInterval(int);
    })
    }
    function setInt() {
    $('.banner_page a.up,.banner_page a.down').mouseout(function() {
    int=setInterval(autoshow,5000);
    })
    }
    clearInt();
    setInt();
    });
    /*输入框效果*/
    $(".input_bar").click(function(){
    var it = $(this).parents("li").find("input.txt");
    if(it.val() == ""){
    $(this).hide();
    it.focus();
    }
    });
    $("input.txt").blur(function(){
    if($(this).val() == ""){
    $(this).parents("li").find(".input_bar").show();
    }
    }).keyup(function(){
    $(this).next(".input_bar").hide();
    });
    UI.getScript("static/spring/js/login.min.js?ver=20140623", function() {
        onLoginReady();
    });
    function accountLogin(type, app)
    {
        $.get('member.php?mod=bind&action=request&referer=http%3A%2F%2Ft.pp.cc%2F' + app + '&type=' + type + '&app=' + app + '&sinav=3&random=' + UI.random(), function(data) {
            location.href = data;
        });
        }
    function onLoginSwitchReady(){}


    SyncLoginState(true);
    function LC_onPageSync(r) 
    {
        if (r) {
        location.href = siteurl;
        }
    }
    </script>

    皮皮时光机全屏滚动jquery特效由源码搜藏网整理,转载请注明出处http://www.codesocang.com/texiao/jQuerytexiao/9740.html 源码搜藏承诺:本站所有资源无病毒,无弹窗,无干扰链接!