1

毎分画像を変えたいです。コンピューターの時計が8:50から8:51に移動し、次に8:52に移動して8:49に戻ると、画像を0001.jpgから0002.jpg、0003.jpg、1440に変更します。 jpg。

コンピューターの時計を使うので、JavaScriptを使うことに興味があります。私も始めたばかりなので、完全なコード（これは素晴らしいでしょう！）はおそらく私が必要とするものではありません。代わりに、私は出発点と多分進むべき方向を探しています。あなたが知っているオンラインのリソースも役に立ちます

4

4 に答える 4

2

次の分が始まるまでの秒数を計算し、setTimeoutbegin を使用して画像を回転させます。setInterval60000 ミリ秒ごとにこれを行うために使用します。

var seconds = 60 - new Date().getSeconds();


setTimeout(function(){

    console.log('start');

    setInterval(function(){

        console.log ('iterate over pictures here');

    }, 1000 * 60);

}, seconds * 1000);

両方の機能の詳細については、こちらをご覧ください

于 2011-06-07T08:01:29.143 に答える
1

以下のコードをページの本文に配置します。

<img />
<script>
    var start = new Date().getTime(),
        i = 0,
        //get the node of the image to change
        img = document.getElementsByTagName('IMG')[0]; 

    setInterval(function(){
        //what time is now
        var now = new Date().getTime();
        if(now - start > 60000){
            //initialize the counter
            start = now;
            //overlay with 0's -> substr(-4)
            //rotate on 1440 with a modulo -> i++ % 1440
            img.src = ('000' + (i++ % 1440 + 1)).substr(-4)  + '.jpg';
        }
    }, 10000); //check every 10 sec
</script>

Javascriptから始める場合は、MDCを参考にしてください。

于 2011-06-07T08:16:41.967 に答える
1

を勉強したくなるでしょうsetInterval()。

コードは次のようになります。

var counter = 1,
lastUpdate = (new Date()).getTime(),
img = document.getElementById('image'); // Assuming your HTML has an img tag
                                        // with an id of "image"
// This function just pads your number with 0s
function pad(num) {
    var padding = '',
    i = 4 - num.toString().length;
    while (i > 0) {
        padding += '0';
        i -= 1;
    }
    return padding + num;
}    

// This function is what actually does the updating
function update() {
    var now = (new Date()).getTime();
    if (lastUpdate + 1000 <= now) {
        lastUpdate = now;
    img.src = pad(counter) + '.jpg'; // change the image
    counter += 1; // increment the counter

    if (counter > 1440) { // reset to 1 if we get to our last image
        counter = 1;
    }
    }
}

// Run update every 10th of a second
setInterval(update, 100);

Mozilla Developer Center サイトには、すばらしいJavaScriptとDOMのリファレンスがたくさんあります。また、 JSLintの使い方を学ぶことをお勧めします。これは、頭痛の種となる愚かな構文エラーを回避するのに大いに役立ちます。Douglas Crockford の本JavaSript: The Good Partsと Stoyan Stefanov のObject-Oriented JavaScriptを読むことをお勧めします。どちらも JavaScript を学ぶのに優れた本です。

于 2011-06-07T08:00:37.123 に答える
0

これをコンピュータの時計に合わせて実行したい場合。をsetInterval1 秒未満の遅延 (<1000) で使用し、実際の時間を で確認しDate()ます。このようにして、時計に合わせて変更を加えることができます。

于 2011-06-07T08:04:00.747 に答える