Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Rotating Images 1

Status
Not open for further replies.

RodS2

IS-IT--Management
Sep 11, 2007
33
US
I would like to include rotating images to our main page. Like rotate between 5 or 6 images.

The page is at:


and the image we want to rotate is that main image in the middle on the left. Thanks for your help!
 
There are plenty of ready-written scripts around. I have found to be the most versatile and simple to use

___________________________________________________________
If you want the best response to a question, please check out FAQ222-2244 first.
'If we're supposed to work in Hex, why have we only got A fingers?'
Drive a Steam Roller
Steam Engine Prints
 
Hi John,

I tried putting the code into my page and it did not work. the moment i add the script type = javascript.... my page disappears. Also, did I call it right in this part? That is where I want the image slideshow to appear.

<tr>
<td width="423" height="156">
<img src="new inter_slide(slides2)" width="423" height="156"></div> </td>

-----------------------



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"
<html>

<title>Business Emissary | Business and Web | Consulting |Strategy | Marketing | Design | Development | Washington, DC.</title>
<meta name="description" content="XYZ">
<meta name="keywords" content="XYZ">
<meta name="copyright" content="2007, />
<link href=" rel="stylesheet" type="text/css" />
<head>

<script src="swissarmy.js" type="text/javascript">

var slides=[]; //FIRST SLIDESHOW
//configure the below images and descriptions to your own.
slides[0] = ["/images/image_placeholder.gif", "Kissing Fools"];
slides[1] = ["photo2.jpg", "Seated Woman"];
slides[2] = ["photo3.jpg", "The Dog Lovers"];
slides[3] = ["photo4.jpg", "Standing Woman"];
slides[4] = ["photo5.jpg", "John, Mary and Jesus"];
//above slide show uses only the defaults
</head>
<br><br>
<table width="792" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td class="topBar"><img src=" width="1" height="24" alt=""></td>
</tr>
<tr>
<td class="centerBar">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<table width="100%" border="0" cellpadding="0" cellspacing="0" bordercolor="#FFFFFF">
<tr>
<td><a href="index.html"><img src=" width="244" height="81" hspace="25" border="0"></a></td>
<td align="right" valign="bottom" class="lightText">

<!-- Navigation //-->
<td align="right" valign="bottom" class=
"lightText"><!-- Navigation //--><a href=
" class="linkText">about</a><img src=" width="1" height="7" hspace="7" />
<a href=" class=
"linkText">services</a><img src=" width="1" height="7" hspace="7" /> <a href=
" class="linkText">case
studies</a><img src=" alt=""
width="1" height="7" hspace="7" /><a href=" class="linkText">b.e. insight</a><img src=" width="1" height="7" hspace="7" /> <a href=
" class=
"linkText">contact</a><img src=" width="1" height="7" hspace="7" /> <a href=
" class="blText">home</a></td>
<td width="30"><img src=" width="30" height="30" alt=""></td>
</tr>
</table>

<!-- End Top Portion //-->

<br><br>

<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="423" height="156">
<img src="new inter_slide(slides2)" width="423" height="156"></div> </td>
<td>
<!-- Welcome Table //-->
<table width="300" border="0" align="center" cellpadding="1" cellspacing="0">
<tr>
<td class="header">welcome.</td></tr>
<tr>
<td class="mdText">
<div align="justify">We truly are the ambassadors for all things business. We believe in a different type of approach when working with our clients. Our services run the gamut of everything your business will need. Our goal is to understand the full needs of your business and developing a lasting relationship</div>
</td>
</tr>
</table>
<!-- End Welcome Table //-->
</td>
<td width="50" height="156" class="rightBar"><img src=" width="50" height="156" alt=""></td>
</tr>
</table>

<!-- End Middle Bar //-->
<br><br>
<table border="0" cellspacing="3" cellpadding="0" align="center">
<tr>
<td width="146" valign="top">

<table width="100%" border="0" align="center" cellpadding="2" cellspacing="0">
<tr>
<td><a href="services"><img src=" width="47" height="44" border="0"></a></td></tr>
<td width="100%" valign="bottom"><a href="services" class="blHeaderLink">consulting.</a></td>
</tr>
<tr>
<td colspan="2" class="smText">
<div align="left">
<p>Our consulting solutions are designed to<br>
improve performance <br>
through specialized training, staff augmentation and successful project delivery. Solutions are customized based on your organizations needs, regardless of size.</p>
</div>
</td>
</tr>
</table>

</td>
<td width="3"><img src=" width="3"></td>
<td width="1" class="spaceBar"><img src=" width="1"></td>
<td width="3"><img src=" width="3"></td>
<td width="146" valign="top">

