스크롤 할때 한장씩 뜨는 이미지. -3

우아 이거 힘드네용.ㅜㅜ
https://iflue.tistory.com/175
저는 이 사이트의 코드를 긁어와서 홈페이지에 적용해보았습니다.

 

제가 만드는 사이트.
http://ellensnap1.cafe24.com/portfolio-items/test-12341/

------------------
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script> <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script> <script> AOS.init(); </script>
<div data-aos="fade-up" data-aos-duration="1500">
<div class="example">

<img class="alignnone size-full wp-image-36" src="http://ellensnap1.cafe24.com/wp-content/uploads/2021/11/wl-op-7m.jpg" alt="" width="1634" height="913" />

</div>
</div>
<div data-aos="fade-up" data-aos-duration="1500">
<div class="example">

<img class="alignnone wp-image-35 size-full" src="http://ellensnap1.cafe24.com/wp-content/uploads/2021/11/wlop-20se.jpg" alt="" width="1920" height="996" />

</div>
</div>
<div data-aos="fade-up" data-aos-duration="1500">
<div class="example">

<img class="alignnone wp-image-33 size-full" src="http://ellensnap1.cafe24.com/wp-content/uploads/2021/11/wl-op-3s.jpg" alt="" width="1892" height="1075" />

</div>
</div>
<div data-aos="fade-up" data-aos-duration="1500">
<div class="example">

<img class="alignnone size-full wp-image-36" src="http://ellensnap1.cafe24.com/wp-content/uploads/2021/11/wl-op-7m.jpg" alt="" width="1634" height="913" />

</div>
</div>

 

------------

 

이렇게 나오면 되긴하는데. .문제는.. 클라이언트가 이걸 하나하나 올리기 힘들거 같습니다.

(지금은 사진 하나의 주소를 저 소스안에 각각 하나하나 넣어주는 방법)
 

윈도우 미디어를 선택하거나 갤러리를 만들어서.. 각각의 이미지가 자동으로 되게끔 하려면 도대체 어떻게 해야 하는건가요?

(플러그인도 좋습니다.)

--

쉽게 말해서..

 

사진 하나하나에 저 코드를 일일이 넣어주는 방법이 아닌..

한 50장 정도의 사진을 올렸을때 자동으로 각각 저런 효과가 나오게 하는게 궁극적인 목적입니다.

 

멋진 답변 부탁드립니다.

 

 

 

 

 

워드프레스 에러 기술지원 서비스 전문가에게 맡기세요
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
워드프레스 에러 기술지원 서비스 전문가에게 맡기세요