2013-05-14 2 views
0

빠른 질문 하나는 이미지가 각각의 상단에 미끄러지는이 효과를 만드는 방법에 대해 어떤 생각을하는지 알 수 있습니다. havent을 시작하기위한 몇 가지 포인터가 필요합니다. 이미지 슬라이더 효과! 서로의 상단에 스크롤

http://denicler.eu/en/lookbooks/1

이 abosolute 및 z 인덱스를받은 위치하여 내 이미지를 쌓아 manged했던 ... 시작하지만 캔트를 통해 서로 .. 스크롤 내 이미지를 얻을 것은 : 어떤 제안들이

#lookbook img{ 
width: 100%; 
position: absolute; 
top: 0px; 
} 

img#image1 { 

z-index: 100; 
} 

    img#image2 { 

top: 0px; 
z-index: 20; 
    } 
    img#image3 { 

z-index: 30; 
    } 
    img#image4 { 

z-index: 40; 
} 
    img#image5 { 

z-index: 50; 
} 
img#image6 { 

z-index: 60; 
} 
img#image7 { 

z-index: 70; 
    } 
    img#image8 { 

z-index: 80; 
    } 
    img#image9 { 

z-index: 90; 
    } 

DEFO 일부 필요이야 여기에 JavaScript가 도달하면 이미지를 수정합니다.

이를 얻기 위해 manged했던 어떤 도움들 맨 위로하지만 당신은 (수직 또는 수평) 이미지를 슬라이드하는 방법에 따라 롤 도움을

$(document).ready(function() { 
    $(window).scroll(function() { 
     if ($(window).scrollTop() > $('#lookbook img').offset().top) 
     $('#lookbook img').addClass('fixed'); 
     else 
     $('#lookbook img').removeClass('fixed'); 
     }); 

    }); 
+0

z- 인덱스로 재생. – melancia

+0

처음부터 시작하십시오. [여기] (http://teamtreehouse.com/), [여기] (http://www.codecademy.com/#!/exercises/0) 및 [여기] (https : //developer.mozilla. org/ko-US/docs/Web/HTML). –

+0

아마도이 답변으로 시작할 수 있습니다. http://stackoverflow.com/questions/6488390/can-you-layer-pictures-on-top-of-each-other-on-a-webpage – Yeronimo

답변

0

을 하나를 작업을 나던 것, 당신은보고 시작할 수 있습니다 thisthis. 두 링크는 ​​이미지 이동에 도움이됩니다. 그런 다음 z- 인덱스로 재생하여 무엇을 넘나 드는 지 지정할 수 있습니다. here

+0

답장을 보내 주셔서 감사합니다. z = index와 관련이 있음을 알고 있습니다. 이미지가 상단 수정으로 스크롤 한 다음 z 인덱스를 정렬하는 경우 jquery 문이 필요하다고 생각합니다. – AC88

+0

절대 위치와 Z 인덱스를 사용하여 상단에 내 이미지를 스택하도록 배치되었지만 서로 위의 스크롤을 스크롤 할 수 없습니다. ive 내 질문 업데이트 – AC88