Moving texts (Marquee) _ experience exchange

Source: Internet
Author: User
Moving text (Marquee) The Marquee tag is used to scroll text in the available browsing area. This tag is only applicable to browsers later than ie3. 
Format:
     BEHAVIOR = "... "
BGCOLOR = "... "
DIRECTION = "... "
HEIGHT = "... "
WIDTH = "... "
HSPACE = "... "
VSPACE = "... "
LOOP = "... "
SCROLLAMOUNT = "... "
SCROLLDELAY = "... "
ONMOUSEOUT = this. start ()
ONMOUSEOVER = this. stop ()
>...
     
   
Attribute:
ALIGN: Used to ALIGN the scrolling text based on the set value. ALIGN can be set to LEFT, CENTER, RIGHT, TOP, and BOTTOM. This attribute is not required.
Example:
     This scroll text is set to alignment 
   
   
BEHAVIOR: allows the browser to process the text as set once the text appears on the page. If the set method is SLIDE, the text will be moved to the document and stuck on the margin. If it is set to ALTERNATE, the text is moved from one side to the other. If it is set to SCROLL, the text will be repeatedly rolled on the page. This attribute is not required. You can set the following values: SILIDE, ALTERNATE, and SCROLL.
Example:
     Move text from one side to the other 
   
   
BGCOLOR: used to set the background color of a subtitle. The background color can be set in RGB, hexadecimal format, or color name.
Example:
     Set the rolling text background color to red with the color name 
     Set the color of the scrolling text background to red with a hexadecimal value. 
     Use RGB to set the color of the scrolling text background to red 
      
DIRECTION: used to set the DIRECTION of text scrolling. You can set the following values: LEFT and RIGHT. This attribute is not required.
Example:
     Text scroll to the left 
     Text scroll to the right 
   
HEIGHT: used to set the HEIGHT of a rolling subtitle. The HEIGHT can be expressed by pixel or percentage of a visible page. This attribute is not required.
Example:
     The height of the scroll subtitle is 10% of the visible page. 
     The height of the scrolling subtitle is 12 pixels. 
      
WIDTH: used to set the subtitle WIDTH. The WIDTH can be expressed by the percentage of pixels or visible pages. This attribute is not required.
Example:
     The width of the scroll subtitle is 90% of the visible page. 
     The width of the scroll subtitle is 200 pixels. 
      
Used to set the Left and Right blank space for Rolling subtitles. the blank space is represented in pixels. This attribute is not required.
Example:
     The left and right blank space of the scrolling subtitles is 15 pixels 
     
VSPACE: Used to Set Up and down spaces for Rolling subtitles. the blank space is represented in pixels. This attribute is not required.
Example:
     The space in the upper and lower spaces of the scrolling subtitles is 2 pixels. 
     
LOOP: used to set the number of scrolling subtitles. When the LOOP value is "INFINITE" or "-1", the text will scroll unlimitedly. This attribute is not required.
Example:
     Text scrolling countless times 
     5 times of text scrolling 
   
SCROLLAMOUNT: used to set the interval after each continuous scrolling text, which is represented in pixels. This attribute is not required.
Example:
     The interval after the text is 10 pixels 
      
SCROLLDELAY: used to set the interval between two rolling operations, in milliseconds. This attribute is not required.
Example:
     The interval between two scrolling texts is 5 ms.

ONMOUSEOUT = this. start (): used to set the scroll continued when the mouse moves out of the area.
ONMOUSEOVER = this. stop (): Used to stop scrolling when the mouse moves into this area.
Javascript for continuous scrolling

<! -- Define an image --> SCRIPT var speed = 30 demo2.innerHTML = demo1.innerHTML function Marquee () {if (demo2.offsetTop-demo. scrollTop <= 0) demo. scrollTop-= demo1.offsetHeight else {demo. scrollTop ++} var MyMar = setInterval (Marquee, speed) demo. onmouseover = function () {clearInterval (MyMar)} demo. onmouseout = function () {MyMar = setInterval (Marquee, speed)} SCRIPT
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]


Message scrolling in classic forums

