菜单中的 jQuery 幻灯片不适用于 drupal

Question

我正在尝试在开发页面中创建一个菜单幻灯片，但我在运行 jQuery 脚本时遇到了问题(该网站使用的是 Drupal 7 和 jQuery 1.9.1)。

附言。关于类和 id 的解释:1) .toggle-nav 是 anchor 标签的类，它将在点击时激活菜单的滑入动画2) #site-wrapper 包含页面的 Canvas 内元素。

$(document).ready(function() {
$('.toggle-nav').click(function() {

    if ($('#site-wrapper').hasClass('show-nav')) {

    $('#site-wrapper').removeClass('show-nav');
    }   
    else {
    $('#site-wrapper').addClass('show-nav');
    }
});
});

脚本是在这篇文章的帮助下创建的:http://scotch.io/tutorials/off-canvas-menus-with-css3-transitions-and-transforms#browser-support-help

感谢您的宝贵时间和帮助!

Answer 1

首先，在Drupal中使用正确的JS写法:

(function($) {

  Drupal.behaviors.toggleNav = {
    attach: function(context, settings) {

      $('.toggle-nav').click(function() {
        if ($('#site-wrapper').hasClass('show-nav')) {
          $('#site-wrapper').removeClass('show-nav');
        }
        else {
          $('#site-wrapper').addClass('show-nav');
        }
      });

    }
  };

}(jQuery));

如果这没有帮助，问题肯定是在这个脚本之外的某个地方。