hover 시 img 여러개에 애니메이션을 주고싶습니다.

Chiry 6년 전 조회 3,497

여러장의 image를 img 태그를 통해 12345 순으로 겹춰두고, 그 아래에 div > p태그를 통해 5연의 시를 각 연마다 ABCDE 클래스를 부여하여 웹을 구성하였습니다. A,B,D 클래스의 텍스트 위에 오버 시, img 태그의 이미지 135를 움직이고 싶은데 어떤식으로 해야될까요?

현재 body의 상태입니다

</p>

<p><body>

        <img id="background" src="image/Background.png">

        <img class="wave1 U" src=image/wave_1.png>  

        <img class="waves2 D" src=image/wave_2.png>

        <img id="stone" src="image/stone.png">

        <img class="wave3 U" src=image/wave_3.png>

        <img class="waves4 D" src=image/wave_4.png>

        <img class="wave5 U" src=image/wave_5.png>

        <div id="poetry">

            <h1><div id="title">그리움</div></h1>

            <h3><div id="name">청마 유치환</div></h3>

            <div class="content">

                    <p class="A">파도야 어쩌란 말이냐</p>

                    <p class="B">파도야 어쩌란 말이냐</p>

                    <p class="C">임은 뭍같이 까딱 않는데</p>

                    <p class="D">파도야 어쩌란 말이냐</p>

                    <p class="E">날 어쩌란 말이냐</p>

             </div>

        </div>

</body></p>

<p>

#css #html5 #hover

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

정렬:

세크티

6년 전

 
    
    
    
    
        그리움
        청마 유치환
        
            파도야" target="_blank" rel="noopener noreferrer">https://cdn.pixabay.com/photo/2016/11/29/04/19/beach-1867285_960_720.jpg">파도야 어쩌란 말이냐
            파도야" target="_blank" rel="noopener noreferrer">https://cdn.pixabay.com/photo/2015/09/09/16/40/ocean-931776_960_720.jpg">파도야 어쩌란 말이냐
            임은" target="_blank" rel="noopener noreferrer">https://cdn.pixabay.com/photo/2017/01/17/03/58/barefoot-1985858_960_720.jpg">임은 뭍같이 까딱 않는데
            파도야" target="_blank" rel="noopener noreferrer">https://cdn.pixabay.com/photo/2017/04/06/17/43/water-2208931_960_720.jpg">파도야 어쩌란 말이냐
            날" target="_blank" rel="noopener noreferrer">https://cdn.pixabay.com/photo/2017/07/31/21/45/sea-2561397_960_720.jpg">날 어쩌란 말이냐

img태그를 하나로 두고 src를 바꾸는건 어떠신가요?

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인

hover 시 img 여러개에 애니메이션을 주고싶습니다.

답변 1개

그리움

청마 유치환

공유하기