Layers and Behaviors

G

Guest

Hi

I created layers of photos (6 linked photos) I would like to rotate on my website. I need to know what behavior to use to make the photos rotate. I do not need mouse over. Just plain banner/ad rotator as was available in FP2002. Can this be done with FP2003

Thank yo
Greg
 
J

Jim Buyens

-----Original Message-----
Hi,
Howdy.

I created layers of photos (6 linked photos) I would
like to rotate on my website. I need to know what
behavior to use to make the photos rotate. I do not need
mouse over. Just plain banner/ad rotator as was
available in FP2002. Can this be done with FP2003?
Thank you
Greg
Click to expand...

I presume you want the photos to change based on time.
FrontPage behaviors really don't support timers but here's
a page that rotates six pictures, advanding to the next
every 5000 miliseconds.

<html>
<head>
<title>Rotate Pictures</title>
<script language="JavaScript">
picNr = 0;
picName = new Array("bear_cub.jpg",
"cow.jpg",
"dog.jpg",
"cat.jpg",
"moose.jpg",
"alligator-1.jpg");

function rotatePics(){
document.rotating.src = "images/" + picName[picNr];
if (picNr < picName.length - 1) {
picNr = picNr + 1;
}else{ picNr = 0;
} setTimeout("rotatePics();",5000);
}
</script>
</head>
<body onLoad="rotatePics();">
<img name="rotating" border="0"
src="images/alligator-1.jpg">
</body>
</html>

Jim Buyens
Microsoft FrontPage MVP
http://www.interlacken.com
Author of:
*----------------------------------------------------
|\---------------------------------------------------
|| Microsoft Office FrontPage 2003 Inside Out
||---------------------------------------------------
|| Web Database Development Step by Step .NET Edition
|| Microsoft FrontPage Version 2002 Inside Out
|| Faster Smarter Beginning Programming
|| (All from Microsoft Press)
|/---------------------------------------------------
*----------------------------------------------------
 
V

Vidar Petursson

Hi

This will preload image before showing

<html>
<head>
<title>Img rotator</title>
<script>
var iDispL = 1000*10;// Time to display img
var iCnt = 0;
function getNewImg(){
var a = new Array("i1.gif",
"i2.jpg",
"i3.jpg");// Images in slideshow
var i = new Image();
i.src = ("IMAGEPATH/" + a[iCnt]);
i.onload = showImg;
i.onerror = errHandler;
iCnt = ( iCnt < a.length-1) ? ++iCnt : 0;
window.status = "Preloading next image";
}
function showImg(){
document.images["myImg"].src = this.src;
setTimeout("getNewImg()",iDispL);
}
function errHandler(){
window.status = "Failed to load image, trying to load another one";
setTimeout("getNewImg()",iDispL);
}
</script>
</head>
<body onload="setTimeout('getNewImg()',iDispL)">
<img name="myImg" src="i3.jpg">
</body>
</html>

Enjoy

--
Best Regards
Vidar Petursson
==============================
Microsoft Visual: Scripting MVP 2000-2004
http://www.icysoft.com/
http://www.deus-x.com/ Instant e-commerce
http://www.microsoft.com/technet/scriptcenter/
Playground: http://213.190.104.211/ ( IE 5.5+ only )

No matter where you go there you are
==============================
 
V

Vidar Petursson

Hi

Slow day here so I added effects for the slideshow in Explorer
rather than doing nothing :)

<html>
<head>
<title>Img rotator</title>
<script>
var iDispL = 1000*10;// Time to display img
var iCnt = 0;

function getNewImg(){
if(!document.images) return;
window.status = "Preloading next image";
var a = new Array("b1.gif","b2.gif","b3.jpg");
var i = new Image();
i.src = "PATH/" + a[iCnt];
i.onload = showImg;
i.onerror = errHandler;
iCnt = ( iCnt < a.length-1) ? ++iCnt : 0;
}

