複数のブートストラップカラムを持つページがありますが、最初の6つを表示することですはページロード時に1つずつ表示されるdiv
です私はJsFiddlejQuery/CSSを使用してページをロードするときにdivを1つずつ表示する
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style type="text/css">
body {
overflow: hidden;
}
.main-wrapper {
float: left;
width: 100%;
background: #cccccc;
}
.row {
border-bottom: 1px solid #444;
}
.col-md-3 {
border: 1px solid #444;
}
.overflowH {
overflow: hidden;
}
</style>
<script type='text/javascript'>
window.onload=function(){
function setHeight() {
windowHeight = $(window).innerHeight();
$('.fullH').css('height', windowHeight);
};
setHeight();
$(window).resize(function() {
setHeight();
});
$('.col-md-3').height(Math.round($('.col-md-3').width()) * Math.tan(0.523599));
$('.row').css('transform', 'skewY(-20deg)');
}
</script>
<div class="main-wrapper">
<div class="container-fluid">
<div class="row fullH overflowH">
<div class="col-md-3">
<div class="inner">Text Here</div>
</div>
<div class="col-md-3">
<div class="inner">Text Here</div>
</div>
<div class="col-md-3">
<div class="inner">Text Here</div>
</div>
<div class="col-md-3">
<div class="inner">Text Here</div>
</div>
<div class="col-md-3">
<div class="inner">Text Here</div>
</div>
<div class="col-md-3">
<div class="inner">Text Here</div>
</div>
<div class="col-md-3">Text Here</div>
<div class="col-md-3">Text Here</div>
<div class="col-md-3">Text Here</div>
<div class="col-md-3">Text Here</div>
<div class="col-md-3">Text Here</div>
<div class="col-md-3">Text Here</div>
<div class="col-md-3">Text Here</div>
<div class="col-md-3">Text Here</div>
<div class="col-md-3">Text Here</div>
<div class="col-md-3">Text Here</div>
<div class="col-md-3">Text Here</div>
<div class="col-md-3">Text Here</div>
<div class="col-md-3">Text Here</div>
<div class="col-md-3">Text Here</div>
</div>
</div>
</div>
"一つずつ"。それらの間に遅延が欲しいということを意味しますか?もしそうなら、どのくらいの遅延? – ADyson
はい、表示されるまでに遅延があり、遅延は0.3秒か何かになるでしょう –