[Techtalk] script

MelissaL.Wise at mail.state.ky.us MelissaL.Wise at mail.state.ky.us
Fri Apr 11 14:55:39 EST 2003


I was putting the pictures 2 subdirectories into my HTML folder.  If I put
the pictures at the root of the HTML folder where my INDEX.HTML is (which is
the page I want to cycle pictures), it works fine. I changed the img src
paths to reflect the subdirectory in which I had them located it, but it
would only load the first pic, then error out.  

Wolf - try moving your pics to the same folder as the page you're going to
have cycle the pics. See if that works.

-----Original Message-----
From: wolf [mailto:wolf at fluffypuppy.net]
Sent: Friday, April 11, 2003 12:20 PM
To: MelissaL.Wise at mail.state.ky.us
Cc: techtalk at linuxchix.org
Subject: Re: [Techtalk] script


Having the same problem here : )
Just assumed it was me : )

On Friday, April 11, 2003, at 09:56 AM, MelissaL.Wise at mail.state.ky.us 
wrote:

> Thanks Almut. I had wondered about how to do this as well. I used your
> javascript and it works fine if I have it in it's own HTML page. But 
> if I
> use it in an existing HTML page, it just cycles the first picture, 
> then a
> red X box appears. I named the pics frame1.jpg thru frame4.jpg and 
> they are
> all the same size. Any idea why it work when alone but doesn't play 
> well
> with others :) ?
>
> I know little about javascript, so I'm afraid I'm pretty lost. Thanks 
> for
> the help.
>
> -----Original Message-----
> From: Almut Behrens [mailto:almut-behrens at gmx.net]
> Sent: Thursday, April 10, 2003 8:46 PM
> To: techtalk at linuxchix.org
> Subject: Re: [Techtalk] script
>
>
> On Thu, Apr 10, 2003 at 05:21:06PM -0400, wolf wrote:
>>
>> I'd like
>> either something simple in php or javascript (even perl maybe?) that I
>> could enter into an html document that would rotate a series of images
>> every few moments on a web page (without having to re-load the page 
>> for
>> the image to change). Try as I might, I can't seem to figure this out
>> and get it to work : (
>
> PHP or Perl may only be used for server-side scripting, as none of
> the current browsers support these languages (for security reasons...).
>
> For client-side animation stuff (i.e running in the browser), you
> basically have three options: (1) animated gifs, (2) javascript, or
> (3) java applets. Using java applets is the only option if you need
> real image manipulation, like rotating etc. -- but they require a
> certain amount of programming skills (though code templates can be
> downloaded from the web). Moreover they require that the user has a
> working JRE installed, and that s/he has java enabled in the browser.
> Also, they're typically more or less hungry for resources.
>
> Animated gifs and javascript are less powerful, in that they can only
> cycle through a sequence of predefined image frames (to be more 
> precise,
> in javascript you don't necessarily need to "cycle through", you can of
> course load any images in whatever sequence). Those images have to be
> created in advance, each frame seperately. Many image manipulation
> programs can create an animated gif from a number of individual frames.
> On the HTML side those gifs are used just like any other image -- I
> guess they're sufficiently well known, so I don't need to elaborate any
> further on them...
>
> Javascript provides a few more degrees of freedom than gifs, but, as
> with java, it needs to be enabled (though users in general seem to be
> less cautious with javascript than with java, at least that's my
> impression).  Javascript is relatively easy to use, as you can see
> from the following minimal example:
>
> <html>
> <head>
> <script language="JavaScript">
>
> delay = 1000;  // in msec
> n = 4;
>
> imgs = new Array();
>
> for (i=1; i<=n; i++) {
>   // preload images, so they are in the cache
>   imgs[i] = new Image();
>   imgs[i].src = "frame"+i+".jpg";
> }
>
> c = 1;
>
> function nextimg() {
>   document.myimg.src = imgs[c].src;
>   c++;
>   if (c>n) c=1;
> }
>
> </script>
> </head>
>
> <body>
> <img src="frame1.jpg" name="myimg" onload="setTimeout('nextimg()', 
> delay)">
> </body>
> </html>
>
>
> This makes the browser cycle through a set of four predefined images
> frame1.jpg .. frame4.jpg with a configurable delay intervall. I think
> the code is pretty self-explanatory, so a brief explanation should do:
> The "trick" is to supply some "onload" javascript code that gets
> executed when an image finished loading.
> This code - "setTimeout('nextimg()', delay)" - sets a timer which calls
> the function 'nextimg()' after the specified delay. Within the function
> nextimg(), the existing image is replaced by the next one, by assigning
> the new imagename/URL to document.myimg.src, wherein "myimg" is the
> tagname you chose to identify the image. When that new image finished
> loading, onload is executed again, and so on -- you get the idea...
> (btw, images should all have the same size.)
>
> Almut
>
> _______________________________________________
> Techtalk mailing list
> Techtalk at linuxchix.org
> http://mailman.linuxchix.org/mailman/listinfo/techtalk
> _______________________________________________
> Techtalk mailing list
> Techtalk at linuxchix.org
> http://mailman.linuxchix.org/mailman/listinfo/techtalk
>
>
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
Although the module is mathematically correct, the solution is
physically impossible. Either that, or you have actually created mass,
and I will apologize for underestimating your power.

=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=


More information about the Techtalk mailing list