0
我試圖在我的網站中添加一個推送菜單。該菜單必須從左側滑出,並應與當前頁面重疊。我正在使用下面的代碼,但它不工作。有什麼我失蹤或做錯了嗎?CSS3和jQuery中的簡單推送菜單
CSS:
#menu {
display: none;
position: absolute;
top: 0;
left: -240px ;
position: fixed;
width: 240px;
height: 100%;
padding: 15px 25px;
margin: 0;
list-style: none;
background: #333;
z-index: 9999;
transition: all 0.3s ease;
-webkit-transition all 0.3s ease;
}
#menu a {
display: block;
color: #fff;
padding: 15px 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.animate {
transform: translateX(240px);
-webkit-transform: translateX(240px);
}
javascipt的:
$(function() {
$('#toggle-menu').click(function() {
toggleMenu();
});
})(jQuery);
function toggleMenu() {
if ($('#menu').hasClass('animate')) {
$('#menu').removeClass('animate');
}
else {
$('#menu').addClass('animate');
}
//$('#menu').toggleClass('animate');
}
HTML:
<div id="menu">
<ul>
<li><a href="#"> Home </a></li>
<li><a href="#"> Home </a></li>
<li><a href="#"> Home </a></li>
</ul>
</div>
謝謝,夥計。做得好。 :) –
你能接受我的答案,如果它解決了你的問題? – Monkviper