1

所以我修改了这个 Supersized 插件。我添加了让 div 进出动画的功能。在 Firefox、Safari 和 Chrome 中,工作正常。在 IE7 及更高版本中,它并不好。有些幻灯片有动画,有些没有。有人有什么想法吗?代码片段和链接如下:

http://www.bigideaadv.com/adaptive/

    if (base.options.slide_links){
        // Slide marker clicked
        $(vars.slide_list+'> li').click(function(){

            index = $(vars.slide_list+'> li').index(this);
            targetSlide = index + 1;

            slide1 = index + 1; //Slide clicked
            slide2 = vars.current_slide + 1; //Current slide

            //User click
            if(slide1 != undefined || slide1 != null || slide1 != '') {
                if (slide1 == 1 && slide2 == 2) {
                    $('#homeslide3').hide();
                    $('#homeslide4').hide();
                    $('#homeslide_box3').hide();
                    $('#homeslide_box4').hide();
                } else if (slide1 == 1 && slide2 == 3) {
                    $('#homeslide2').hide();
                    $('#homeslide4').hide();
                    $('#homeslide_box2').hide();
                    $('#homeslide_box4').hide();
                } else if (slide1 == 1 && slide2 == 4) {
                    $('#homeslide2').hide();
                    $('#homeslide3').hide();
                    $('#homeslide_box2').hide();
                    $('#homeslide_box3').hide();
                } else if (slide1 == 2 && slide2 == 1) {
                    $('#homeslide3').hide();
                    $('#homeslide4').hide();
                    $('#homeslide_box3').hide();
                    $('#homeslide_box4').hide();
                } else if (slide1 == 2 && slide2 == 3) {
                    $('#homeslide1').hide();
                    $('#homeslide4').hide();
                    $('#homeslide_box1').hide();
                    $('#homeslide_box4').hide();
                } else if (slide1 == 2 && slide2 == 4) {
                    $('#homeslide1').hide();
                    $('#homeslide3').hide();
                    $('#homeslide_box1').hide();
                    $('#homeslide_box3').hide();
                } else if (slide1 == 3 && slide2 == 1) {
                    $('#homeslide2').hide();
                    $('#homeslide4').hide();
                    $('#homeslide_box2').hide();
                    $('#homeslide_box4').hide();
                } else if (slide1 == 3 && slide2 == 2) {
                    $('#homeslide1').hide();
                    $('#homeslide4').hide();
                    $('#homeslide_box1').hide();
                    $('#homeslide_box4').hide();
                } else if (slide1 == 3 && slide2 == 4) {
                    $('#homeslide1').hide();
                    $('#homeslide2').hide();
                    $('#homeslide_box1').hide();
                    $('#homeslide_box2').hide();
                } else if (slide1 == 4 && slide2 == 1) {
                    $('#homeslide2').hide();
                    $('#homeslide3').hide();
                    $('#homeslide_box2').hide();
                    $('#homeslide_box3').hide();
                } else if (slide1 == 4 && slide2 == 2) {
                    $('#homeslide1').hide();
                    $('#homeslide3').hide();
                    $('#homeslide_box1').hide();
                    $('#homeslide_box3').hide();
                } else if (slide1 == 4 && slide2 == 3) {
                    $('#homeslide1').hide();
                    $('#homeslide2').hide();
                    $('#homeslide_box1').hide();
                    $('#homeslide_box2').hide();
                }
            }

            //For autorotation (no click)
            if(slide1 == undefined || slide1 == null || slide1 == '') {
                if(slide2 == 1) {
                    slide1 = 2;
                    $('#homeslide3').hide();
                    $('#homeslide4').hide();
                    $('#homeslide_box3').hide();
                    $('#homeslide_box4').hide();
                } else if(slide2 == 2) {
                    slide1 = 3;
                    $('#homeslide1').hide();
                    $('#homeslide4').hide();
                    $('#homeslide_box1').hide();
                    $('#homeslide_box4').hide();
                } else if(slide2 == 3) {
                    slide1 = 4;
                    $('#homeslide1').hide();
                    $('#homeslide2').hide();
                    $('#homeslide_box1').hide();
                    $('#homeslide_box2').hide();
                } else if(slide2 == 4) {
                    slide1 = 1;
                    $('#homeslide2').hide();
                    $('#homeslide3').hide();
                    $('#homeslide_box2').hide();
                    $('#homeslide_box3').hide();
                }
            }

            if(($('homeslide1:animated','homeslide2:animated','homeslide3:animated','homeslide4:animated').length< 1) && !(vars.in_animation)) {
                if(!(slide1 == slide2)) {
                    //alert ('Slide clicked: ' + slide1 + ' Current slide: ' + slide2);
                    $('.homeslide_box' + slide1).show();
                    $('.homeslide_box' + slide1).css('left','85%');
                    $('.homeslide_box' + slide2).animate({
                        left:'-200%'
                    }, 2000)

                    $('.homeslide_box' + slide1).animate({
                        left:'1.8%',
                        display: 'none'
                    }, 2000);

                    $('#homeslide' + slide1).css('left','85%');
                    $('#homeslide' + slide1).css('margin-left','264px');
                    $('#homeslide' + slide1).show();

                    $('#homeslide' + slide2).animate({
                        left:'-200%'
                    }, 2000)

                    $('#homeslide' + slide1).animate({
                        left:'10%',
                        display: 'none'
                    }, 2000);
                }
            }

            base.goTo2(targetSlide);
            return false;

        });
    }
4

0 回答 0