Full understanding of the complete manual for making scrolling captions

Source: Internet
Author: User
Tags add manual
Content: Scrolling subtitles can make a lot of people feel excited, especially if you use scrolling subtitles for the first time. I also do a lot of scrolling subtitles, it will not be excited, so it is not used much now. A lot of friends often ask how this is done, and now do a detailed project to give you a more comprehensive understanding.

Scrolling captions are available in the components of FrontPage, but FrontPage can only support a single line of text, there is more than one line of text it can do nothing, and it can only support a line of scrolling! (If only one row is present, the workaround is to embed the code in the document.write of JavaScript, see the following example D for detailed instructions) Dreamweaver can also only use the method of writing HTML code. So it is highly recommended to use Notepad to open the page source code to edit.

1. Create the first scrolling marquee. Code:

<marquee scrollamount=2 width=300> I like web-page teaching network </marquee>

2. Detailed Parameters:

a) scrollamount. It represents speed, the greater the value the faster. If you do not have it, the default is 6, it is recommended to set the 1~3 better.

b width and height, indicating the size of the rolling area, width is wide, height is high. Especially when doing vertical scrolling, be sure to set the value of height.

c) direction. Indicates the direction of scrolling, which defaults to Right-to-left: ←←←. The optional values are right, down, up. Scrolling direction is: Right means →→→,up said ↑,down ↓.

D Scrolldelay, which is also used to control speed, the default is 90, the greater the value, the slower the speed. Usually the scrolldelay is not required to be set.

e) behavior. Use it to control properties, default to circular scrolling, optional values with alternate (alternating scrolling), slide (slide effect, refers to scrolling once, and then stop scrolling)

3. Examples:

A how do you add hyperlinks to scrolling captions? This is exactly the same as the usual hyperlinks. Just add <a href=***> and </a> to the outside of the text. The following effect, code is <marquee scrollamount=2 width=300><a href=http://www.webjx.com> Web page Teaching Network </a></marquee , click on CCTV to enter the:

Cctv

b How to make the text stop scrolling when the mouse hovers over the text?

Code such as:

<marquee scrollamount=2 width=300 onmouseover=stop () Onmouseout=start () > Text content </marquee>

c) Alternating effects. Code such as:

<marquee scrollamount=2 width=99 behavior=alternate> text content </marquee>

D Multiple lines of text scroll up. Code such as:

<marquee scrollamount=2 width=300 height=160 direction=up> Good morning! <br> The air is good and fresh ah <br> What is the right food today? <p> <a href=http://www.webjx.com> Web Teaching Network </a></marquee>

Note: If your page is edited by FrontPage, and you can only scroll one line after you save it, you will find that your original code order has changed, my god! The solution is to find the original code and embed it in the document.write of JavaScript, which is written as:

<script>document.write (' <marquee scrollamount=2 width=300 height=160 direction=up> Good morning! <br> The air is good and fresh ah <br> What is the right food today? <p> <a href=http://www.webjx.com> Web Teaching Network </a></marquee> ') </script>

As can be seen from the above, HTML code can be arbitrary combination of powerful features! <script src= ". /js/gd.js "></SCRIPT>

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.