0

onClick="move()"ユーザーがタグにあるメニュー画像をクリックするたびに、メニューから画像をドロップアップ/ダウンさせようとしています。これまでのところ、画像はメニューの後ろのページの上部から始まるため、非表示になり、意図したとおりに下にスライドします。ただし、画像が停止点に達した後、IE と Chrome の両方でページをテストすると、メニューを再度クリックしても何も起こりません。Dreamweaver では、コードは意図したとおりに実行され、画像が一番下に達したら上にスライドし、再び下に戻すことができます。setInterval() への呼び出しを変更しようとしましたが、そこに問題があると想定していましたが、何も機能していないようです。Dreamweaver ではコードが正しく実行されるのに、Chrome や IE では実行されないのはなぜですか?

    var onMusic=false;
    var id;
    function move() {
        if(!onMusic) {
          moveDown()        
        }
        else {
            moveUp()
        }
    }


    function moveUp() {
        top=100
        id = setInterval(function() {
            top-=10  // update parameters 
            document.getElementById('guitar').style.top = top + 'px' // show frame
            if (top <= -500)  {// check finish condition
                onMusic=false
                clearInterval(id)
            }
         }, 10) // draw every 10ms
    }

    function moveDown() {
        var top=-500
        id = setInterval(function() {
            top+=10  // update parameters 
            document.getElementById('guitar').style.top = top + 'px' // show frame
            if (top == 100)  {// check finish condition
                onMusic=true
                clearInterval(id)
            }
        }, 10) // draw every 10ms
    }
4

2 に答える 2

0

問題は次のとおりだったと思います。

top=100
// should be
var top = 100;

コンソールで試して、私が何を意味するかを確認できます。

>top = 12 
12 
> top 
Window {top: Window, window: Window, location: Location, Proxy: Object, external: Object…}

しかし、jsfiddle でもう少しクリーンアップしました: http://jsfiddle.net/pNh57/1/

于 2013-07-07T13:03:03.287 に答える