Home > Web Front-end > HTML Tutorial > How to use Marquee tags in XHTML code_HTML/Xhtml_web page production

How to use Marquee tags in XHTML code_HTML/Xhtml_web page production

WBOY
Release: 2016-05-16 16:42:24
Original
1341 people have browsed it

In the forum, I saw netizen jeanjean20 mentioning how Marquee can be modified to meet the standards. I looked at my friends’ comments and thought they were all very good. Moderator greengnn pointed out that Marquee does not meet the standards and has been abandoned by W3C. Some friends were very aggrieved and said that it was unreasonable to go. The effect that was good at first has now disappeared. Some friends also said it was good to go, but it was annoying to watch. Everyone has their own perspective of understanding, but how we understand it is one thing, but we need to figure out why. Here I will modify and add some content to greengnn’s conclusion. I hope everyone understands and can figure it out.

The first thing to correct is: Marquee was abandoned by W3C. This sentence is actually wrong. Why? Because Marquee has never been used as an official label by W3C. W3C has never formulated this label, let alone "abandoned" it. This is like saying divorce before you are married. In fact, Marquee, like many other labels, is privately produced by companies such as Microsoft and Netscape, and the W3C has not recognized this label. This rich company has a problem with being unreasonable, but this unprofitable organization is just a tough talker!

Why doesn’t W3C recognize Marquee? It should be said that this label is regarded as a screwdriver in the eyes of most web designers! In the early years, we still used technological power as capital to show off. But now it is no longer recommended to use it (here is a digression: many people say that W3C does not allow it to be used. This is wrong. W3C has no right to restrict you from using it or not being able to use it.), why? Then we need to clarify what this standard is. . A standard is not a technology, it is just a specification and proposal. We still use the original tags in HTML4.0. The standard does not add any tags to our XHTML, but gives the recommended ones (for example: p, div, ul, dl, span, em... ), which ones are advocated not to be used (for example: font, b, u, i...), and it is advocated that semantics and usage standards be required. Of course, the standard is not just XHTML, but also includes CSS, DOM and scripting languages. Many people think that CSS was created after standards. In fact, it is not true. CSS has been around for a long time. Standards are the same for CSS. It is recommended not to use some CSS developed by some browser manufacturers, such as CSS filters.

There is another very important point in the standard, which is functional separation. It is divided into three parts: structure, style, and behavior. These three parts include structure (xHTML, XML), sample (CSS), and behavior (DOM, ECMAScript) respectively. At this point, let’s go back and think about why Marquee is not recognized by W3C. I think everyone should understand. Like FONT, B and other tags, it is no longer a structural tag. They have style and behavioral characteristics, and it is obviously redundant to classify them in the category of structure.

So, if you want the effect of Marquee to be retained or realized, you need to pay more attention to JavaScript. The scripting language will definitely make your web page move. If you want to make the place you specify move, of course you must pay attention to the use of ID and CLASS in the tag.

In order to make it easier for everyone to use this interesting effect, I specially asked Aoao to write a piece of JS. See the following code:

JS code:

Copy code
The code is as follows:

function getElementsByClass(searchClass,tagName) {
var classElements = new Array();
if ( tagName == null )
tagName = '*';
var els = document.getElementsByTagName(tagName);
var elsLen = els.length;
var pattern = new RegExp("( ^|s)" searchClass "(s|$)");
for (i = 0, j = 0; i < elsLen; i ) {
if ( pattern.test(els[i]. className) ) {
classElements[j] = els[i];
j ;
}
}
return classElements;
}
function ccMarquee(className){
var a=getElementsByClass(className);
for (i = 0; i < a.length; i ) {
a[i].innerHTML="" a[i]. innerHTML "";
}
}window.onload = function () {
ccMarquee("ccMarquee");
}

XHTML code :


Copy code
The code is as follows:

Please pay attention , where you need to use the scrolling effect, just add Class="ccMarquee" to any peripheral label. Pay attention to capitalization.

Attachment: Detailed explanation of tag attributes

Please take a look at the following code first


Copy the code
The code is as follows:

Enter the scrolling content here

Now let us analyze it in detail

◎ direction represents the direction of scrolling, the value Can be left, right, up, down, the default is left
◎ behavior represents the scrolling method, the value can be scroll (continuous scrolling) slide (slide once) alternate (round-trip scrolling)
◎ loop represents the number of loops , the value is a positive integer, the default is infinite loop
◎ scrollamount represents the movement speed, the value is a positive integer, the default is 6
◎ scrolldelay represents the pause time, the value is a positive integer, the default is 0, the unit seems to be milliseconds
◎ align represents the vertical alignment of the element, the value can be top, middle, bottom, the default is middle
◎ bgcolor represents the background color of the motion area, the value is the hexadecimal RGB color, the default is white
◎ height, width represents the height and width of the motion area. The value is a positive integer (unit is pixel) or a percentage. The default width is 100%. Height is the height of the element in the label
◎ hspace and vspace represent the horizontal and vertical distance from the element to the area boundary. , the value is a positive integer, and the unit is pixels.
◎ onmouseover=this.stop() onmouseout=this.start() means that the scrolling stops when the mouse is above the area, and continues scrolling when the mouse moves away.
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template