如何在向下滚动时将我的按钮设置为固定位置,然后在jquery中向上滚动时再次设置动画到原始位置。动画只发生一次,我希望它一直发生,但动画只做一次
$(document).ready(function(){
$(window).scroll(function() {
if ($(document).scrollTop() > 200) {
$('.back').addClass('HomeButtonFloat');
$('.back').animate({bottom:'0px'}, 800);
}
else {
$('.back').removeClass('HomeButtonFloat');
}
});
});
.back{
background-image: url('http://www.weebly.com/editor/uploads/1/1/3/4/11341626/custom_themes/466581761641871614/files/AppWidgets/Widgets/Initial2.1.jpg');
background-size: 150px 150px;
background-repeat:no-repeat;
background-position:center center;
width:180px;
height:180px;
border-radius:15px;
border:solid black 5px;
margin-bottom:10px;
margin-top:30px;
box-shadow: 0px 0px 50px 5px red;
}
.HomeButtonFloat {
background-image: url('http://www.weebly.com/editor/uploads/1/1/3/4/11341626/custom_themes/466581761641871614/files/AppWidgets/Widgets/Initial2.1.jpg');
background-size: 50px 50px;
background-repeat:no-repeat;
width:50px;
height:50px;
position:fixed;
left:10px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body style="height:1550px;">
<div class="back">
<a href="Chicago.html">
</a>
</div>
</body>