は、私は私に、視差効果を追加したいの英雄フルスクリーンのBG断面画像はhttp://pixelcog.github.io/parallax.js/視差セクションにスクロール
どのよう史上だけで
<div id="hero-unit" class="parallax-window" data-parallax="scroll">
<div id="hero-unit-content">
<h1 class="hero-title">Welcome</h1>
<p class="hero-subtitle">Click Here Close</p>
<p><a class="button subdued-button alt-button" role="button" href="#">Learn more</a></p>
</div>
</div>
#hero-unit {
width: 100%;
height: 100%;
background: url(../images/backgrounds/bg.jpg) no-repeat top center;
background-color: #000;
background-size: cover;
background-attachment: fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
}
#hero-unit-content {
position: absolute;
width: 100%;
bottom: 15%;
}
#hero-unit-content h1, #hero-unit-content p {
text-align:center;
text-transform: uppercase;
}
.hero-title {
text-shadow:0 2px 2px rgba(0,0,0,0.5);
color:#bebebe;
font-weight:300;
font-size: 60px;
font-family: 'Oswald', sans-serif;
}
.hero-subtitle {
max-width:600px;
margin:25px auto;
padding:10px 15px;
background-image: url(../images/opacity-overlay.png);
color:#5d6264;
font-weight:500;
font-size: 20px;
font-family: 'Roboto', sans-serif;
letter-spacing: 0.1em;
}
...本当のスクロールの動きを固定しないままに、この例を発見しました
Kiran Khatri私はそれが働くようになったが、私のヒーローbgはもはや100の高さではない – Amoro