3

3000私はこの JavaScript/jQuery アニメーション関数をここに持っていて、 usingごとにループさせたいwindow.onload = function(){}のですが、何らかの理由で機能していません。私はjavascriptを初めて使用するため、構文/基本的なエラーが原因である可能性があると思いますが、別の方法を使用する必要がある場合は教えてください。これが私のコードです：

function animTile(){
    $(".main-content").delay(3000).animate({
        top: "100%"
    });

    $(".secondary-content").delay(3000).animate({
        top: "0"
    });
}

window.onload = function(){
    animTile(); setInterval(animTile, 3000);
}

編集：

多分これも役立つかもしれません。これが私のCSSコードです：

    #wrap {
        display: block;
        height: 328px;
        width: 568px;
        overflow: hidden;
    }

    #wrap .main-content {
        display: block;
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0%;
    }

    #wrap .secondary-content {
        display: block;
        height: 100%;
        width: 100%;
        position: absolute;
        top: 100%;
    }
4

3 に答える 3

1

次のようなことを試してください：

 function animTile(){
$(".main-content").delay(3000).animate({
    top: "100%"
});

$(".secondary-content").delay(3000).animate({
    top: "0"
});
 animTileTwo();
}

function animTileTwo(){
$(".main-content").delay(3000).animate({
    top: "0"
});

$(".secondary-content").delay(3000).animate({
    top: "100%"
});
}


  window.onload=function(){
     setInterval("animTile()", 3000);
 }
于 2012-11-23T03:32:14.343 に答える
0

これを試して：

function animTile(){
$(".main-content").animate({
    top: "100%"
}, 1000);

$(".secondary-content").animate({
    top: "0"
}, 1000);
setTimeout('animTile()', 3000);
}

window.onload = function(){
animTile();
}
于 2012-11-23T03:34:51.450 に答える
0

なぜ「遅延」機能を使用したのですか? なんでしょう？また、ループ アニメーションが必要だとおっしゃいましたが、コードでは各要素のステータスが 1 つしか見つかりませんでした。つまり、ループ アニメーションが必要な場合は、プロパティを値 A に設定し、後で値 B に設定し、後で値 A に戻す必要があります。これがループです。

したがって、「top」プロパティを「100%」に設定し、3000 ミリ秒後に 0 に設定し、3000 ミリ秒後に「100%」に設定する必要があると思います。そうですか？

それが必要な場合は、次のコードを試してください。

    function toggle() {
        var elem = $('#id');
        if (elem.css('top') == '700px') {
            elem.animate({
                top: "0"
            });
        } else {
            elem.animate({
                top: "700px"
            });
        }
    }
    toggle();
    setInterval(toggle, 3000);
于 2012-11-23T03:51:57.763 に答える