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