0

ホームページを Web サイトに構築しましたが、カテゴリ スライダーは正常に機能していましたが、wordpress でサイトを構築し、レイヤード スライダー プラグインを追加すると、カテゴリ スライダーが機能しなくなりました。

ここにウェブサイトがあります http://www.fiestapints.co.uk/new/

これら2つのjquery間の競合だと思いますが、かなり複雑なプラグインであるため、レイヤースライダー1（最初のjqueryコード）を変更できません..

誰かがこれで私を助けてくれるなら、それは素晴らしいことです、事前に感謝します

<script pagespeed_orig_type="text/javascript" type="text/psajs" orig_index="9">
jQuery(document).ready(function () {
      jQuery("#layerslider_1").layerSlider({
          width: '940px',
          height: '395px',
          responsive: false,
          responsiveUnder: 0,
          sublayerContainer: 0,
          autoStart: true,
          pauseOnHover: false,
          firstLayer: 1,
          animateFirstLayer: false,
          randomSlideshow: false,
          twoWaySlideshow: true,
          loops: 0,
          forceLoopNum: true,
          autoPlayVideos: true,
          autoPauseSlideshow: 'auto',
          youtubePreview: 'maxresdefault.jpg',
          keybNav: true,
          touchNav: true,
          skin: 'minimal',
          skinsPath: 'http://www.fiestapaints.co.uk/new/wp-content/plugins/LayerSlider/skins/',
          globalBGColor: 'transparent',
          navPrevNext: true,
          navStartStop: true,
          navButtons: true,
          hoverPrevNext: true,
          hoverBottomNav: false,
          thumbnailNavigation: 'hover',
          tnWidth: 100,
          tnHeight: 60,
          tnContainerWidth: '60%',
          tnActiveOpacity: 35,
          tnInactiveOpacity: 100,
          imgPreload: true,
          yourLogo: false,
          yourLogoStyle: 'left: 10px; top: 10px;',
          yourLogoLink: false,
          yourLogoTarget: '_self',
          cbInit: function (element) {},
          cbStart: function (data) {},
          cbStop: function (data) {},
          cbPause: function (data) {},
          cbAnimStart: function (data) {},
          cbAnimStop: function (data) {},
          cbPrev: function (data) {},
          cbNext: function (data) {}
      });
});
</script>

と

<script pagespeed_orig_type="text/javascript" type="text/psajs" orig_index="3">
  jQuery(document).ready(function () {
      jQuery('#mycarousel').
      jcarousel({
          auto: 2,
          wrap: 'last',
          initCallback: mycarousel_initCallback
      });
  });

  function mycarousel_initCallback(carousel) {
      carousel.buttonNext.bind('click', function () {
          carousel.startAuto(0);
      });
      carousel.buttonPrev.
      bind('click', function () {
          carousel.startAuto(0);
      });
      carousel.clip.hover(function () {
              carousel.stopAuto();
          },
          function () {
              carousel.startAuto();
          });
  };
</script>
4

1 に答える 1

0

pagespeed type=text/psajs pagespeed は、onload イベントを作成してこれらの JavaScript を延期します。ただし、onload は document.ready の後に発生します...

したがって、コードの操作順序は...

document.ready の発火

onload は、document.ready にフックするスクリプトを実行して起動します

document ready はすでに起動しているため、ready の呼び出しはすぐに実行されます

そのため、オンロード中に

  1. レイヤースライダー関数が呼び出されます
  2. jcarousel 関数が呼び出され、定義されていないコールバックを指そうとします。
  3. initcallback が定義されている

jquery ready jcarousel を呼び出す前に、onload 中に initcallback およびその他のコールバックまたはサービス関数を定義する必要があります。

<script pagespeed_orig_type="text/javascript" type="text/psajs" orig_index="3">
  function mycarousel_initCallback(carousel) {
    carousel.buttonNext.bind('click', function () {
      carousel.startAuto(0);
    });
    carousel.buttonPrev.
    bind('click', function () {
      carousel.startAuto(0);
    });
    carousel.clip.hover(function () {
          carousel.stopAuto();
    },
    function () {
        carousel.startAuto();
    });
  };

  jQuery(document).ready(function () {
    jQuery('#mycarousel').
    jcarousel({
      auto: 2,
      wrap: 'last',
      initCallback: mycarousel_initCallback
    });
  });

</script>

また、jquery の準備は、このコードのコンテキスト内では完全に不必要です。取り外して電話をかけることができます。

于 2014-03-19T23:27:37.160 に答える