0

嗨,我想在一个页面上使用 flexslider 两次。我找到了这个教程: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

以下是我将采取的一些步骤:

  1. 检查 Firebug 中的控制台 - 是否有任何错误?
  2. 检查 Firebug 中的 HTML - 是否正在加载脚本?如果没有,请检查路径
  3. 将 Flexslider 替换为允许多个实例的 jQuery 插件;Cycle 或Cycle2是滑块世界的强大主力
  4. anaximander_flexslider_settings函数从另一个函数中取出,以便可以独立调用
  5. 如果它仍然不起作用,请将wp_enqueue_script, wp_register_scriptetc 直接放在标题中,然后一旦你让它工作,你可以再次使用函数和钩子调用它们,以排除那里的任何问题。
于 2013-09-05T13:06:05.423 回答
0

正如我们在您的函数中看到的那样,flexslider 的控制和动画基于元素 ID,例如 '#main-slider' 。但是如果你使用滑块两次,就会因为 2 个相同的 id 而发生冲突。

您需要制作 2 个具有不同 id 的独立滑块,并有 2 个不同的 'anaximander_flexslider()' 来生成它们。

于 2013-09-05T09:34:28.843 回答