如何旋轉div中的內容？

我有一個div位於頁面左側，它有另一個div內容填滿div，我想要做的是交換內部div，另一個div在10秒後填充不同的內容。之後再次10秒我的主頁上旋轉回第一個div等..如何旋轉div中的內容？

我已經PHP的包括「left_box.php」的..該網頁上的代碼看起來像

<div class="span3 main_div"> 

<!-- first div --> 
    <div class="well sidebar-nav transfer-central"> 
    <?php include 'includes/transfer_central.php'; ?> 
    </div> 

<!-- second div --> 
    <div class="well sidebar-nav fixture-results"> 
    <?php //include 'includes/fixture-results.php'; ?> 
    </div> 

</div>

我已經把兩個div（包括），我想出現在主div但目前只有第一個div出現..但如何10秒後，我得到第二個div取代主div內的第一個div？

我環顧四周，只是不能似乎得到我的頭周圍

來源

2014-01-28 Richard Marston

有許多jQuery幻燈片插件，你可以使用。這裏是一個例子：http://jquery.malsup.com/cycle2/demo/non-image.php – 3dgoo

可能的重複：https://stackoverflow.com/questions/19070927/javascript-text-slideshow – 3dgoo

使用javascript setTimeout函數要做到這一點。 – user3123529

的jsfiddle：http://jsfiddle.net/Arj2C/

HTML：

<div id="outerdiv"> 
    <div class="" id="1"> 
     <!--content--> 
    </div> 
    <div class="hidden" id="2"> 
     <!--content--> 
    </div> 
    <div class="hidden" id="3"> 
     <!--content--> 
    </div> 
    <div class="hidden" id="4"> 
     <!--content--> 
    </div> 
</div>

JS（使用jQuery）：

var next = 2; 
$(function(){ 
    setInterval(function(){ 
     if(next == 1) $("#4").toggleClass("hidden"); 
     $("#" + (next-1)).toggleClass("hidden"); 
     if(++next == 5) { 
      //$("#4").toggleClass("hidden"); 
      $("#" + (next-1)).toggleClass("hidden"); 
      next = 1; 
     } else $("#" + (next-1)).toggleClass("hidden"); 
    }, 10000); 
});

CSS：

.hidden { 
    display: none; 
}

來源

2014-01-28 23:47:03 nike4613

如何旋轉div中的內容？

回答

相關問題