我正在编写一个设计,当您单击左侧菜单中的一个选项(#menu1contact)时,蒙版的右侧(#face2)从左向右滑动并再次向后滑动,从而显示内部内容(#content) .
这是我的代码:
$('#menu1contact').on('click', function(){
$('#face2').animate({
'marginLeft': '+=750px'
},2500)
$('#content').animate({
'width': '+=750px'
},2500)
$('#content').css('border-left' , 'solid #5d3f35')
});
但是,当您再次单击#menu1contact 时,如何使其滑回原来的位置?
以下代码不起作用:
$('#menu1contact').toggle(function(){
$('#face2').animate({
'marginLeft': '+=750px'
},2500)
$('#content').animate({
'width': '+=750px'
},2500)
$('#content').css('border-left' , 'solid #5d3f35')},
function(){
$('#face2').animate({
'marginLeft': '-=750px'
},2500)
$('#content').animate({
'width': '-=750px'
},2500)
$('#content').css('border-left' , 'solid #5d3f35')
});