0

第一次在这里问问题，所以我会尽量让礼仪正确:)

我无法让 iDangerous swiper 与我的 Wordpress 安装一起使用。目前它是在 BitNami 中运行的本地安装，所以我无法分享链接，但我会尽力解释情况。我最好的 Google-Fu 无法找到答案。

首先，根据http://www.idangero.us/sliders/swiper/api.php的使用说明，我让 Swiper 在最小的 HTML 测试页面上运行得很好。

头部示例

<link rel="stylesheet" href="idangerous-swiper.css">
<script defer src="idangerous-swiper-1-9-4-min.js"></script>
<script type="text/javascript">
window.onload = function() {
    var mySwiper = new Swiper('.swiper-container',{
        //Your options here:
        mode:'horizontal',
        loop: true
        //etc..
    });  
}
</script>

正文示例

<div class="swiper-container">
    <div class="swiper-wrapper">

        <!--First Slide-->
        <div class="swiper-slide">
        <p>Slide One</p>
        </div>

        <!--Second Slide-->
        <div class="swiper-slide">
        <p>Slide Two</p>
        </div>

        <!--Third Slide-->
        <div class="swiper-slide">
        <p>Slide Three</p>
        </div>

    </div>
</div>

上述功能在最小测试中符合预期，但如果我在我的 wordpress 站点的 header.php 中执行相同操作，则标记有适当类的 HTML（根据上面的正文示例）不会变成交互式的。脚本文件似乎已在 Firebug 中加载，但仍未生效。

正如 WordPress 法典建议的那样，我已经尝试过“加入”脚本：

// Adds swiper js
function MyTheme_swiper() {
wp_enqueue_script(
    'mtswiper',
    get_template_directory_uri() . '/../mychildtheme/js/idangerous-swiper194.js',
    array( 'jquery' )
);
}

add_action( 'wp_enqueue_scripts', 'MyTheme_swiper' );

但这具有相同的结果；该脚本在 Firebug 中加载，但不在页面上运行。

我还尝试将初始化 swiper 的小脚本从头部转移到一个单独的 JS 文件中，并将其加入队列。同样，新脚本出现在 Firebug 的网络监视器中，但没有运行。

怀疑 jQuery 可能是问题所在，我将所有$快捷方式更改为jQuery，这是来自 Worpress Codex 的另一个提示。

jQuery(function(){
var mySwiper = jQuery('.swiper-container').swiper({
    //Your options here:
    mode:'horizontal',
    loop: true
    //etc..
});
})

但仍然没有骰子。

不知道从这里可以去哪里。我可以很好地解决 HTML 和 CSS 问题，但 PHP 和 JS 仍然让我很头疼。

请注意，在早期，我将 Swiper CSS 从默认值idangerous-swiper.css转移到了我的主样式表中。它的这一面按预期工作。

任何帮助将不胜感激。

皮特。

4

2 回答 2

1

抱歉这么晚才回复，才看到你的回复。问题很简单，在你的startswiper.js文件中，用jQuery替换$，比如

jQuery(function(){
    var mySwiper = jQuery('.swiper-container').swiper({
        //Your options here:
        mode:'horizontal',
        loop: true
        //etc..
    });
})
于 2013-07-24T15:27:32.703 回答
0

实际上必须使用这个

function MyTheme_swiper() {
wp_enqueue_script(
    'mtswiper', get_template_directory_uri() . '/../mychildtheme/js/idangerous-swiper194.js',
array( 'jquery' ), false, true
);
}
add_action( 'wp_enqueue_scripts', 'MyTheme_swiper' );

必须检查https://developer.wordpress.org/reference/functions/wp_enqueue_script/

这里的目标是script放入footer. 默认情况下，它转到header.

于 2021-03-03T14:45:32.103 回答