Header Ads

HTML Marquee direction right left up down

Chapter 8

Marquee tag in HTML is used for scrolling the text and images in four directions Right, Left, Up, Down within a web page. Marquee tag was first introduced in early versions of Microsoft's Internet Explorer.

 

HTML Marquee Tages

Marquee's element contains several tages that are used to control and adjust the appearance of the marquee.

Sr No.

Tages and Description

1

Width :-  This will  provides the width of a marquee. For example width="20" or width="20%"

2

Height:- This will provides the height or length of a marquee. For example height="30" or height="40%"

3

Direction:- This will provides the direction or way in which your marquee will allow you to scroll in four directions. The value of this tag can be: left, right, up or down

4

Scrolldelay:- This will provides a feature whose value will be used for delaying among each jump. This will have a value like 10 etc.

5

Scrollamount:- This will provides value for speeding the marquee feature

6

Behavior:- This will provides the scrolling type in both direction right to left and left to right. That scrolling can be like sliding, scrolling or alternate

7

Loop:- This will provides how many times the marquee will scroll. The default value is INFINITE, which means that the marquee loops endlessly.

8

Bgcolor:- This will provides a background color of the marquee. The  background color in terms of color name or hexadecimal color-code value..

9

Vspace:- This will provides a vertical space and its value can be like: vspace="20" or vspace="30%"

10

Hspace:- This will provides a horizontal space and its value can be like: vspace="20" or vspace="30%"

 

Examples of marquee tag.

Example 1:

Note: By default marquee direction is right to left 

<html>

   <head>

      <title>HTML marquee Tag demo</title>

   </head>

   <body>

      <marquee>This is the demo of marquee example </marquee>

   </body>

</html>

 

 Output Of Marquee Code:


This is the demo of marquee example

Example 2:

 

<html>

   <head>

      <title>HTML marquee right direction demo</title>

   </head>

    <body>

<marquee direction=right>This will scroll text in right direction</marquee>

   </body>

</html>

 

 Output Of Marquee Code:


This will scroll text in right direction


Example 3:

 

<html>

    <head>

   <title>HTML marquee down direction demo</title>

   </head>

      <body>

<marquee direction=down>This will scroll in down direction</marquee>

   </body>

</html>

 

 Output Of Marquee Code:


This will scroll in down direction


 Example 4:

 

<html>

   <head>

   <title>HTML marquee up direction demo</title>

   </head>

   <body>

<marquee direction=up>This will scroll text in up direction</marquee>

   </body>

</html>

 

 Output Of Marquee Code:


This will scroll text in up direction


Example 5:

 

<html>

   <head>

   <title>HTML marquee scrolling can be like sliding demo</title>

   </head>

    <body>

<marquee behavior=alternate>This will scroll text in alternate direction</marquee>

   </body>

</html>


 Output Of Marquee Code: This will scroll text in alternate direction




Some Special Examples Of Marquee


<html>

<head>

<title>The Power Of Marquee Demo</title>

</head>

<body>

<marquee width=49% bgcolor="green" direction=right> <font size=+3

color="red">Programming Software Guru</marquee>

<marquee width=49% bgcolor="green"> <font size=+3 color="red"> Programming Software Guru</marquee><br><br>

 

<marquee width=80% bgcolor="green" direction=down><font size=+3 color="red">HTML Marquee Demo Programming Sotware Guru </marquee>

<marquee width=80% bgcolor="green" direction=up><font size=+3 color="red">HTML Marquee Demo Programming Software Guru </marquee><br><br>

 

<marquee width=90% bgcolor="green" behavior="alternate"><font size=+3

color="red"> Programming Sotware Guru</marquee>

<br><br>

<marquee width=90% behavior="alternate"><font size=+3 color="red"><img src="htmladvnew.png" width=150 height=150> </marquee>

 

</body>

</html>

 

 Output Of Marquee Code:

The Power Of Marquee Demo Programming Software Guru Programming Software Guru

HTML Marquee Demo Programming HTML Marquee Demo Programming

Programming Sotware Guru



CHAPTER 1     CHAPTER 2    CHAPTER 32  CHAPTER 4    CHAPTER 5     

CHAPTER 6   CHAPTER 7    CHAPTER 8    CHAPTER 9    CHAPTER 10

No comments

Powered by Blogger.