HTML (HyperText Markup Language) is the programming language that underpins most of the sites on the web. Within the HTML language are various options for creating effects -- the marquee tag creates scrolling text or images and can be further customised to influence colours, scroll speed and direction. Unlike many other free web blogs, Blogger allows you to edit the HTML of your site, meaning you can create a scrolling banner; however, there are many applications of the code that can be used on other blog hosts.
Other People Are Reading
The basic tag you will be using to create the scrolling effect is: "<marquee></marquee>" Text placed between the marquee tags will scroll across the web page. It should be used with caution, as it can be confusing for the reader and distract from the other content on the web page.
Different marquee effects
You can influence direction and background colour by adding extra commands. For example: "<marquee direction="left" bgcolor="green">TEXT GOES HERE</>" would create a marquee that travels to the left with a green background. Use one of the seventeen HTML recognised colour names or use hex codes for more specific shades. You can also influence a marquee's behaviour. Add in behaviour="x" to the opening tag. Substitute "x" for "sliding" to create text that slides in then stops or "alternate" to create text that bounces from side to side. You can also affect the speed by adding in scrollamount="1". Increasing the numeric value increases the speed.
Add images to your marquee by placing the HTML image code between the opening and closing tags instead of text e.g. "<marquee><img src="URL of image"/></marquee>". You can also add links to your marquee using the "<a href="link URL">Text to display link</a>" code. To pause your marquee when someone hovers their mouse cursor over it, add the onmouseover="this.stop()" command to the opening tag, followed by onmouseout="this.start()" to make it start again when the mouse leaves the marquee.
Scrolling banners on Blogger
On the Dashboard, select "Template" then click "Edit HTML". Find the header section, which starts with the code "<header>" and ends with the "</header>" closing tag. Immediately after the opening tag, add your opening marquee tag. Close the marquee tag immediately before the closing header tag. This will cause whatever you have placed as your blog header in the theme customisation options to scroll across the screen.
Other places to use the code
- 20 of the funniest online reviews ever
- 14 Biggest lies people tell in online dating sites
- Hilarious things Google thinks you're trying to search for