<marquee> 태그는 쌍으로 나타나는 태그입니다. 첫 번째 태그 <marquee>와 마지막 태그 </marquee> 사이의 내용은 컨텐츠를 스크롤하는 것입니다. <marquee> 태그의 속성에는 주로 동작, bgcolor, 방향, 너비, 높이, hspace, vspace, loop, scrolllamount, scrolldelay 등이 포함됩니다. 모두 선택 사항입니다.
오늘, WeChat에서 큰 턴테이블 복권 추첨을 할 때 모든 사용자의 복권 기록을 원활한 스크롤 효과로 만들고 싶었습니다. 불행히도, 나의 JS 재단은 너무 가난했고 당분간 그것을 달성 할 수있는 방법을 생각할 수 없었기 때문에 바이두에 대한 다양한 영향을 미쳤습니다. 그러나 실수로 HTML 태그를 발견했습니다 - <marquee> </marquee> JS 제어없이 여러 스크롤 효과를 얻을 수 있습니다. Marquee 태그를 사용하면 텍스트를 스크롤 할뿐만 아니라 사진, 테이블 등도 스크롤 할 수 있으며 편리하고 빠르게 사용하여 많은 시간을 절약 할 수 있습니다.
Marquee 태그는 HTML3.2의 일부가 아니며 나중에 MSIE3 나중에 커널을 지원하므로 Nonie 커널 브라우저 (Netscape)를 사용하는 경우 아래에 흥미로운 효과를 볼 수 없습니다. 이 태그는 컨테이너 태그입니다.
1. 천막 태그의 몇 가지 중요한 속성 :1. 방향 : 스크롤 방향 (4 값 포함 : 위, 아래, 왼쪽, 오른쪽 포함)
설명 : UP : 아래쪽에서 상단으로 스크롤; 다운 : 위에서 아래로 스크롤하십시오. 왼쪽 : 오른쪽에서 왼쪽으로 스크롤하십시오. 오른쪽 : 왼쪽에서 오른쪽으로 스크롤하십시오.
구문 : <마키 방향 = 스크롤 방향> ... </marquee>
2.Behavior : 스크롤 방법 (3 값 포함 : 스크롤, 슬라이드, Alter)
설명 : 스크롤 : 루프 스크롤, 기본 효과; 슬라이드 : 한 번만 스크롤 할 때 중지하십시오. 대체 : 교대로 앞뒤로 스크롤합니다.
구문 : <마키 동작 = 스크롤 방법> ... </marquee>
3.scrollamount : 스크롤 속도 (스크롤 속도는 각 스크롤이 설정 될 때의 움직임 길이입니다.
구문 : <marquee scrollamount = 5> ... </marquee>
4. ScrollDelay : 스크롤 사이의 지연 시간을 두 번 설정하십시오. 값이 크면 단계별 효과가 있습니다 (스크롤 시간 간격을 설정하면 단위는 밀리 초입니다)
구문 : <marquee scrolldelay = 100> ... </marquee>
5. 루프 : 스크롤 사이클의 횟수를 설정합니다 (기본값은 -1이고 스크롤은 계속 순환됩니다)
구문 : <마키 루프 = 2> ... </marquee>
<marquee loop = -1 bgcolor =#cccccc> 나는 계속 걸을 것입니다. </marquee>
<marquee loop = 2 bgcolor =#cccccc> 나는 두 번만 간다 </marquee>
6.width, 높이 : 두루마리 자막의 너비와 높이를 설정
구문 : <마키 너비 = 500 높이 = 200> ... </marquee>
7.BGCOLOR : 스크롤 자막의 배경색을 설정합니다 (색상 값 또는 RGB () 또는 RGBA () 함수)
구문 : <marquee bgcolor = rgba (0,0,0,0.2)> ... </marquee>
8.hspace, vspace : 빈 공간 (마진 값 설정에 해당)
설명 : HSPACE : hspace = 10과 같은 모 컨테이너의 수평 경계에서 활성 자막의 위치 사이의 거리를 설정하십시오. 마진 : 0 10px;
vspace : vspace = 10과 같은 모 컨테이너의 수직 테두리에서 활성 자막의 위치 사이의 거리를 설정하십시오. 마진 : 10px 0;
구문 : <marquee hspace = 10 vspace = 10> ... </marquee> (마진 : 10px;)
9. ALIGN : 자막 스크롤링 정렬 방법 설정 (9 값 포함 : Absbottom, Absmiddle, Bantline, Left, Middle, Right, TextTop, Top)
설명 : Absbottom : absbottom은 g, p와 같은 문자의 하단과 일치합니다)
Absmiddle : 절대적으로 중앙 정렬
기준선 : 결론 정렬
하단 : 하단 정렬 (기본값)
왼쪽 : 왼쪽 정렬
중간 : 중간 정렬
오른쪽 : 오른쪽 정렬
TextTop : 최고 라인 정렬
상단 : 상단 정렬
구문 : <marquee align = align> ... </marquee>
10. 페이스 : 자막 스크롤을위한 텍스트 글꼴을 설정합니다
구문 : <marquee font = kaiti_gb2312> </marquee>
11. 콜러 : 스크롤 자막의 텍스트 색상을 설정합니다
구문 : <marquee color =#333> </marquee>
12. 크기 : 스크롤 자막의 텍스트 글꼴 크기를 설정합니다
구문 : <마키 크기 = 3> </marquee>
13.Strong : 스크롤 자막의 텍스트를 대담하게 설정
2. Marquee에서 사용한 두 가지 일반적인 이벤트 :구문 : <marquee strong> </marquee>
onmouseout = this.start ()는 마우스 가이 영역에서 벗어날 때 스크롤을 계속하도록 설정하는 데 사용됩니다.
OnMouseOver = this.stop ()은 마우스 가이 영역으로 이동할 때 스크롤을 중지하도록 설정하는 데 사용됩니다.
<marquee onmouseout = this.start () onmouseover = this.stop ()> marquee </marquee>에서 사용하는 두 가지 일반적인 이벤트
전체 코드는 다음과 같습니다.
<marquee id = affiche align = 왼쪽 동작 = 왼쪽 동작 = 스크롤 bgcolor =#ff0000 방향 = 300 너비 = 300 너비 = 200 hspace = 50 vspace = 20 loop = -1 scrolllamount = 10 scrolllay = 10 onmouseout = this.start () onmouseOver = this.stop ()>
<marquee>의 많은 매개 변수가 있지만 결국 복잡하고 맞춤형 특수 천막 효과를 달성 할 수 없으며 브라우저 제한이 있으므로 더 많은 경우 JavaScript를 사용하여 Marquee 스크롤 효과를 달성합니다.
이것은 HTML에서 원활한 스크롤 마키 태그의 효과에 대한 기사입니다. 이것은이 기사에 관한 것입니다. Seamless Scrolling Marquee의 관련 내용은 wulin.com의 이전 기사를 검색하거나 아래 관련 기사를 계속 찾아보십시오. 나는 모두가 앞으로 Wulin.com을 지원하기를 바랍니다!