我昨天发布了同样的问题,但意识到我的问题太模糊了?
基本上这就是我希望我的代码工作的方式 - 我想要一个全屏div滚动/当我点击' down'我希望它向下滚动到我的下一个全屏div
我的代码有效 - 但它没有滚动'下 ?而且我不确定原因。
有人可以帮忙吗?
我正在使用的jquery代码是
<script type="text/javascript">
$(document).ready(function() {
$('.tile a').click(function(event) {
var id = $(this).attr("href");
$('html, body').animate({scrollTop:target}, 10000);
event.preventDefault();
});
});
</script>
css代码
body,html {
text-align: center;
width: 100%;
height: 100%;
}
.tile {
height: 100%;
width: 100%;
position: relative;
background-color: #eaeaea;
}
.tile div {
padding-top: 70px;
}
#up {
background-color: #222;
}
和我的.erb代码
<%## scroll up page ##%>
<div class='tile' id='up'>
<%## search bar ##%>
<div class="row">
<div class="col-lg-3">
</div>
<div class="col-lg-6">
<div class="input-group">
<input type="text" class="form-control" placeholder="Search for...">
<span class="input-group-btn">
<button class="btn btn-default" type="button">Go!</button>
</span>
</div><!-- /input-group -->
</div><!-- /.col-lg-6 -->
</div><!-- /.row -->
<div class=but_down style="width:100px; height:100px; background-color:red;">
<a href="#down"> down </a>
</div>
</div>
<%## scroll down page ##%>
<div class='tile' id='down'>
<h1> yeah </h1>
</div>
我已经知道了 http://alvarotrigo.com/blog/fullpage-jquery-plugin-for-fullscreen-scrolling-websites/
但我真的,真的是编程的新手,不知道如何翻译它 ruby rails的代码。
有人可以帮忙吗?