2016-08-12 6 views
0

私はバナースライダを操作して、すべてのバナーからすべてのDOMレンダリングされたimgタグを取り除くことを試みています - 最初のものを除き、 タイムアウトをに設定して、数秒単位で一度に送信します。私はちょうど画像の量/サイズのためにページの読み込み量を低下させようとしていません。jQueryある場所からHTMLコードを抽出して別の場所に配置する

私の問題は、私はimgタグの最初のインスタンスをバイパスし、他の人を削除する場合文を取得するように見えることができないということです。そのすべてまたはなし、私はimg [0]が正しくないと思う。私はまた、CSSの第一子もありません運と1次回()を試みたが、している & n番目の子(1)。私はまたimgタグhtmlで新しい配列を作成して、次に続けてみました...しかし、それは証明しましたいいえのどちらかです。

どのように私はこれを得ることができますか?そしてもし皆さんがより良いアプローチをしていれば、私は提案のために開いています。

ありがとうございます。

var img = $('div > img'); 
 
$.each(img, function(i) { 
 
    if (!img[0]) { 
 
    img.remove(); 
 
    setTimeout(function(){ 
 
     $('.main').append(img); 
 
    }, i * 2000); 
 
    } 
 

 
});
.main { 
 
    width: 200px; 
 
    height: 80px; 
 
    padding: 10px; 
 
    overflow: visible; 
 
    border: 2px solid red; 
 
} 
 
.div1, 
 
.div2, 
 
.div3 { 
 
    width: 200px; 
 
    height: 80px; 
 
    background: #ccc; 
 
    float: left; 
 
    position: absolute; 
 
} 
 
.div2 {left:232px;} 
 
.div3 {left:437px;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="main"> 
 
     
 
    <div class='div1'> 
 
     <img src="#" alt=""> 
 
    </div> 
 
    <div class='div2'> 
 
     <img src="#" alt=""> 
 
    </div> 
 
    <div class='div3'> 
 
     <img src="#" alt=""> 
 
    </div> 
 

 
</div>

答えて

0

あなたが遅延ロードの話をしているように思えます。 lazysizesを見て、彼らはデモリンクを持っています。

+0

はい、そのようなものですが、残念ながらこれは既にCMSに組み込まれているバナーシステム用です。他のサードパーティのライブラリを含めることはできません。私はCMSで自分が持っているものと仕事をしなければなりません。 – Sergio

+0

おそらくグーグルレイジングロードバニラjsを試してみてください、私はそれを試みて何も見つかりませんでした。 CDN経由で外部ライブラリを読み込めない場合は、わかりません。ごめんなさい。 – urubuz

関連する問題