我无法让我的 jQuery 识别 if 语句。请参阅 CodePen
我的站点中有 4 个页面转换。向右翻页、向左翻页、向上翻页和向下翻页。联系页面位于主要英雄部分下方的视线之外。向上和向下过渡将接触部分向上和向下滑动到 View 中。问题是，如果用户打开联系页面并单击页面右侧或左侧，我希望联系页面向下滑动到看不见的地方。我添加了一个 if 语句来查询联系人 div 的 marginTop 值，但它没有响应。
可以在上面的 CodePen 链接中查看以下内容。
$(document).ready(function() {
// if statement that is not working but not sure why???
if ($('.contact-wrapper').css("marginTop") == '-10%') {
$('#down').trigger('click');
}
// --------------------------------------------
$('#pg-right').click(function() {
$('.home-wrapper, .about-wrapper').animate({
marginLeft: '-=100%'
}, 500);
});
$('#pg-left').click(function() {
$('.home-wrapper, .about-wrapper').animate({
marginLeft: '+=100%'
}, 500);
});
$('#up').click(function() {
$('.contact-wrapper').animate({
marginTop: '-=10%'
}, 500);
});
$('#down').click(function() {
$('.contact-wrapper').animate({
marginTop: '+=10%'
}, 500);
});
}) .home-wrapper {
position: fixed;
background: blue;
height: 90vh;
left: 0;
width: 100%;
}
.about-wrapper {
position: fixed;
background: green;
height: 90vh;
width: 100%;
left: 100%;
}
.contact-wrapper {
position: fixed;
background: black;
height: 80vh;
width: 100%;
left: 0;
top: 90%;
}
#pg-right,
#pg-left,
#up,
#down {
position: fixed;
font-size: 3em;
color: white;
}
#pg-right {
top: 10%;
left: 80%;
}
#pg-left {
top: 10%;
left: 20%;
}
#up {
top: 50%;
left: 60%;
}
#down {
top: 50%;
left: 40%;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<div class="home-wrapper"></div>
<div class="about-wrapper"></div>
<div class="contact-wrapper"></div>
<a href="#" id="pg-right">Right</a>
<a href="#" id="pg-left">Left</a>
<a href="#" id="up">Up</a>
<a href="#" id="down">Down</a>最佳答案
感谢@Xufox 为我指明了正确的方向。问题是 jQuery if 语句以像素计算，而我使用的是 %。我解决这个问题的方法是将字符串转换为整数值，然后查询它是否小于零。请参阅下面的代码以及此处更新的 CodePen .
var x = $('.contact-wrapper').css("marginTop")
if( parseInt(x) < 0) {
$('#down').trigger('click');
}
关于jQuery 'if' 语句未被识别，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36974232/