MARQUEE 태그 > 기술자료 | 해피정닷컴

MARQUEE 태그 > 기술자료

본문 바로가기

사이트 내 전체검색

MARQUEE 태그 > 기술자료

HTML MARQUEE 태그

페이지 정보


본문

▣ 정의
텍스트가 어떤 방향으로 흘러가는 것을 표현합니다.

▣ 예제
<marquee align="left">표현하고자 하는 글자를 입력합니다.</marquee>

▣ 속성
• align="값" (값 = left / right / center / justify)
    : 흘러 가는 텍스트 영역 밖에 있는 본문의 정렬 상태를 설정합니다.
• behavior="값" (값 = scroll / slide / alternate)
    : 흘러가는 텍스트의 형식을 지정하며, scroll은 텍스트가 흘러가다 사라지고, slide는 흘러가다 마지막에 멈추며, alternate는 양쪽 방향으로 왕복합니다.
• bgcolor="색이름 / SRRGB"
    : 흘러가는 텍스트의 배경색을 지정 합니다.
• datasrc="소스 파일 이름"
    : 홈페이지에 연결될 표 데이터의 위치를 설정.
• datafild="열이름"
    : datasrc에서 지정한 데이터 소스의 표에서 열을 선택
• dataformatas="mime 형식"
    : datasrc에서 지정한 데이터 소스의 표 데이터에서 항목 지정 방식을 선택.html, text, none의 세가지가 있습니다.
• direction="값" (값 = left / right / up)
    : 텍스트의 흘러가는 방향을 지정합니다.
• height="픽셀(높이)"
    : 흘러가는 텍스트의 높이를 지정합니다.
• hspace="픽셀(좌우 여백)"
    : 흘러가는 텍스트의 좌우 여백을 지정합니다.
• id="id 이름"
    : class와 동일한 기능. 다만 id는 한 번만 사용할 수 있습니다.
• style="스타일 시트 입력"
    : 적용될 스타일 시트를 지정
• title="제목"
    : 해당 문자에 부여할 텍스트를 입력. 브라우저에서는 풍선 도움말로 표시.
• loop="값" (값 = 횟수 / infinite)
    : 반복 횟수를 지정하며, 기본적으로 infinite로 무한 반복합니다.
• scrollamount="숫자"
    : 흘러가는 속도를 지정하며, 입력 값이 높을수록 속도가 빨라 집니다.
• scrolldelay="숫자"
    : 흘러가는 텍스트가 다시 나타나는 간격을 설정하며, 입력 값은 mm단위이며, 입력 값이 낮을 수록 빨라집니다.
• vspace="픽셀"
    : 흘러가는 텍스트의 수직 간격을 지정합니다.




특정 브라우저에서만 지원되는 태그를 사용하는 것은 추천하고 싶지는 않으나, 써야 한다면 그와 유사 한 기능을 Javascript로 구성하여 제공하는 것이 좋다. 예를 들어, 글자를 흐르게 하는 IE에서만 사용 되는 <marquee> 태그를 지원하기 위해서는 다음과 같이 한다.

<script type="text/javascript">
var msg = "이 텍스트가 MARQUEE태그 처럼 스크롤 합니다. ";

function JsMarquee(id){
  if(document.getElementById){ // IE5, Mozilla
    var msgarea = document.getElementById(id);
    if (msgarea.firstChild && msgarea.firstChild.nodeName == "#text") {
      msgarea.firstChild.nodeValue = msg;
    } else if (document.all) {
      msgarea.innerHTML = msg;
    }
  } else if(document.all) { // IE4
    msgarea.innerHTML = msg;
  } else if(document.layers){ //NN4
    msg2=msg.substring(0,40);
    document.layers[id].visibility="hidden";
    document.layers[id].document.open();
    document.layers[id].document.write(msg2);
    document.layers[id].document.close();
    document.layers[id].visibility="show";
  }
  msg=msg.substring(2,msg.length)+msg.substring(0,2);
  var cmd = "JsMarquee("" + id + "")";
  setTimeout(cmd,500);
}
</script>


자료출처
http://www.mozilla.or.kr/ko/docs/web-developer/standard/content3.html#3.1

댓글목록

등록된 댓글이 없습니다.


Total 2,634건 129 페이지
  • RSS
기술자료 목록
74
Adobe   14454  2006-05-13 14:07  
73
JavaScript   28368  2006-05-11 09:34 ~ 2022-05-12 19:15  
72
JavaScript   18928  2006-05-10 17:45 ~ 2019-05-07 21:13  
71
제로보드   16160  2006-04-29 11:21  
70
Adobe   17239  2006-04-19 23:26 ~ 2006-09-05 00:00  
69
제로보드   13321  2006-04-19 21:03 ~ 2018-06-15 00:00  
68
제로보드   13253  2006-04-19 21:01  
67
Adobe   15339  2006-04-03 21:46  
66
MySQL   15178  2006-04-02 23:00  
65
MySQL   11983  2006-04-02 23:00 ~ 2024-04-10 14:38  
64
MySQL   24882  2006-04-02 22:59 ~ 2020-06-08 14:29  
63
제로보드   14791  2006-04-02 16:38  
62
일반   12780  2006-04-01 08:43  
61
HTML   23491  2006-03-04 14:54 ~ 2020-10-11 18:21  
60
제로보드   23326  2006-03-03 05:22  
열람
HTML   15464  2006-03-02 21:35 ~ 2008-01-28 00:00  
58
HTML   16466  2006-02-11 11:18 ~ 2017-03-29 00:00  
57
JavaScript   12045  2006-02-11 11:10  
56
JavaScript   12941  2006-02-11 11:06  
55
JavaScript   13570  2006-01-25 20:30 ~ 2006-07-13 00:00  

검색

해피정닷컴 정보

회사소개 회사연혁 협력사 오시는길 서비스 이용약관 개인정보 처리방침

회사명: 해피정닷컴   대표: 정창용   전화: 070-7600-3500   팩스: 042-670-8272
주소: (34368) 대전시 대덕구 대화로 160 대전산업용재유통단지 1동 222호
개인정보보호책임자: 정창용   사업자번호: 119-05-36414
통신판매업신고: 제2024-대전대덕-0405호 [사업자등록확인]  
Copyright 2001~2024 해피정닷컴. All Rights Reserved.