<table width="100%" border="0" align="center" cellpadding="2" cellspacing="0">
<tr>
<td><a href="services"><img src=" width="47" height="44" border="0"></a></td></tr>
<td width="100%" valign="bottom"><a href="services" class="blHeaderLink">strategy.</a></td>
</tr>
<tr>
<td colspan="2" class="smText">
<div align="left">
<p>We provide years of experience in the areas of start-ups, business &amp; web strategy. We take the time to understand your business, its needs and goals. We then build a plan, based on your strengths and current market conditions. Need help executing the plan? We do that too.</p>
</div>
</td>
</tr>
</table>

</td>
<td width="3"><img src=" width="3"></td>
<td width="1" class="spaceBar"><img src=" width="1"></td>
<td width="3"><img src=" width="3"></td>
<td width="146" valign="top">


<table width="100%" border="0" align="center" cellpadding="2" cellspacing="0">
<tr>
<td><a href="services"><img src=" width="47" height="44" border="0"></a></td></tr>
<td width="100%" valign="bottom"><a href="services" class="blHeaderLink">marketing.</a></td>
</tr>
<tr>
<td colspan="2" class="smText">
<div align="left">
Ask any business what they need, and the first answer will almost always be marketing. A successful marketing program must address the needs of the consumer. We create experiences that will brand and drive sales by engaging your customers.</div>
</td>
</tr>
</table>

</td>
<td width="3"><img src=" width="3"></td>
<td width="1" class="spaceBar"><img src=" width="1"></td>
<td width="3"><img src=" width="3"></td>
<td width="146" valign="top">

<table width="100%" border="0" align="center" cellpadding="2" cellspacing="0">
<tr>
<td><a href="services"><img src=" width="47" height="44" border="0"></a></td></tr>
<td width="100%" valign="bottom"><a href="services" class="blHeaderLink">design.</a></td>
</tr>
<tr>
<td colspan="2" class="smText">
<div align="left">
We&rsquo;ll help you deliver a compelling first impression, and communicate a memorable brand experience that builds customer loyalty. Our design solutions define your corporate values and your all-important relationship with your customers and </div>
</td>
</tr>
</table>

</td>
<td width="3"><img src=" width="3"></td>
<td width="1" class="spaceBar"><img src=" width="1"></td>
<td width="3"><img src=" width="3"></td>
<td width="146" valign="top">

<table width="100%" border="0" align="center" cellpadding="2" cellspacing="0">
<tr>
<td><a href="services"><img src=" width="47" height="44" border="0"></a></td></tr>
<td width="100%" valign="bottom"><a href="services" class="blHeaderLink">development.</a></td>
</tr>
<tr>
<td colspan="2" class="smText">
<div align="left">
<p>Developing effective, revenue-generating websites is what we do best. Solutions range from ecommerce websites, to custom web applications we create solutions based on the specific needs and goals of your business.</p>
</div>
</td>
</tr>
</table>

</td>
</tr>
</table>

<br>
</td>
</tr>
<tr>
<td class="bottomBar">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="30"><img src=" height="24" alt=""></td>
</table></td>
</tr>
</table>
</table>

</html>
 
Your script stuff needs to be in the <head> section as explained on the referenced site. Here is a cut down sample (re-edited from one of my sites). You will need to change the file paths to suit the images on your site
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">[/URL]
<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml">[/URL]
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Your page title</title>
<meta name="language" content="en-UK"/>
<script type="text/javascript">
//If using image buttons as controls, Set image buttons' image preload here true
//(use false for no preloading and for when using no image buttons as controls):
var preload_ctrl_images=true;

//And configure the image buttons' images here:
var previmg='pics/larrow1.gif';
var stopimg='pics/stop1.gif';
var playimg='pics/play1.gif';
var nextimg='pics/rarrow1.gif';
var slides=[];
slides[0] = ["pics/pic1.jpg", "This is my first pic"];
slides[1] = ["pics/pic2.jpg", "This is my second pic"];
slides[2] = ["pics/pic3.jpg", "This is my third pic"];
slides.delay=3000;
slides.pause=1;
slides.nofade=1;
slides.image_controls=1;
slides.no_controls;
</script>
<script src="slides.js" type="text/javascript">
</script>
<link rel="stylesheet" type="text/css" href="standard.css" />
</head>
<body>
<div>
<noscript>
<img src="pics/pic1.jpg" alt="First picture" />
<p>See the gallery page for more pictures</p>
</noscript>
<script type="text/javascript">
new inter_slide(slides)
</script>
</div>
</body></html>

Once you have changed the paths and uploaded the images, slides.js and this page it should just work

___________________________________________________________
If you want the best response to a question, please check out FAQ222-2244 first.
'If we're supposed to work in Hex, why have we only got A fingers?'
Drive a Steam Roller
Steam Engine Prints
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top