正确使用jQuery菜单功能进入Wordpress使用主题专门构建Wordpress网站后,我对这些庞大的主题网站所包含的内容感到沮丧。我冒险尝试使用Underscores框架构建我的第一个站点。如何使用get_template_directory_uri()代替
我目前有实施一些jQuery的菜单滑动到WordPress站点麻烦:www.AtlanticWebsites.co.uk
我想实现一些jQuery的从bigSlide.js
http://ascott1.github.io/bigSlide.js/#how
来源步骤我已经采取了:
上传bigSlide.js文件到js.folder /目录
这包含以下所有代码: https://raw.githubusercontent.com/ascott1/bigSlide.js/master/dist/bigSlide.min.js
插入下面的代码到functions.php文件:
function atlanticwebsites_init_js_scripts() {
wp_enqueue_script('big_Slide', get_template_directory_uri() .
'/js/bigSlide.js', array('jquery'), '1.0', true);
}
add_action('wp_enqueue_scripts', 'atlanticwebsites_init_js_scripts');
插入下面的代码放入header.php文件:
<a href="#menu" class="menu-link">☰</a>
<nav id="menu" class="panel" role="navigation">
<ul>
<li><a href="#">Web Design</a></li>
<li><a href="#">Optimisation</a></li>
<li><a href="#">Google Adwords</a></li>
<li><a href="#">Responsive Design</a></li>
<li><a href="#">Our Work</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script src="jquery.big-slide.js"></script>
<script>
$(document).ready(function() {
$('.menu-link').bigSlide();
});
</script>
我已将以下代码插入到style.css
.panel {
position: fixed;
left: -15.625em; /*left or right and the width of your navigation panel*/
width: 15.625em; /*should match the above value*/
}
.wrap {
position: relative;
}
菜单选项卡显示,但不起作用。 问题可能有人检查什么是缺少的? 我怀疑我错误地放置了代码
function.php或header.php 或省略代码?
另外,我是否应该去掉与“导航”相关的现有代码,该代码已预填充Underscores Framework基本安装?
非常感谢
在浏览器的调试模块中,您可以看到是否有404错误。另外为什么你定义?我想你应该定义更具体的相关路径 –
如果你排队你的脚本,并假设你正在使用['wp_head()'](https://codex.wordpress.org/Plugin_API/Action_Reference/wp_head)头模板文件,不需要像在header.php中那样对'jquery.big-slide.js'进行硬编码。另外我发现header.php有问题。这不是你想放置你的脚本的地方。 –