0

私のプロジェクトでは、OwlCarousel を使用しています。http://www.owlgraphic.com/owlcarousel/#more-demos

ページに 3 つのカルーセルを表示することができました。しかし、ページが遅くなってきていると思います。多くのステップを踏む可能性はありますか?

実際には json ファイルを読み込む必要はありません。なぜなら、localStorage1 ページ前に保存しているからです。しかし、コードを壊さずに削除する方法がわかりませんでした。

主な問題は、3 つのカルーセルすべてを満たすために jQuery 呼び出しを 1 回だけ行う方法です。


これは、カルーセルを呼び出すために使用するコードです。

<div id="dodatni1" style="visibility:hidden" >
  <div id="owl-demo" class="owl-carousel" ></div>
</div> 

<div  id="dodatni2" style="visibility:hidden" >
  <div id="owl-demo2" class="owl-carousel" ></div>
</div> 

<div  id="dodatni3" style="visibility:hidden" >
  <div id="owl-demo3" class="owl-carousel" ></div>
</div>

これがカルーセル コードです。

$(document).ready(function() {

  $("#owl-demo").owlCarousel({
    jsonPath : 'json/fakeData.json',
    jsonSuccess : customDataSuccess,
    lazyLoad : false
  });

  function customDataSuccess(data){
    var content = "";
    var stevec = 0;
    var dolzina = parseInt(localStorage.getItem('dolzina'));
    for(var j=0;j<dolzina;j++){
      if (stevec<10){
        var imgg ="http://www.spleticna.si/images/"+localStorage.getItem('imga'+j);
        var doza = localStorage.getItem('dozaa'+j);
        if (doza == 3239){
          content += "<a href=\"produkt.html?id=" + j + "&slider=a\" target='frejm' onclick='pokaziiframe()'><img src=\"" + imgg + "\" onError=this.src='napaka.png'></a>"
          stevec=stevec+1;
        }
      }
    }
    $("#owl-demo").html(content);
  }


});

$(document).ready(function() {

  $("#owl-demo2").owlCarousel({
    jsonPath : 'json/fakeData.json',
    jsonSuccess : customDataSuccess,
    lazyLoad : false
  });

  function customDataSuccess(data){
    var content = "";
    var stevec = 0;
    var dolzina = parseInt(localStorage.getItem('dolzina'));
    for(var j=0;j<dolzina;j++){
      if (stevec<10){
        var imgg = "http://www.spleticna.si/images/" + localStorage.getItem('imga'+j);
        var doza = localStorage.getItem('dozaa'+j);
        if (doza == 2615){
          content += "<a href=\"produkt.html?id=" + j + "&slider=b\" target='frejm' onclick='pokaziiframe()'><img src=\"" + imgg + "\" onError=this.src='napaka.png'></a>"
          stevec=stevec+1;
        }
      }
    }
    $("#owl-demo2").html(content);
  }


});

$(document).ready(function() {

  $("#owl-demo3").owlCarousel({
    jsonPath : 'json/fakeData.json',
    jsonSuccess : customDataSuccess,
    lazyLoad : false
  });

  function customDataSuccess(data){
    var content = "";
    var stevec = 0;
    var dolzina = parseInt(localStorage.getItem('dolzina'));
    for(var j=0;j<dolzina;j++){
      if (stevec<10){
        var imgg = "http://www.spleticna.si/images/" + localStorage.getItem('imga'+j);
        var doza = localStorage.getItem('dozaa'+j);
        if (doza == 3140){
          content += "<a href=\"produkt.html?id=" + j + "&slider=c\" target='frejm' onclick='pokaziiframe()'><img src=\"" + imgg + "\" onError=this.src='napaka.png'></a>"
          stevec=stevec+1;
        }
      }
    }
    $("#owl-demo3").html(content);
  }

});
4

1 に答える 1

1

どのくらいの速度が得られるかはわかりませんが、JS を書き直すことができます。

$(document).ready(function(){

    //Assuming they all use the same data source/settings?
    $("#owl-demo3,#owl-demo2,#owl-demo1").owlCarousel({
        jsonPath : 'json/fakeData.json',
        jsonSuccess : customDataSuccess,
        lazyLoad : false
    });

    function customDataSuccess(data){
        var content = "";
        var stevec = 0;
        var dolzina = parseInt(localStorage.getItem('dolzina'));
        for(var j=0;j<dolzina;j++){
            if (stevec<10){
                var imgg = "http://www.spleticna.si/images/" + localStorage.getItem('imga'+j);
                var doza = localStorage.getItem('dozaa'+j);
                if (doza == 3140){
                    content += "<a href=\"produkt.html?id=" + j + "&slider=c\" target='frejm' onclick='pokaziiframe()'><img src=\"" + imgg + "\" onError=this.src='napaka.png'></a>"
                    stevec=stevec+1;
                }
            }
       }
       $("#owl-demo3").html(content);
   }
});
于 2014-06-11T17:53:15.830 に答える