2016-04-21 17 views
0

5秒後に自動的に次のdivをプログラムし、私はそれが7秒後のフレームを変更する必要があります。 私のアイデアは最初のフレーム、7秒後のフレーム2、7秒後のフレーム3はボタンが続く。は、どのように私は新しいウェブサイトを開発してい

誰もがそれに私を助けることはできますか?

私がこれまで持っているコードは次のとおりです。

<header id="home"> 
<div id="home-slider" class="carousel slide carousel-fade" data-ride="carousel"> 
    <div class="carousel-inner"> 
    <div class="item active" style="background-image: url(images/slider/1.jpg)"> 
     <div class="caption"> 
     <h1 class="animated fadeInLeftBig">Bem Vindo 
     </div> 
    </div> 
    <div class="item" style="background-image: url(images/slider/2.jpg)"> 
     <div class="caption" 
     <h1 class="animated fadeInLeftBig">NÓS SOMOS </h1> 
     </div> 
    </div> 
    <div class="item" style="background-image: url(images/slider/3.jpg)"> 
     <div class="caption"> 
     <h1 class="animated fadeInLeftBig"> <span>The Outsider Marketing Company</span></h1> 
     <p class="animated fadeInRightBig">MARKETING - COMUNICAÇÃO - WEBDESIGN</p> 
     <a data-scroll class="btn btn-start animated fadeInUpBig" href="#services">PROSSEGUIR</a> 
     </div> 
    </div> 
    </div> 
    <a class="left-control" href="#home-slider" data-slide="prev"><i class="fa fa-angle-left"></i></a> 
    <a class="right-control" href="#home-slider" data-slide="next"><i class="fa fa-angle-right"></i></a> 

    <a id="tohash" href="#services"><i class="fa fa-angle-down"></i></a> 
+0

は、フレーム、あなたは正確に何を意味するのですか? –

答えて

0

は、私はあなたがjQueryの経由やりたいと思い、あなたがdisplay:blockとルールdisplay: noneとアクティブでアイテム・クラスを持っているので、このコードを試す必要があります。

あなたが言うとき
$(document).ready(function(){ 
    var currentItem = 0, 
    items  = $('.item'); 

    setTimeout(function(){ 
     items.removeClass('active'); 
     items[currentItem].addClass('active'); 
     if(currentItem == items.lenght - 1) 
      currentItem = 0; 
    }, 7000) 

}); 
関連する問題