이미지 위에 음직이는 글 만들기

▣ 이미지 위에 움직이는 글 만들기

 

사진등 이미지위에 자연스레 글이 움직이는거 많이 보셨죠?..

늑대방 컴터에 쉽게 만들 수 있는 자료가 있는데..그게 이해가 잘 안된다는 분들이 계십니다.

해서..어떻게하면 쉽게 만들게 할 수 있을까...고민을 좀 했는데...생각만큼 쉽게는 힘드네요..

일단 지금 이 방법이 그나마 쉬울거라 생각합니다...

몇 번 생각없이 따라해보세요...아마도 이해가 되실 듯..ㅎㅎ

 

우리는 오늘 이렇게 만드는 방법을 해볼건데요..

음악등은 넣으실줄 아실테니.....이게 숙지가 되걸랑 음악을 넣어서 잘 꾸며보세요....

우산이 되어 / 이해인 우산도 받지 않은 쓸쓸한 사랑이 문 밖에 울고 있다 누구의 설움이 비 되어 오나 피해도 젖어오는 무수한 빗방울 땅 위에 떨어지는 구름의 선물로 죄를 씻고 싶은 비오는 날은 젖은 사랑 수많은 나의 너와 젖은 손 악수하며 이 세상 큰 거리를 한없이 쏘다니리 우산을 펴주고 싶어 누구에게나 우산이 되리 모두를 위해

자..그럼 시작합니당~~

일단 이미지를 준비해야 됩니다...

이미지가 웹에 있어야 하므로 집컴에 있다면 자신의 블록에 올려서 주소를 메모장등에

복사해 두세요..

아래 [1]~[3]번을 모두 복사해서 메모장등에 복사해 두세요..

ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

[1] 이미지깔린 표 소스
    테이블 크기를 가로 550 세로 413으로 구성했어요...
    이미지도 테이블 크기와 같거나 좀 큰 사진으로 넣어야 보기가 좋습니다..
    아래 background="http://~" (주소에 미리 복사해둔 이미지 주소를 넣어주세요..)

<table cellpadding="0" cellspacing="0" width="550" height="413"
background="http://kr.img.blog.yahoo.com/ybi/1/b0/1b/redwolfda/folder/283/img_283_11778_0?1191244886.jpg">

<tr><td width="825">

<table align="center" border="1" width="405">

<tr><td width="395"><p> </p>

</td></tr></table></td></tr></table>

 

[2] 움직이는 글 시작 (마퀴 태그)

<marquee direction=up scrollamount=1 scrolldelay=100 loop=infinite>

[3] 움직이는 글 종료

</marquee>

ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 

기본 준비를 마쳤으니..블록에서 글쓰기를 해보죠..

[1] 편집기모드에서 HTML 소스 삽입을 누르세요.

 

[2] 미리 메모장에 복사해둔 이 부분을 복사해서 붙혀넣기를 하세요.

 <table cellpadding="0" cellspacing="0" width="550" height="413"
background="http://kr.img.blog.yahoo.com/ybi/1/b0/1b/redwolfda/folder/283/img_283_11778_0?1191244886.jpg">

<tr><td width="825">

<table align="center" border="1" width="405">

<tr><td width="395"><p> </p>

</td></tr></table></td></tr></table>

 

[3] 적용하고 나오면 이런 테이블이 만들어집니다.

 

[4] 이제 가운데 표 내부에 원하는 글을 쓰면 되겠어요.

 

[5] 글을 다 썼으면 HTML 소스 편집을 누르세요.

★ 참고.....
   HTML 소스 편집에선 마우스 오른쪽이 먹히지 않습니다..
   Ctrl + C=복사 / Ctrl + V=붙혀넣기....이 두가지 단축키는 기억하고 들어갑시당~

 

[6] 밑으로 쭉 내려와서 글이 시작되는 바로 윗 부분에 메모장에 미리 복사해둔
    <marquee direction=up scrollamount=1 scrolldelay=100 loop=infinite> 이걸 붙혀 넣으세요.

 

[7] 다시 맨 아래쪽으로 내려와서 글이 끝나는 마지막에 복사해둔 </marquee> 이걸 붙혀 넣어요.
      적용을 눌러서 마무리를 하시고 글쓰기를 끝내면 이렇게 나옵니다.

우산이 되어 / 이해인 우산도 받지 않은 쓸쓸한 사랑이 문 밖에 울고 있다 누구의 설움이 비 되어 오나 피해도 젖어오는 무수한 빗방울 땅 위에 떨어지는 구름의 선물로 죄를 씻고 싶은 비오는 날은 젖은 사랑 수많은 나의 너와 젖은 손 악수하며 이 세상 큰 거리를 한없이 쏘다니리 우산을 펴주고 싶어 누구에게나 우산이 되리 모두를 위해

가운데 표에 테두리를 없애는게 좋겠죠..

표 위에서 마우스오른쪽 클릭-표 등록 정보 선택

 

Border(두께)를 "0"으로 적용하고 확인을 누르세요..

 

내용이 긴 듯 보여서 복잡하게 생각할 수 있겠어요..
헌데 전혀 복잡하지 않습니다..
제가 설명을 세부적으로 했기에 그렇습니다...
한 두 번 따라해보면 쉽게 이해됩니다...