視差を止めてウィンドウのサイズを変更しない

Question

私はフロントエンドが初めてで、スクロールできないページを作ろうとしています。私はそれを私の背景の大きさにしたい。手のイメージをページの下部に配置すると、ウィンドウのサイズが変更されます。ウィンドウのスクロールバーは、手が動いたときにもスライドします。サイズを固定したままにするにはどうすればよいですか？

HTML -

<!-- Page Content --> 
<div class="container"> 
    <div class="row"> 
     <div class="wrapper"> 
      <ul id="scene"> 
       <li class="layer" id="bluelayer" data-depth="0.0"><img src="{% static 'images/aboutus/BlueLayer.png' %}"></li> 
       <li class="layer" id="booklayer" data-depth="0.0"><img src="{% static 'images/aboutus/Book.png' %}"></li> 
       <li class="layer" id="coffeelayer" data-depth="0.0"><img src="{% static 'images/aboutus/Coffee.png' %}"></li> 
       <li class="layer" id="handslayer" data-depth="0.6"><img src="{% static 'images/aboutus/Hands.png' %}"></li> 
       <li class="layer" id="keyboardlayer" data-depth="0.0"><img src="{% static 'images/aboutus/Keyboard.png' %}"></li> 
       <li class="layer" id="pencilonelayer" data-depth="0.0"><img src="{% static 'images/aboutus/Pencil1.png' %}"></li> 
       <li class="layer" id="penciltwolayer" data-depth="0.0"><img src="{% static 'images/aboutus/Pencil2.png' %}"></li> 
      </ul> 
     </div> 
    </div> 
</div> 

CSS -

body { 
    margin-top: 0px; 
    margin-bottom: 0px; 
    background: none; 
} 

.full { 
    background: url(../images/aboutus/Desk.jpg) no-repeat center center 
fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 

} 


#bluelayer { 
    margin-left: -9.5em; 
    margin-top: -50px; 
    width: auto; 
    position: fixed; 
    z-index: 3; 
} 

#booklayer { 
    margin-left: -5em; 
    margin-top: 350px; 
    z-index: 1; 
} 

#coffeelayer { 
    margin-top: 400px; 
    margin-left: 80em; 
    z-index: 1; 
} 

#handslayer { 
    margin-top: 400px; 
    margin-left: 25em; 
    z-index: 2; 
    position: fixed; 
} 

#keyboardlayer { 
    margin-top: 400px; 
    margin-left: 25em; 
    z-index: 1; 
} 

#pencilonelayer { 
    margin-top: 550px; 
    z-index: 1; 
} 

#penciltwolayer { 
    margin-top: 450px; 
    margin-left: 70em; 
    z-index: 1; 
} 

Answer 1

開始するために容器上にoverflow: hidden;をしようとしないのはなぜ。私はあなたがここで働いているものを100％明確にしているわけではありません。