Script var marqueeContent = new Array (); // defines an Array to store the display content marqueeContent [0] = 'refresh the latest list'; marqueeContent [1] =' http://www.blueidea.com/updatelist.asp Target = _ blank> 60 latest site updates '; marqueeContent [2] =' http://www.blueidea.com/tech/graph/2003/875.asp Target = _ blank> Feather Effect creation tutorial '; marqueeContent [3] =' http://www.blueidea.com/tech/program/2003/831.asp Target = _ blank> MySQL & ASP '; marqueeContent [4] =' http://www.blueidea.com/tech/web/2003/874.asp Target = _ blank> get started with css3'; marqueeContent [5] =' http://www.blueidea.com/tech/graph/2003/864.asp Target = _ blank> Fireworks MX 2004 executes the versioning operation '; marqueeContent [6] =' http://www.blueidea.com/tech/graph/2003/872.asp Target = _ blank> Fireworks MX 2004 High Gradient fill '; marqueeContent [7] =' http://www.blueidea.com/photo/gallery/2003/873.asp Target = _ blank> the flowers in the bottle '; marqueeContent [8] =' http://www.blueidea.com/tech/graph/2003/871.asp Target = _ blank> Fireworks MX implementation option effect '; marqueeContent [9] =' http://www.blueidea.com/photo/gallery/2003/870.asp Target = _ blank> couples: black and white love air '; marqueeContent [10] =' http://www.blueidea.com/tech/graph/2003/866.asp Target = _ blank> Create the MAC-style apple logo '; marqueeContent [11] =' http://www.blueidea.com/tech/graph/2003/868.asp Target = _ blank> Create an eggshell and synthesize characters from the shell '; var marqueeInterval = new Array (); // define some common and frequently used variables var marqueeId = 0; var marqueeDelay = 4000; var marqueeHeight = 20; // scroll height // The following is the definition of the Function Array to be used. prototype. random = function () {var a = this; var l =. length; for (var I = 0; I <l; I ++) {var r = Math. floor (Math. random () * (l-I); a =. slice (0, r ). concat (. slice (r + 1 )). concat (a [r]);} return a;} function initMarquee () {marqueeContent = MarqueeContent. random (); var str = ''; for (var I = 0; I <Math. min (3, marqueeContent. length); I ++) str + = (I> 0? '':'') + MarqueeContent [I]; document. write ('<p id = marqueeBox style = "overflow: hidden; height:' + marqueeHeight + 'px" onmouseover = "clearInterval (marqueeInterval [0]) "onmouseout =" marqueeInterval [0] = setInterval (\ 'startmarquee () \ ', marqueeDelay) "> <p> '+ str +' </p> '); marqueeId + = 2; if (marqueeContent. length> 3) marqueeInterval [0] = setInterval ("startMarquee ()", marqueeDelay);} function reinitMarquee () {js_scroll _ Content. src = 'scroll _ content2.js '; marqueeContent = marqueeContent. random (); var str = ''; for (var I = 0; I <Math. min (3, marqueeContent. length); I ++) str + = (I> 0? '':'') + MarqueeContent [I]; marqueeBox. childNodes [(marqueeBox. childNodes. length = 1? 0: 1)]. innerHTML = str; marqueeId = 2;} function startMarquee () {var str = ''; for (var I = 0; (I <3) & (marqueeId + I <marqueeContent. length); I ++) {str + = (I> 0? '':'') + MarqueeContent [marqueeId + I];} marqueeId + = 3; if (marqueeId> marqueeContent. length) marqueeId = 0; if (marqueeBox. childNodes. length = 1) {var nextLine = document. createElement ('div '); nextLine. innerHTML = str; marqueeBox. appendChild (nextLine);} else {marqueeBox. childNodes [0]. innerHTML = str; marqueeBox. appendChild (marqueeBox. childNodes [0]); marqueeBox. scrollTop = 0;} clearInterval (marqueeInterval [1]); marqueeInterval [1] = setInterval ("scrollMarquee ()", 20);} function scrollMarquee () {marqueeBox. scrollTop ++; if (marqueeBox. scrollTop % marqueeHeight = (marqueeHeight-1) {clearInterval (marqueeInterval [1]) ;}} initMarquee (); script
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]


