自定义jquery脚本.手风琴风格的垂直菜单为magento



我在网上找到了这个jquery脚本,需要对它进行一些自定义。它的作用是使magento中的垂直菜单具有手风琴效果。不过,它只对第一个类别这样做,不允许您访问它。我想保留这一点,但也允许以相同的样式打开较低的类别,但也可以在单击时将它们转到正确的页面。我希望这是有道理的!

这是脚本:

//
// this script was written by Ben Frain - more info at http://www.benfrain.com
// 
jQuery(document).ready(function(){
  jQuery('ul#vertnav > li > ul')
    .click(function(e){
      e.stopPropagation();
    })
    .hide();

//this section below prevents the first level links being followed. 
  jQuery('ul#vertnav > li').click(function(event) {
  event.preventDefault();
});
  jQuery('ul#vertnav > li, ul#vertnav > li > ul > li').click(function(){
    var selfClick = jQuery(this).find('ul:first').is(':visible');
    if(!selfClick) {
      jQuery(this)
        .parent()
        .find('> li ul:visible')
        .slideToggle();
    }
    jQuery(this)
      .find('ul:first')
      .stop(true, true)
      .slideToggle();
  });
  //this section make the nereast ul section to the link show
  var url = window.location.toString() // this will return http://mydomain.com/pagename.html?query=xxxxxx

  // this bit adds a class to the active section for CSS 
  jQuery('ul#vertnav > li a').each(function(){
      var myHref= jQuery(this).attr('href');
      if( url.match( myHref)) {
           jQuery(this).addClass('activeClassNameForCSSHighlight')
            jQuery(this).closest('ul').show();
      }
});
});

谢谢你的帮助。

替换

jQuery('ul#vertnav > li > ul')

通过

jQuery('ul#vertnav').find('li > ul')

在哪里发生。

它应该起作用。检查这个小提琴

编辑:在我的小提琴中,我确实修改了一些在单击"其他"菜单时隐藏菜单的逻辑,并使用了更多的变量而不是选择器(出于性能原因)。

最新更新