"andy johnson" <andrew.johnson@chicagonet.net> wrote in message news:o28ijvo5ntgl5bdnl6oi72ohq9uhqcgf7v@4ax.com...
On Tue, 12 Aug 2003 08:12:07 -0700, "George Ziniewicz" <zin1@cox.net>
wrote:
[color=blue]
>
>"George Ziniewicz" <zin1@cox.net> wrote in message
>news:1c6_a.55870$Ne.16097@fed1read03...[color=green]
>>
>> "christian" <ozric@web.de> wrote in message
>> news:1a3a333a.0308120414.4fd9e343@posting.google.c om...[color=darkred]
>> > Hi,
>> >
>> > i'm getting no success, with my attempt
>> > displaying some pictures one after another
>> > for i.e. some seconds.[/color]
>>
>> Generally the way it is done is for you to place the pic names in an
>> array, and sequentially load them via a timer() using an incrementing
>> counter as an array index. Here is an IE slideshow I wrote:
>>
>>
http://zintel.com/picsel.html
>>
>> Another version:
http://zintel.com/snaps.html
>>
>>[/color][/color]
So, for those of me who are not java literate but trying to grasp it,
can you post a stand alone working script ???
Here is a fairly minimal slideshow (the minimum I would do), featuring a table centered pic, selectable delay, click to hold/continue, and onscreen info. All that needs changing is to set "base" to the basepath of your images like 'myFolder/birthday/') and put the pic names in the pic array list like 'file1.jpg','file1.gif' ...:
btw, here is a new "fullscreen" slideshow I posted today, I tried for cross-browser but w/ IE features, with zoom, filters, draggable and hideable menu, scrolling div info, etc:
http://zintel.com/cb_start.html
zin
---------------------------------------------------
<html><head><title>Minimal Slide Show</title>
<!-- --- style for a dark background, optional --- -->
<style type='text/css'>
body{
color:#FFFFFF;
background-color:#111111;
}
input{
text-align:center;
}
</style>
<!-- ------- script for slideshow functions ------- -->
<script type='text/javascript'>
<!-- hide script content from old browsers
var base='snaps/'; // base dir of images
var pics=new Array( // list of file names in dir to show
"k6077.jpg","k6080.jpg","k6086.jpg","k6088.jpg","k 6094.jpg"
);
var on=1; // run flag
var picnum=-1; // current pic #
var timerID=0;
var interval=3000; // 3 second delay
//----------------------------------------------------------
//----------------------------------------------------------
//----------------------------------------------------------
function advance() { // move to the next pic:
picnum+=1; // increment
picnum%=pics.length; // wraparound if necessary
}
//----------------------------------------------------------
function show() { // show current pic:
document.pic.src=base+pics[picnum]; // load it
document.pic.alt=pics[picnum]; // update alt
update();
}
//----------------------------------------------------------
function timer() {
if (on) { // if running
advance(); // next one
show(); // show it
}
timerID=setTimeout('timer()',interval); // next time
}
//----------------------------------------------------------
function toggle() {
switch (on) {
case 0: // if off
on=1;
advance();
show();
update();
timer();
break;
case 1: // if on
on=0;
update();
clearTimeout(timerID);
break;
}
}
//----------------------------------------------------------
function update() { // update onscreen info
var str;
if (on) {
str='PLAY: ';
document.myForm.myText.style.backgroundColor='whit e';
} else {
str='HOLD: ';
document.myForm.myText.style.backgroundColor='yell ow';
}
document.myForm.myText.value=str+pics[picnum]; // name
}
//----------------------------------------------------------
// ...end hiding content from old browsers -->
</script>
</head>
<!-- ----------------------------------------------------- -->
<!-- ----------------------------------------------------- -->
<!-- ----------------------------------------------------- -->
<body onLoad='timer();'>
<center>
<!-- --------------- form for widgets --------------- -->
<form name='myForm' onSubmit='return false'>
<input type='text' name='myText' width='20'>
Delay:
<select onChange='clearTimeout(timerID);
interval=(selectedIndex+1)*1000; timer();'>
<option>1 <option>2 <option selected='selected'>3
<option>4 <option>5 <option>6 <option>7 <option>8
</select>
Sec.
Click Pic to Hold or Continue
<br />
</form>
<!-- --------- table to hold a centered pic --------- -->
<table align='center' valign='middle' height='100%' border='0'>
<tr><td align='center' valign='middle'>
<img src='' name='pic' id='pic' onClick='toggle();'>
</td></tr>
</table>
</center>
</body>
</html>