<Style type = "text/css"> a {text-decoration: none ;}</style> script var marqueeContent = new Array (); // rolling news marqueeContent [0] = '14: 25 http://www.blueidea.com/updatelist.asp Target = _ blank class = "f12red"> Koizumi said that if the Liberal Democratic Party fails in parliamentary elections, '; marqueeContent [1] = '14: 25 http://www.blueidea.com/updatelist.asp Target = _ blank class = "f12red"> bush speaks on a broadcast '; marqueeContent [2] = '14: 25 http://www.blueidea.com/updatelist.asp Target = _ blank class = "f12red"> An islamic army has bombed the Indian-controlled railway, causing train derailment. '; marqueeContent [3] = '14: 25 http://www.blueidea.com/updatelist.asp Target = _ blank class = "f12red"> Bremer: It is difficult to end resistance even if Saddam is captured '; var marqueeInterval = new Array (); // define common and frequently used variables var marqueeId = 0; var marqueeDelay = 2000; var marqueeHeight = 18; // The next step is to define some function initMarquee () {var str = marqueeContent [0]; document. write ('<p id = marqueeBox style = "overflow: hidden; height:' + marqueeHeight + 'px" onmouseover = "clearInterval (marqueeInterval [0]) "onmouseout =" marqueeInterval [0] = setInterval (\ 'startmarquee () \ ', marqueeDelay) "> <p> '+ str +' </p> '); marqueeId ++; marqueeInterval [0] = setInterval (" startMarquee ()", marqueeDelay);} function startMarquee () {var str = marqueeContent [marqueeId]; marqueeId ++; if (marqueeId> = marqueeContent. length) marqueeId = 0; if (marqueeBox. childNodes. length = 1) {var nextLine = document. createElement ('div '); nextLine. innerHTML = str; marqueeBox. appendChild (nextLine);} else {marqueeBox. childNodes [0]. innerHTML = str; marqueeBox. appendChild (marqueeBox. childNodes [0]); marqueeBox. scrollTop = 0;} clearInterval (marqueeInterval [1]); marqueeInterval [1] = setInterval ("scrollMarquee ()", 20);} function scrollMarquee () {marqueeBox. scrollTop ++; if (marqueeBox. scrollTop % marqueeHeight = (marqueeHeight-1) {clearInterval (marqueeInterval [1]) ;}} initMarquee (); script
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]


The Code is as follows:




Var marqueeContent = new Array ();
MarqueeContent [0] = 'refresh list ';
<% Dim rs, SQL
CALL online_users
SQL = "SELECT O. userName, U. realName FROM TBL_ONLINE O left join TBL_USER U on O. userName = U. userName ORDER BY O. loginTime DESC"
Set rs = conn.exe cute (SQL)
If NOT (rs. eof AND rs. bof) Then
Count = 1
Do while not rs. eof
%>
MarqueeContent [<% = count %>] = '"> <% = rs (" realName ") %> ';
<% Rs. movenext
Count = count + 1
Loop
End If
Rs. close
Set rs = nothing
Conn. close
Set conn = nothing
%>


<Script language = "JavaScript" defer> // code by windy_sk <windy_sk@126.com> 20040127 var obj_marquee = document. getElementById ("marquee"); var marquee_spd = 4000; var step_c = 0; function marquee_init () {var obj_unit = obj_marquee.firstChild; var n = Math. ceil (parseInt (partition)/obj_unit.offsetHeight); for (var I = 0; I <n; I ++) obj_marquee.appendChild (obj_unit.cloneNode (true); retur N;} function marquee_show () {var marquee_high = parseInt (partition); var step = marquee_high/10; if (obj_marquee.scrollTop> = obj_marquee.children [1]. offsetTop) {obj_marquee.scrollTop = 0; marquee_show (); return;} obj_marquee.scrollTop + = step; if (step_c ++ <9) setTimeout ("marquee_show ()", 50 ); return;} marquee_init (); setInterval ("step_c = 0; setTimeout ('marquee _ show () ', 50)", marq Uee_spd); script <table style = "border: 1px black solid;"> <tr> <td> <p id = "marquee" style = "overflow: hidden; height: 60px; width: 210px; border: 0px; padding: 0px; "> <p style =" border: 0px; padding: 0px "> <! -- Marquee Body Head --> <p style = "height: 60px; width: 210px; font-size: 12px"> This is an advertisement ~~~~~~~~~ </P> <p style = "height: 60px; width: 210px; font-size: 12px "> This is also an advertisement ~~~~~~~~~~~~~~~~ </P> <p style = "height: 60px; width: 210px; font-size: 12px"> how can this be an advertisement ?????? </P> <p style = "height: 60px; width: 210px; font-size: 12px"> Windy2000 also advertises itself ~~~~~~~~~~ </P> <! -- Marquee Body Bottom --> </p> </td> </tr> </table>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]



