次のコードを使用しています。
$(document).ready(function() {
$('.some_class').slideDown(1000);
});
上記のコードは機能しますが、slideDown は荒くてギザギザです。滑らかではありません。数ミリ秒間止まっていることがわかります。
スライドダウン効果を簡単にするにはどうすればよいですか?
ページ全体の背景画像があります。私はFirefoxとChromeでテストしています。
背景画像は、本体の div の一部として読み込まれます。div は body タグの後の最初のものです。
<div style="background-image:url('images/background.jpg');z-index:-2;position:fixed;height:100%;width:100%;display:none;" class="bg_load" id="bg"></div>
.bg_load:before {
bottom: 0;
content: "";
left: 0;
opacity: 0.6;
position: fixed;
right: 0;
top: 0;
}
.bg_load:after {
border-radius: 50% 50% 50% 50%;
box-shadow: 0 0 300px 300px rgba(0, 0, 0, 0.2);
content: "";
height: 2px;
left: 50%;
margin: 200px 0 0 -1px;
opacity: 1;
position: fixed;
top: 25%;
transition: opacity 0.15s linear 0s;
width: 2px;
}
.bg_load {
background-position: 50% 50%;
background-size: cover;
bottom: 0;
left: 0;
position: fixed;
right: 0;
top: 0;
z-index: 100;
}