2016-08-24 87 views
0

我在我的頁面左側有手風琴菜單。今天,我注意到訪問量急劇下降,試圖找到問題,我發現我的菜單3周前停止工作。它用於當我點擊箭頭時下拉,當我點擊具有子菜單的菜單時,它仍然打開,並在父菜單處突出顯示。現在,當我點擊產品時,我的菜單不再崩潰。試圖改變類和鏈接到最新版本的jQuery,但沒有奏效。 請幫助我,或者是什麼導致它突然停止工作?下拉菜單停止工作

My site with not working menu

的Javascript

<script src="http://code.jquery.com/jquery-3.1.0.min.js" type="text/javascript"> 
(function($) { 
$(document).ready(function() { 
    $('#left li.menu-item-has-children').prepend('<span class="holder"></span>'); 
    $('#left li.menu-item-has-children > .holder').on('click', this, function(){ 
     var element = $(this).parent('li'); 
     if (element.hasClass('open')) { 
      element.removeClass('open'); 
      element.find('li').removeClass('open'); 
      element.find('ul').slideUp(); 
     } 
     else { 
      element.addClass('open'); 
      element.children('ul').slideDown(); 
      element.siblings('li').children('ul').slideUp(); 
      element.siblings('li').removeClass('open'); 
      element.siblings('li').find('li').removeClass('open'); 
      element.siblings('li').find('ul').slideUp(); 
     } 
    }); 
$('#left li.current-menu-item').addClass('open').children('ul').slideDown(); 
    }); 
})(jQuery); 
</script> 

CSS

.uslugi >a{ 
    color: #F00 !important; 
    font-size:16px !important; 
    border-bottom: 1px solid rgba(0, 0, 0, 0.04); 
} 
#left, 
#left ul, 
#left ul li, 
#left ul li a { 
    padding: 0; 
    list-style: none; 
    line-height: 1.5; 
    display: block; 
    position: relative; 
    cursor: pointer; 
    text-decoration: none; 
    color: #515151; 
    margin:0; 
    font-family: "Trebuchet MS", Helvetica, sans-serif; 
    font-size: 16px; 
} 
#left ul li a:hover{ 
color: #000; 
background-color: rgba(47, 139, 182, 0.1); 
} 
.widget.widget_nav_menu li:before{ 
    display: none; 
} 

#main-wrapper .widget li:hover{ 
    background:none; 
} 
#left ul ul { 
    display: none; 
    margin: 0 10px; 
} 
#left ul ul li a { 
    cursor: pointer; 
padding: 0 5px; 
z-index: 1; 
color: #344E83; 
background: -moz-linear-gradient(right, rgba(255,255,255,1) 0%, rgba(255,255,255,0.91) 98%, rgba(184,238,255,0.81) 100%); 
background: -webkit-gradient(right top, left top, color-stop(0%, rgba(255,255,255,1)), color-stop(98%, rgba(255,255,255,0.91)), color-stop(100%, rgba(184,238,255,0.81))); 
background: -webkit-linear-gradient(right, rgba(255,255,255,1) 0%, rgba(255,255,255,0.91) 98%, rgba(184,238,255,0.81) 100%); 
background: -o-linear-gradient(right, rgba(255,255,255,1) 0%, rgba(255,255,255,0.91) 98%, rgba(184,238,255,0.81) 100%); 
background: -ms-linear-gradient(right, rgba(255,255,255,1) 0%, rgba(255,255,255,0.91) 98%, rgba(184,238,255,0.81) 100%); 
background: linear-gradient(to left, rgba(255,255,255,1) 0%, rgba(255,255,255,0.91) 98%, rgba(184,238,255,0.81) 100%); 
} 
#left .menu-item-has-children > a:after { 
    content: ""; 
border-right: 10px solid transparent; 
border-left: 10px solid transparent; 
margin: 10px 13px 0 0; 
border-top: 6px solid #5F5F5F; 
position: absolute; 
right: 0; 
top: 0; 
    } 
.holder{ 
border: 1px solid rgba(0, 0, 0, 0.14); 
padding: 11px 26px; 
z-index: 8; 
position: absolute; 
margin: 1px -3px 0 0; 
right: 0; 
background: none; 
    } 
.holder:hover { 
    background: rgba(47, 139, 182, 0.1); 
} 
#left ul li.open > a, 
#left ul li.active > a, 
#left ul ul li:hover > a, 
#left ul ul li.open > a, 
#left ul ul li.active > a, 
.current-page-ancestor a { 
color: #4686E6; 
background-color: rgba(47, 139, 182, 0.2); 
} 
#left ul ul li:first-child > a { 
    box-shadow: none; 
} 

#left ul ul ul li a { 
    padding-left: 30px; 
} 
@media (min-width:768px) and (max-width:979px){ 
     .span3{ 
     width:186px; 
     margin-left:0; 
    } 
} 
+0

你能否提供html?你的意思是左邊的菜單,是嗎? –

+0

是的,它在左邊。 – KwS

回答

2

你的腳本是不是因爲工作,HTML標記問題(script標籤),檢查它與螢火蟲>腳本>在第444行附近內聯:

<script src="http://code.jquery.com/jquery-3.1.0.min.js" type="text/javascript">(function($) { $(document).ready(function() {

你應該關閉腳本標籤,然後打開一個新問題:

<script src="http://code.jquery.com/jquery-3.1.0.min.js" type="text/javascript"</script><script>(function($) { $(document).ready(function() { .... </script>

+0

感謝您的關注,我已經將它從單獨的塊更改爲像您指出的那樣,但忘記再次更改它。現在,我確實喜歡你說的,但它仍然不起作用。當我點擊頁面中心的產品時,它只會突出顯示父菜單,但不像以前那樣摺疊。 – KwS

+0

嘗試將

0

看來你的選擇沒有任何比賽:

#left li.menu-item-has-children > .holder 

我沒有看到您的持有人類內l i.menu-item-has-children定義。它看起來像你應該添加一個持有人類到您的<a>元素。

請讓我知道它是否有幫助。

+0

添加靜態將無法正常工作,問題是腳本不工作期間 – yezzz

+0

您可以嘗試禁用autoptimize插件並查看是否有幫助。如果$(document).ready(function(){...}) 被稱爲 – Vahan