我正在尝试创建一个 slider 菜单,该菜单从底部(页脚)向上滑动到顶部,单击时返回到底部(页脚)。 我的代码与第一个 if 语句配合得很好,它没有注册 var SlideUp == true,因此,单击 slider 时 slider 不会返回。
这是我的 JS 文件:
$(document).ready(function(){
var sliderUp = false;
if (sliderUp == false) {
$("#slider").click( function(){
$(this).animate({height:'100%'},200);
sliderUp = true;
console.log('pullUp');
$('.firsts').fadeOut(100);
});
}
if (sliderUp == true) {
$("#slider").click( function(){
$(this).animate({height:'50px'},200);
sliderUp = false;
console.log(sliderUp);
console.log('pullDown');
$('.firsts').fadeIn(100);
});
}
});
这是我的 CSS:
#slider{
background: orange;
color: white;
height: 50px;
text-align: center;
position: absolute;
bottom: 0;
width: 100%;
}
最佳答案
您可以使用 .toggle 来实现您的要求,而不是使用 if 和 else 使代码变得复杂。
$('#slider').toggle(
function(){
$(this).animate({height:'100%'},200);
console.log('pullUp');
$('.firsts').fadeOut(100);
},
function(){
$(this).animate({height:'50px'},200);
console.log('pullDown');
$('.firsts').fadeIn(100);
}
);
关于javascript - 为什么变量没有注册为 true 以使第二个 if 语句起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54703966/