Amazing effect
Output
HTML Marquees
You can also use the
<marquee> tag to create a marquee. You can make the text/images scroll from right to left, left to right, top to bottom, or bottom to top.
The <marquee> tags is non-standard HTML. Despite this, it has enjoyed widespread browser support. For a standards-compliant method, see css or bhootstar.
If you can't view the examples, it's likely that your browser doesn't support the
<marquee> tagsContinuous scrolling text
This marquee causes the text to scroll continuously from right to left. Once it disappears from the left, it re-appears from the right.
<!DOCTYPE html>Example-input
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Cool Effects with Marquees</title>
</head>
<body>
<div class="example-display" style="position:relative;height:600px;">
<marquee style="z-index:2;position:absolute;left:18%;top:47%;font-family:Cursive;font-size:14pt;color:#ffcc00;height:100px;" scrollamount="3" direction="down">programming</marquee>
<marquee style="z-index:2;position:absolute;left:1%;top:39%;font-family:Cursive;font-size:14pt;color:#ffcc00;height:50%;" scrollamount="7" direction="down">program</marquee>
<marquee style="z-index:2;position:absolute;left:11%;top:7%;font-family:Cursive;font-size:14pt;color:lime;height:302px;" scrollamount="4" direction="down">HTML</marquee>
<marquee style="z-index:2;position:absolute;left:25%;top:33%;font-family:Cursive;font-size:14pt;color:#ffcc00;height:435px;" scrollamount="3" direction="down">Code</marquee>
<marquee style="z-index:2;position:absolute;left:15%;top:13%;font-family:Cursive;font-size:14pt;color:#ffcc00;height:432px;" scrollamount="2" direction="down">php</marquee>
<marquee style="z-index:2;position:absolute;left:8%;top:29%;font-family:Cursive;font-size:14pt;color:#ffcc00;height:369px;" scrollamount="1" direction="down">HTML tags</marquee>
<marquee style="z-index:2;position:absolute;left:30%;top:17%;font-family:Cursive;font-size:14pt;color:#ffcc00;height:289px;" scrollamount="7" direction="down">JavaScript </marquee>
<marquee style="z-index:2;position:absolute;left:46%;top:27%;font-family:Cursive;font-size:14pt;color:#f90;height:78px;" scrollamount="7" direction="down">css</marquee>
<marquee style="z-index:2;position:absolute;left:16%;top:17%;font-family:Cursive;font-size:14pt;color:#ffcc00;height:56px;" scrollamount="5" direction="down">java</marquee>
<marquee style="z-index:2;position:absolute;left:30%;top:46%;font-family:Cursive;font-size:14pt;color:#ffcc00;height:194px;" scrollamount="2" direction="down">blogspot.com...</marquee>
<marquee style="z-index:2;position:absolute;left:2%;top:10%;font-family:Cursive;font-size:14pt;color:#ffcc00;height:251px;" scrollamount="6" direction="down">subscribe to site</marquee>
<marquee style="z-index:2;position:absolute;left:48%;top:24%;font-family:Cursive;font-size:14pt;color:#ffcc00;height:154px;" direction="down">">Marquees.. tags.</marquee>
<marquee style="z-index:2;position:absolute;left:41%;top:22%;font-family:Cursive;font-size:14pt;color:#ffcc00;height:82px;" direction="down">cool </marquee>
<marquee style="z-index:2;position:absolute;left:46%;top:2%;font-family:Cursive;font-size:14pt;color:Fuchsia;height:70px;" scrollamount="3" direction="down">...effects...</marquee>
<marquee style="z-index:2;position:absolute;left:26%;top:32%;font-family:Cursive;font-size:14pt;color:#ffcc00;height:358px;" scrollamount="1" direction="down">welcome</marquee>
<marquee style="z-index:2;position:absolute;left:3%;top:14%;font-family:Cursive;font-size:14pt;color:#ffcc00;height:130px;" scrollamount="3" direction="down">by saquib</marquee>
</div>
</body>
</html>
Comments
Post a Comment