0

こんにちは、ページで flexslider を 2 回使用したいと考えています。このチュートリアルを見つけました: http://www.myjqueryplugins.com/comment/reply/33しかし、運がありませんでした。以下は、関数ファイルにあるコードです。誰が私がどこで間違っているのか知っていますか?

function anaximander_flexslider() {
    if (!is_admin()) {

        // Enqueue FlexSlider JavaScript
        wp_register_script('jquery_flexslider', get_template_directory_uri(). '/js/jquery.flexslider-min.js', array('jquery') );
        wp_enqueue_script('jquery_flexslider');

        // Enqueue FlexSlider Stylesheet        
        wp_register_style( 'flexslider-style', get_template_directory_uri() . '/CSS/flexslider.css', 'all' );
        wp_enqueue_style( 'flexslider-style' );

        // FlexSlider custom settings       
        add_action('wp_footer', 'anaximander_flexslider_settings');

        function anaximander_flexslider_settings() { ?>         
        <script type="text/javascript" charset="utf-8">
            $(window).load(function() {
    $('#main-slider').flexslider({
      animation: 'slide',
      controlsContainer: '.flex-container'
    });

    $('#logo-slide-show').flexslider();
  });
            </script>
        <?php 
        }

    }
}

add_action('init', 'anaximander_flexslider');
4

2 に答える 2

0

関数でわかるように、flexslider のコントロールとアニメーションは '#main-slider' のような要素 ID に基づいています。ただし、スライダーを 2 回使用すると、同じ ID が 2 つあるために競合が発生します。

異なる ID を持つ 2 つの独立したスライダーを作成し、それらを生成するために 2 つの異なる 'anaximander_flexslider()' を用意するために必要なもの。

于 2013-09-05T09:34:28.843 に答える
0

ここに私が取るいくつかのステップがあります：

  1. Firebug でコンソールを確認してください - エラーはありますか?
  2. Firebug で HTML を確認してください - スクリプトはロードされていますか? そうでない場合は、パスを確認してください
  3. Flexslider を、複数のインスタンスを許可する jQuery プラグインに置き換えます。Cycle またはCycle2は、スライダーの世界の優れた主力製品です
  4. 関数を他のanaximander_flexslider_settings関数から取り出して、独立して呼び出せるようにする
  5. それでも機能しない場合wp_enqueue_script, wp_register_scriptは、ヘッダーに etc を直接配置し、機能するようになったら、関数とフックを使用してそれらを再度呼び出して、そこにある問題を除外します。
于 2013-09-05T13:06:05.423 に答える