function showImg(){
window.status = "Image ready";
var img = document.images["myImg"];
if(document.all && createPopup &&
navigator.appName.toLowerCase().indexOf("explorer") > -1)
{
img.style.filter = "revealTrans(transition=" + Math.floor( Math.random()
* 23 ) + ",duration=1.0)";
img.filters[0].Apply();
img.src = this.src;
img.filters[0].Play();
}
else img.src = this.src;
setTimeout("getNewImg()",iDispL);
}

function errHandler(){
window.status = "Failed to load image";
setTimeout("getNewImg()",iDispL);
}
</script>
</head>
<body onload="setTimeout('getNewImg()',iDispL)">
<img name="myImg" src="images/b3.jpg">
</body>
</html>

Hope you feel it's useful

--
Best Regards
Vidar Petursson
==============================
Microsoft Visual: Scripting MVP 2000-2004
http://www.icysoft.com/
http://www.deus-x.com/ Instant e-commerce
http://www.microsoft.com/technet/scriptcenter/
Playground: http://213.190.104.211/ ( IE 5.5+ only )

No matter where you go there you are
==============================
 
S

Stefan B Rusynko

You just need the script part (in Html/Code view in the HEAD section) and the body onload
- replace his image names w/ the path/imagesnames you have

--




| Jim,
|
| I'm still a bit confused. You said insert this code into my html page. I'm not all that quite sure how to do this in FP2003. In
previous versions of FP or FP Express all you had to do was go to the tools menu and select INSERT=>JAVA SCRIPTS. You are presented
with a box to copy and paste the code. Frontpage places the code in the correct place. I say this because I am not all that good
with raw html. I intend to place this code in my home page and of course with other information. I also see you have a title for
the page. But the page I want to insert the code already has a title. Finally, the images I plan to use for this ad rotator are
already in Frontpage image folder. Are you saying just replace the names you have here with mine. I take it I do not require any
url refrence to the image since they are in FrontPage image folders?
|
| Thank you
| Greg
|
| ----- Jim Buyens wrote: -----
|
| >-----Original Message-----
| >Hi,
|
| Howdy.
|
| >I created layers of photos (6 linked photos) I would
| >like to rotate on my website. I need to know what
| >behavior to use to make the photos rotate. I do not need
| >mouse over. Just plain banner/ad rotator as was
| >available in FP2002. Can this be done with FP2003?
| >Thank you
| >Greg
|
| I presume you want the photos to change based on time.
| FrontPage behaviors really don't support timers but here's
| a page that rotates six pictures, advanding to the next
| every 5000 miliseconds.
|
| <html><head><title>Rotate Pictures</title><script language="JavaScript">
| picNr = 0;
| picName = new Array("bear_cub.jpg",
| "cow.jpg",
| "dog.jpg",
| "cat.jpg",
| "moose.jpg",
| "alligator-1.jpg");
|
| function rotatePics(){
| document.rotating.src = "images/" + picName[picNr];
| if (picNr < picName.length - 1) {
| picNr = picNr + 1;
| }else{ picNr = 0;
| } setTimeout("rotatePics();",5000);
| }
| </script></head><body onLoad="rotatePics();"><img name="rotating" border="0"
| src="images/alligator-1.jpg"></body></html>
|
| Jim Buyens
| Microsoft FrontPage MVP
| http://www.interlacken.com
| Author of:
| *----------------------------------------------------
| |\---------------------------------------------------
| || Microsoft Office FrontPage 2003 Inside Out
| ||---------------------------------------------------
| || Web Database Development Step by Step .NET Edition
| || Microsoft FrontPage Version 2002 Inside Out
| || Faster Smarter Beginning Programming
| || (All from Microsoft Press)
| |/---------------------------------------------------
| *----------------------------------------------------
|
|
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Behaviors for layers 10
Layers and behaviors 2
Creating banner ad with server technology in FrontPage 1
Help with layers and behaviors 21
Layers and Behaviors for Menus 3
FP2003 Layers and Behaviors 6
FrontPage 2003 Layer Question 0
Layers/behaviors- Flashing/Flickering Dynamic Menu System 10

Top