在兩個div之間創建javascript動畫

-2

我有一個包含兩個主div的容器。容器的可見區域是540px高1024px（這意味着容器外的任何東西都被「隱藏」了）。與第一個div可見，等待10秒，然後「滾動」到第二個div並停止，並且不會回到起點。在兩個div之間創建javascript動畫

我想我會不得不使用javascript或jquery，因爲CSS3動畫將無法做到這一點（由於事實上我想動畫在頁面加載後啓動）。我制定了一個我想要做的基本形象，但除此之外，我不知道我會從哪裏開始。幫幫我！！！

更新：我已經張貼在這裏更新的爵士小提琴利用極其有限的知識，我有：

http://jsfiddle.net/D7Aad/16/

目前我有兩個幻燈片之間的「變臉」，這個想法是，與其褪色，頁面會自動向下滾動到第二個div，然後停止並不重複。

我想我的問題可能在於JavaScript代碼：

var continuous = function() { 
$("#slide_one").fadeToggle(600); 
$("#slide_two").fadeToggle(600); 
} 

setInterval(continuous,5000);

enter image description here

如果有專門會幫我解釋一下我在尋找任何細節，請張貼在評論，我會盡快回復您。

來源

2013-04-03 Justin Brown

我恨這部分.. **你嘗試過什麼** – George

也許你能爲你提供的div的標記？也許在http://jsfiddle.net的演示中。 – nnnnnn

對於缺少的信息傢伙感到抱歉，我嘗試過使用CSS3動畫做，但沒有任何運氣（主要是由於缺乏知識）。我用粗糙的JS小提琴示例更新了主要問題。 –

這裏是一個working fiddle

$(document).ready(function() { 
    //Show both slides 
    $('#slide_one, #slide_two').show(); 
    //Define a 2 seconds timeout before starting the animation 
    setTimeout(function() { 
     $('body').animate({ 
      //Scroll to #slide_two div 
      scrollTop: $("#slide_two").offset().top 
     }, 2000); // the scroll down animation will last 2 seconds 
    }, 2000); // after 2 seconds, scroll down 
});

來源：jQuery scroll to element

來源

2013-04-03 10:47:15 tiagojpdias

在兩個div之間創建javascript動畫

回答

相關問題