<Script language = "JavaScript" defer> // qswh's original and modifid by windy_sk <windy_sk@126.com> 20040120 function reportError (msg, url, line) {var str = "You have found an error as below: \ n"; str + = "Err:" + msg + "on line:" + line; alert (str); return true;} window. onerror = reportError; var obj_marquee = document. getElementById ("marquee"); var repeat = null; var marquee_spd = 50; function Marquee_init () {var obj_unit = response; var marquee_high = parseInt (response); var marquee_wide = parseInt (response); var unit_high = response; var unit_wide = response; var m = 0, n = 0, I = 0; var tmp = null; m = Math. ceil (marquee_wide/unit_wide); n = Math. ceil (marquee_high/unit_high); obj_unit.style.width = marquee_wide * (M + 1); obj_unit.rows [0]. cells [0]. style. width = obj_marquee.style.width; for (I = 0; I <m; I ++) {tmp = obj_unit.rows [0]. insertCell (-1); tmp. innerHTML = obj_unit.rows [0]. cells [0]. innerHTML; tmp. style. width = marquee_wide; tmp = null;} for (I = 0; I <n; I ++) {obj_marquee.appendChild (obj_unit.cloneNode (true);} return ;} function marquee_show (direction) {switch (direction) {case "up": if (obj_marquee.s CrollTop> = obj_marquee.children [1]. offsetTop) {obj_marquee.scrollTop-= upper;} else {obj_marquee.scrollTop ++;} break; case "down": if (rows <= 0) {obj_marquee.scrollTop + = upper ;} else {obj_marquee.scrollTop --;} break; case "left": if (obj_marquee.scrollLeft> = obj_marquee.firstChild.rows [0]. cells [0]. offsetWidth) {Obj_marquee.scrollLeft-= obj_marquee.firstChild.rows [0]. cells [0]. offsetWidth;} else {obj_marquee.scrollLeft ++;} break; case "right": if (obj_marquee.scrollLeft <= 0) {obj_marquee.scrollLeft + = limit [0]. cells [0]. offsetWidth;} else {obj_marquee.scrollLeft --;} break; default: break;} return;} function marquee_doit () {var direction = ""; direction = obj_marquee.getAtt Riction ("direction"); if (direction! = Null) marquee_show (direction); direction = obj_marquee.getAttribute ("direction2"); if (direction! = Null) marquee_show (direction); return;} marquee_init (); repeat = setInterval ("marquee_doit ()", marquee_spd); marquee. onmouseover = function () {clearInterval (repeat);} marquee. onmouseout = function () {repeat = setInterval ("marquee_doit ()", marquee_spd);} script <table style = "border: 1px black solid; "> <tr> <td> <p id =" marquee "direction =" up "style =" overflow: hidden; height: 200px; width: 250px "> <table sty Le = "border: 0px; padding: 0px;"> <tr> <td> <! -- Marquee Body Head --> classic Forum 163.com 21cn.com Happy new year <! -- Marquee Body Bottom --> </td> </tr> </table> </p> </td> </tr> </table> Direction1: <input type = "button" value = "comment" onclick = "obj_marquee.direction = 'up'"> <input type = "button" value = "comment" onclick = "obj_marquee.direction =' <input type = "button" value = "button" onclick = "obj_marquee.direction = 'left'"> <input type = "button" value = "→" onclick = ""obj_marquee.direction = 'right'"> <input type = "button" value = "X" onclick = "obj_marquee.direction ='' "> Direction2: <input type = "button" value = "inline" onclick = "obj_marquee.direction2 = 'up'"> <input type = "button" value = "inline" onclick = "obj_marquee.direction2 =' <input type = "button" value = "button" onclick = "obj_marquee.direction2 = 'left'"> <input type = "button" value = "→" onclick =" "obj_marquee.direction2 = 'right'"> <input type = "button" value = "X" onclick = "obj_marquee.direction2 ='' ">
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.