自丢网

标题: jQuery手风琴式左侧栏导航菜单代码 [打印本页]

---

作者: ajian    时间: 2021-2-24 10:51
标题: jQuery手风琴式左侧栏导航菜单代码
(, 下载次数: 166)

上传

点击文件名下载附件


一个非常不错的jQuery手风琴式左侧栏导航菜单代码，网站左侧滑动切换收缩展开菜单代码，鼠标悬停链接背景渐显效果。

1. js代码
   
2. 
   
3. $(function() {
   
4.         var Accordion = function(el, multiple) {
   
5.                 this.el = el || {};
   
6.                 this.multiple = multiple || false;
   
7. 
   
8.                 // Variables privadas
   
9.                 var links = this.el.find('.link');
   
10.                 // Evento
    
11.                 links.on('click', {el: this.el, multiple: this.multiple}, this.dropdown)
    
12.         };
    
13. 
    
14.         Accordion.prototype.dropdown = function(e) {
    
15.                 var $el = e.data.el;
    
16.                         $this = $(this);
    
17.                         $next = $this.next();
    
18. 
    
19.                 $next.slideToggle();
    
20.                 $this.parent().toggleClass('open');
    
21. 
    
22.                 if (!e.data.multiple) {
    
23.                         $el.find('.submenu').not($next).slideUp().parent().removeClass('open');
    
24.                 }
    
25.         };
    
26. 
    
27.         var accordion = new Accordion($('#accordion'), false);
    
28.         $('.submenu li').click(function () {
    
29.                 $(this).addClass('current').siblings('li').removeClass('current');
    
30.         });
    
31. });

复制代码

(, 下载次数: 456)

上传

点击文件名下载附件

---

欢迎光临 自丢网 (https://www.zidiu.com/)

Powered by Discuz! X3.5