|
Create a Meta Tag Slide Show - No Java Script Required
By Stephen Bucaro
You want to put a slide show on your webpage but, either you can not, or do not
want to, use Java Script. Well, you can create a slide show using only the html
refresh meta tag - no Java Script required.
A "meta tag" is an html tag that you place in the <head> section of your
webpage. There are many different meta tags, they are used to provide information
to a web server. The refresh meta tag is special in that it tells the browser to
send a command to the server. The command tells the server that the page should
be reloaded or that a different page should be loaded.
Technically when you load a different page, webmaster's called that a "redirect".
Shown below is an example of a refresh meta tag.
<meta http-equiv="refresh" content="5;url=http://domain_name/page_name">
Note the tag's "content" attribute. It is assigned a string with two parts separated
by a semi-colon. To the left of the semi-colon is a number that is the time,
in seconds, until the page should be redirected. To the right of the semi-colon
is the URL that should be loaded.
To create a slide show, we simply put each picture in the slide show on a separate
webpage, and in the <head> section of each webpage we place a refresh meta
tag that redirects to the page containing the next picture in the slide show. The
last webpage in the slide show might have a refresh meta tag that redirects back
to the first page.
Shown below is an example of html code for the first page in a slide show.
<html>
<head>
<meta http-equiv="refresh" content="5;url=page2.htm">
</head>
<body>
<img border="0" width="300" height="300" src="flower1.jpg" />
</body>
</html>
Note the img tag that will load and display the image "flower1.jpg". Note the
refresh meta tag with a content attribute that sets a 5 second delay before
it redirects to page2.htm. Shown below is example html code for page2.htm.
<html>
<head>
<meta http-equiv="refresh" content="5;url=page3.htm">
</head>
<body>
<img border="0" width="300" height="300" src="flower2.jpg" />
</body>
</html>
Page2.htm displays the image "flower2.jpg" and has a "refresh" meta tag that
redirects to page3.htm. And so on, and so on, we can string together as many
"slides" as we desire. But a slide show is usually ON a webpage, it doesn't
usually keep changing pages. We can do that using an html <iframe> element.
| 
Free Downloads
RSS Feed