웹마스터 팁
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
[HTML 초보자] 글자움직이는 마퀴태그의 응용(Last)
2002.11.26 16:20
http://www.tagmania.net안녕하세요..? ZipShin입니다. 이제 마퀴태그 마지막 편입니다.
제가 한동안 마퀴태그를 강의했는데요, 그 강좌를 응용하면 신기한 태그를 만들수 있습니다.
마퀴태그의 모든 속성을 사용해봅시다.
이번에는 마퀴태그(글자움직이는 태그)의 마지막 응용편입니다.
다음에는 다른 강좌를 기대해주세요.
응용1)
① <marquee behavior="alternate" direction="up">하핫</marquee> (상단스크롤이 위아래로 계속 반복되는 것)
② <marquee behavior="alternate" direction="up" bgcolor="#3399FF">하핫</marquee>
(배경색 속성을 첨부시켜서 해보면 스크롤 되는 영역에 배경색이 들어 가 있는 걸 볼 수 있을 것)
③ <marquee behavior="alternate" direction="up" bgcolor="#3399FF" width="200" height="300">하핫</marquee> (스크롤 영역을 가로세로 너비를 조정)
④ <marquee behavior="alternate" width="300" height="300"><marquee align="center" behavior="alternate" direction="up" width="200" height="300">하핫</marquee></marquee> (기존에 마퀴태그에 같은 마퀴를 하나 더 넣은 것)
응용2) 화살쏘기(단순 마퀴태그)
이건 응용1 보다 훨씬 쉬운건데요....효과는 더 만빵이랍니다.^^
① 우선 화살을 쏠려면 활과 화살이 있어야 겠죠 ←♡--< ☜어때요? 화살 같죠?^^
{>☜조금 어설프지만 활이라고 봐주시길...^^ 자...활과 화살을 만들었으니 이제 마퀴태그를 이용해서 쏘는 일만 남았군요^^
② <marquee>←♡--<</marquee> ☜이걸 실행시켜보면 화살이 날아가는 걸 볼 수 있습니다.^^ 그럼 여기서 조금 더 그렇듯 하게 꾸며 보면......
③ 큐피트의 화살<marquee width="300">←♡--<</marquee><font size="5">{></font> ☜ 어때요? 그렇듯 하져?^^
응용3) 반짝반짝 (좌우반복과 속도)
① <marquee behavior=alternate width=1100 scrollamount=1000> 반짝</marquee>☜ 좌우 반복과 너비조절, 이동량을 조절해서 만들어준 건데요.....scrollamount 속성을 잘 이용해서 만든 예제네요^^
응용4) 도리도리 (좌우반복과 너비)
① (<marquee behavior=alternate width=30>@^.^@</marquee>)도리 ☜ 초보분들이 지금껏 가장 많이 물어봤던 것 중 하나인데요....채티방에서 사용해보면 재미있져^^ 도리도리 흔드는 걸 봐서는 어려울 것 같지만 그 원리는 아주 단순하답니다.^^ 그냥 좌우 왕복과 그에 맞게 너비조정만 해준거죠^^
응용5) 한줄 쓰기 (방향)
① <MARQUEE DIRECTION=RIGHT><MARQUEE DIRECTION=LEFT>여러분~~ 안녕하세요^^ 만나서 방갑습니다. - 태그매니아-</MARQUEE> ☜ 단순히 방향조절만 해주면 이렇게 멋진 마퀴태그 효과를 나타낼 수 있습니다. 신기하져?^^
응용 6 달팽이 (방향과 속도)
② <marquee direction="RIGHT" scrollamount="1"> __@/``</marquee> ☜ 달팽이 입니다...--;;;
대충 응용하는 거에 대해서 배워봤는데요....마퀴태그는 여러분들이 어떻게 응용하느냐에 따라서 무한한 효과를 나타낼 수 있습니다.^^ 심심할 때 한번씩 만들어 보세요^^ 그럼 여기서 마퀴태그에 대한 강의를 완죤히 마치겠습니다. 그럼 이만....^^
p.s : 당신은 안전하십니까? 누군가 당신을.......저희가 지켜드립니다....^^ 푸하핫~!!!^^ ☜ 뭘까요?^^
<marquee behavior=alternate width=1100 scrollamount=1000><h1>★</font><br>
<marquee bgcolor=pink>모두즐팅하소^^*</marquee><marquee bgcolor=cred>왜그라요.</marquee>
<marquee direction=up behavior=alternate height=40>^^"아니라니까</marquee>올라내라
<marquee direction='down'><marquee><h1>하핫~</h1></marquee></marquee>
<marquee width=400>토커<marquee width=300>←♡-<</marquee></marquee><font size=6>{>
<marquee width=500 scrollamount=300><font size=7>정신없당~</marquee>
<marquee font behavior=alternate scrollamount=100><h1>★★★tester☆☆☆☆☆</marquee>
<MARQUEE bgcolor=white direction=up> 사랑이란.... <P><P> 끝없는<P><P> 기다림의 연속이다....<P><P></MARQUEE>
<MARQUEE direction=right>ⓘ ⓛⓞⓥⓔ</MARQUEE>♡<MARQUEE direction=reft>ⓨⓞⓤ</MARQUEE>
이 강좌의 응용1~5까지 태그매니아 홈페이지의 HTML강좌를 가져왔습니다.
개인적으로 시간이 없는 관계상 그리고 또한 신뢰성이 떨어지는 일이지만, 열심히 해야겠죠.^^ 만약 문제가 된다면, 강좌내용 수정하겠습니다.
제가 한동안 마퀴태그를 강의했는데요, 그 강좌를 응용하면 신기한 태그를 만들수 있습니다.
마퀴태그의 모든 속성을 사용해봅시다.
이번에는 마퀴태그(글자움직이는 태그)의 마지막 응용편입니다.
다음에는 다른 강좌를 기대해주세요.
응용1)
① <marquee behavior="alternate" direction="up">하핫</marquee> (상단스크롤이 위아래로 계속 반복되는 것)
② <marquee behavior="alternate" direction="up" bgcolor="#3399FF">하핫</marquee>
(배경색 속성을 첨부시켜서 해보면 스크롤 되는 영역에 배경색이 들어 가 있는 걸 볼 수 있을 것)
③ <marquee behavior="alternate" direction="up" bgcolor="#3399FF" width="200" height="300">하핫</marquee> (스크롤 영역을 가로세로 너비를 조정)
④ <marquee behavior="alternate" width="300" height="300"><marquee align="center" behavior="alternate" direction="up" width="200" height="300">하핫</marquee></marquee> (기존에 마퀴태그에 같은 마퀴를 하나 더 넣은 것)
응용2) 화살쏘기(단순 마퀴태그)
이건 응용1 보다 훨씬 쉬운건데요....효과는 더 만빵이랍니다.^^
① 우선 화살을 쏠려면 활과 화살이 있어야 겠죠 ←♡--< ☜어때요? 화살 같죠?^^
{>☜조금 어설프지만 활이라고 봐주시길...^^ 자...활과 화살을 만들었으니 이제 마퀴태그를 이용해서 쏘는 일만 남았군요^^
② <marquee>←♡--<</marquee> ☜이걸 실행시켜보면 화살이 날아가는 걸 볼 수 있습니다.^^ 그럼 여기서 조금 더 그렇듯 하게 꾸며 보면......
③ 큐피트의 화살<marquee width="300">←♡--<</marquee><font size="5">{></font> ☜ 어때요? 그렇듯 하져?^^
응용3) 반짝반짝 (좌우반복과 속도)
① <marquee behavior=alternate width=1100 scrollamount=1000> 반짝</marquee>☜ 좌우 반복과 너비조절, 이동량을 조절해서 만들어준 건데요.....scrollamount 속성을 잘 이용해서 만든 예제네요^^
응용4) 도리도리 (좌우반복과 너비)
① (<marquee behavior=alternate width=30>@^.^@</marquee>)도리 ☜ 초보분들이 지금껏 가장 많이 물어봤던 것 중 하나인데요....채티방에서 사용해보면 재미있져^^ 도리도리 흔드는 걸 봐서는 어려울 것 같지만 그 원리는 아주 단순하답니다.^^ 그냥 좌우 왕복과 그에 맞게 너비조정만 해준거죠^^
응용5) 한줄 쓰기 (방향)
① <MARQUEE DIRECTION=RIGHT><MARQUEE DIRECTION=LEFT>여러분~~ 안녕하세요^^ 만나서 방갑습니다. - 태그매니아-</MARQUEE> ☜ 단순히 방향조절만 해주면 이렇게 멋진 마퀴태그 효과를 나타낼 수 있습니다. 신기하져?^^
응용 6 달팽이 (방향과 속도)
② <marquee direction="RIGHT" scrollamount="1"> __@/``</marquee> ☜ 달팽이 입니다...--;;;
대충 응용하는 거에 대해서 배워봤는데요....마퀴태그는 여러분들이 어떻게 응용하느냐에 따라서 무한한 효과를 나타낼 수 있습니다.^^ 심심할 때 한번씩 만들어 보세요^^ 그럼 여기서 마퀴태그에 대한 강의를 완죤히 마치겠습니다. 그럼 이만....^^
p.s : 당신은 안전하십니까? 누군가 당신을.......저희가 지켜드립니다....^^ 푸하핫~!!!^^ ☜ 뭘까요?^^
<marquee behavior=alternate width=1100 scrollamount=1000><h1>★</font><br>
<marquee bgcolor=pink>모두즐팅하소^^*</marquee><marquee bgcolor=cred>왜그라요.</marquee>
<marquee direction=up behavior=alternate height=40>^^"아니라니까</marquee>올라내라
<marquee direction='down'><marquee><h1>하핫~</h1></marquee></marquee>
<marquee width=400>토커<marquee width=300>←♡-<</marquee></marquee><font size=6>{>
<marquee width=500 scrollamount=300><font size=7>정신없당~</marquee>
<marquee font behavior=alternate scrollamount=100><h1>★★★tester☆☆☆☆☆</marquee>
<MARQUEE bgcolor=white direction=up> 사랑이란.... <P><P> 끝없는<P><P> 기다림의 연속이다....<P><P></MARQUEE>
<MARQUEE direction=right>ⓘ ⓛⓞⓥⓔ</MARQUEE>♡<MARQUEE direction=reft>ⓨⓞⓤ</MARQUEE>
이 강좌의 응용1~5까지 태그매니아 홈페이지의 HTML강좌를 가져왔습니다.
개인적으로 시간이 없는 관계상 그리고 또한 신뢰성이 떨어지는 일이지만, 열심히 해야겠죠.^^ 만약 문제가 된다면, 강좌내용 수정하겠습니다.