This is Interesting: Free Magazines for Graphics designers and webmasters  


Home > Archive > Stylesheets > April 2006 > Help-photo slideshow without Javascript ?





You are viewing an archived Text-only version of the thread. To view this thread in it's original format and/or if you want to reply to this thread please [click here]

Author Help-photo slideshow without Javascript ?
bevoldjling@hotmail.com

2006-04-10, 7:12 pm

Hi !
I need some help in putting together a website for our family
gathering.

Although I'm still pretty "green", I don't think what I need requires
terribly advanced skills ...except for one area that has me right
baffled.

I want to put up a photo album slideshow but I want to stay away from
Flash & Javascript. It just seems that anytime I use them, somebody
in the family has trouble with their browser or security settings.

So, if I tell you want I want to do, could someone maybe tell me
first, if it can be done and, second, HOW it can be done. I'm really
stumped.

I've got a page designed with UL navs both down the left and right
side of the page. In the center of the page is where I want the
"slideshow". The slide show, I want to run through a serials of jpgs,
each with a link/URL that will open in a new window, and each will
also have caption that also links to the same URL. Having the
ability to stop or pause the playing of the show is an option, but I'm
leaning towards not showing the controls on the page.

As I said, I'd really like to do this with CSS/HTML only, but I can't
find any examples other than javascript.

Can anybody help me? Show me a sample ?

Thanks so much !

Jane

dingbat@codesmiths.com

2006-04-10, 7:12 pm


bevoldjling@hotmail.com wrote:

> As I said, I'd really like to do this with CSS/HTML only, but I can't
> find any examples other than javascript.


I don't think it's possible to do this in pure CSS. You need either
JavaScript, Flash or even SMIL (!) because you want a time-related
element to it. I'd suggest downloading some well-known JavaScript -
these things are out there.

I don't think you can even do it particularly well with pure CSS even
without the time-based slideshow. It's certainly possible, but you'd
have to download the whole image set early on and this might be
unacceptable with limited bandwidth. With JavaScript it's quite easy to
download the visible images first, then download the rest in the
background.

Martin Eyles

2006-04-10, 7:12 pm

bevoldjling@hotmail.com wrote:
> Hi !
> I need some help in putting together a website for our family
> gathering.
>
> Although I'm still pretty "green", I don't think what I need requires
> terribly advanced skills ...except for one area that has me right
> baffled.
>
> I want to put up a photo album slideshow but I want to stay away from
> Flash & Javascript. It just seems that anytime I use them, somebody
> in the family has trouble with their browser or security settings.
>
> So, if I tell you want I want to do, could someone maybe tell me
> first, if it can be done and, second, HOW it can be done. I'm really
> stumped.
>
> I've got a page designed with UL navs both down the left and right
> side of the page. In the center of the page is where I want the
> "slideshow". The slide show, I want to run through a serials of jpgs,
> each with a link/URL that will open in a new window, and each will
> also have caption that also links to the same URL. Having the
> ability to stop or pause the playing of the show is an option, but I'm
> leaning towards not showing the controls on the page.
>
> As I said, I'd really like to do this with CSS/HTML only, but I can't
> find any examples other than javascript.
>
> Can anybody help me? Show me a sample ?
>
> Thanks so much !
>
> Jane
>


Try using a meta tag in the header to refresh the page, and direct to a
different url.

see http://www.seologic.com/faq/meta-refresh-tag.php

For this technique, each picture would need to have it's own page. If
you don't want to keep reloading the navigation, then you could run this
in a frame or a new window (using a target property to open the first
page of the slideshow in the appropriate place).

HTH,
Martin
bevoldjling@hotmail.com

2006-04-10, 7:13 pm

On Mon, 10 Apr 2006 18:24:56 GMT, Martin Eyles
<martin.eyles@NOSPAMbigfoot.com> wrote:


>Try using a meta tag in the header to refresh the page, and direct to a
>different url.
>
>see http://www.seologic.com/faq/meta-refresh-tag.php
>
>For this technique, each picture would need to have it's own page. If
>you don't want to keep reloading the navigation, then you could run this
>in a frame or a new window (using a target property to open the first
>page of the slideshow in the appropriate place).
>
>HTH,
> Martin


Hmmm... I had thought about that and, yeah, don't much care for
reloading the nav every time. But, you've got me to wondering...kind
of a variation on the "frames" concept. I could just "call" a page
which in turn would have a redirect after "xx" seconds, and so on and
so on. I'm gonna check that out, 'cause it would really be much
easier for me and much more accessible to the masses.

Thanks a lot !

Jane


bevoldjling@hotmail.com

2006-04-10, 7:13 pm

On 10 Apr 2006 10:25:46 -0700, dingbat@codesmiths.com wrote:

>
>bevoldjling@hotmail.com wrote:
>
>
>I don't think it's possible to do this in pure CSS. You need either
>JavaScript, Flash or even SMIL (!) because you want a time-related
>element to it. I'd suggest downloading some well-known JavaScript -
>these things are out there.
>
>I don't think you can even do it particularly well with pure CSS even
>without the time-based slideshow. It's certainly possible, but you'd
>have to download the whole image set early on and this might be
>unacceptable with limited bandwidth. With JavaScript it's quite easy to
>download the visible images first, then download the rest in the
>background.


Thanks for your input. I'm gonna try and see what progress I can make
with a metatag refresh. Failing that, I'll revert to JavaScript and
those can't view it will simply have to fly from their country to mine
to view it ...now THERE'S a thought !!

Jane
Jim Moe

2006-04-10, 7:13 pm

bevoldjling@hotmail.com wrote:
>
> I want to put up a photo album slideshow but I want to stay away from
> Flash & Javascript. It just seems that anytime I use them, somebody
> in the family has trouble with their browser or security settings.
>
> So, if I tell you want I want to do, could someone maybe tell me
> first, if it can be done and, second, HOW it can be done. I'm really
> stumped.
>

See <http://jalbum.net/>.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)
Johannes Koch

2006-04-10, 7:13 pm

Martin Eyles wrote:
> bevoldjling@hotmail.com wrote:


[Slideshow]

> Try using a meta tag in the header to refresh the page, and direct to a
> different url.


This may also is prohibited according to security settings. In addition
there are accessibility issues with refreshing/redirecting with a
non-null timeout value.

--
Johannes Koch
Spem in alium nunquam habui praeter in te, Deus Israel.
(Thomas Tallis, 40-part motet)
Alan J. Flavell

2006-04-10, 7:13 pm


On Mon, 10 Apr 2006, Johannes Koch wrote:

> Martin Eyles wrote:
>
> [Slideshow]
>
>
> This may also is prohibited according to security settings. In
> addition there are accessibility issues with refreshing/redirecting
> with a non-null timeout value.


Well, yes; but that *is* what many people mean by a "slide show". As
long as the "show" is optional (i.e with an alternative access which
only switches from slide to slide at user request), I don't see that
there is any actionable accessibility fault in also offering the
automatic option. Those who don't want to watch it don't have to;
and, as you say, any users who know it would be a problem for them
could set their client to prohibit meta refresh, as a defence against
stumbling into such a show inadvertently.

IMHO, anyway.
Beauregard T. Shagnasty

2006-04-10, 7:13 pm

bevoldjling@hotmail.com wrote:

> I want to put up a photo album slideshow but I want to stay away from
> Flash & Javascript. It just seems that anytime I use them, somebody
> in the family has trouble with their browser or security settings.


Does your web server have PHP?

brucie gave us a PHP script for a slideshow a couple of years ago that
works well, and with minimal hassle - if you know a bit about PHP.

I could probably dig out the template if you're interested.

--
-bts
-Warning: I brake for lawn deer
bevoldjling@hotmail.com

2006-04-11, 6:59 pm

On Mon, 10 Apr 2006 22:30:48 GMT, "Beauregard T. Shagnasty"
<a.nony.mous@example.invalid> wrote:

>bevoldjling@hotmail.com wrote:
>
>
>Does your web server have PHP?


I'm sure that they do, but I've never used it.
>
>brucie gave us a PHP script for a slideshow a couple of years ago that
>works well, and with minimal hassle - if you know a bit about PHP.


I appreciate the offer. I'm trying to keep this kind of simple 'cause
it's not a business website. Is there a great learning curve
involved? I gather there is more involved than a simple .php file
extension.

>I could probably dig out the template if you're interested.


If you think it is something that I could figure out pretty easily, I
would at least take a look at it. [You could send it to
'nospam'freddielives@hotmail.com [remove 'nospam'].

One problem I have with any Javascript slideshows that I've looked at
is that, once you click on a link from a photo and open the related
page in a new window, the slideshow image is still
"highlighted/selected" in the original window. Since the original
page is just a series of links on either side of the slideshow, I've
just used a metatag refresh, so that the "highlight" disappears by the
time a site visitor returns. It works, but I don't think it's very
slick. Would you agree ?

Thanks !

Jane


Beauregard T. Shagnasty

2006-04-11, 6:59 pm

bevoldjling@hotmail.com wrote:

> On Mon, 10 Apr 2006 22:30:48 GMT, "Beauregard T. Shagnasty"
> <a.nony.mous@example.invalid> wrote:
>
> I'm sure that they do, but I've never used it.
>
> I appreciate the offer. I'm trying to keep this kind of simple
> 'cause it's not a business website. Is there a great learning curve
> involved?


Learning curve? No, I don't think so, as long as you understand relative
paths, and what a CSS file is.

> I gather there is more involved than a simple .php file extension.


If your server/host *has* PHP but it doesn't run the script, ask them.

>
> If you think it is something that I could figure out pretty easily, I
> would at least take a look at it. [You could send it to
> 'nospam'freddielives@hotmail.com [remove 'nospam'].


Here is link to template script. Copy it, save as 'slideshow.phps' then
make another copy of it with your chosen file name, with a '.php'
extension, without the trailing 's'. Work on this file, not the
template.
http://k75s.home.att.net/ss/slideshow.phps

Add your expected variable names (paths, number of images etc) and your
image file names and captions.

and the associated style sheet:
http://k75s.home.att.net/ss/slides.css

> One problem I have with any Javascript slideshows that I've looked at
> is that, once you click on a link from a photo and open the related
> page in a new window, the slideshow image is still
> "highlighted/selected" in the original window. Since the original
> page is just a series of links on either side of the slideshow, I've
> just used a metatag refresh, so that the "highlight" disappears by
> the time a site visitor returns. It works, but I don't think it's
> very slick. Would you agree ?


As brucie's script does not open a new window, the above is not a
problem.

Where is brucie these days?

--
-bts
-Warning: I brake for lawn deer
bevoldjling@hotmail.com

2006-04-11, 6:59 pm

On Tue, 11 Apr 2006 13:31:44 GMT, "Beauregard T. Shagnasty"
<a.nony.mous@example.invalid> wrote:
>
>Here is link to template script. Copy it, save as 'slideshow.phps' then
>make another copy of it with your chosen file name, with a '.php'
>extension, without the trailing 's'. Work on this file, not the
>template.
>http://k75s.home.att.net/ss/slideshow.phps
>
>Add your expected variable names (paths, number of images etc) and your
>image file names and captions.


Cool looking

I've looked at this briefly for now (I "do" have a full-time
job...darnitall !!). Is there a way that I can add a link to each of
the photos. e.g., I would like photos to click on Gramma's photo a
page would open in a new window that details her branch of the family
tree. I'm not the coding expert I wish I were, so can you give me
some pointers on how to do this ?

>As brucie's script does not open a new window, the above is not a
>problem.


....I wonder whether the above new window would cause the same
problem.

Thanks so much for your help.

Jane

Beauregard T. Shagnasty

2006-04-11, 11:02 pm

bevoldjling@hotmail.com wrote:

> On Tue, 11 Apr 2006 13:31:44 GMT, "Beauregard T. Shagnasty"
> <a.nony.mous@example.invalid> wrote:
>
> Cool looking


Thank brucie. ;-)

> I've looked at this briefly for now (I "do" have a full-time
> job...darnitall !!). Is there a way that I can add a link to each of
> the photos. e.g., I would like photos to click on Gramma's photo a
> page would open in a new window that details her branch of the family
> tree.


Then it wouldn't be a slideshow. I suppose the template could be altered
to add a clickable link to the .jpg file that would open in a new
window.

> I'm not the coding expert I wish I were, so can you give me
> some pointers on how to do this ?


It should be fairly easy to add an <a href...> and </a> around the <img
element in the variable $Showslide , with a target="_blank" attribute.

Unfortunately, I'm fairly busy trying to remodel a new house and sell
the old one.

>
> ...I wonder whether the above new window would cause the same
> problem.


If your visitors want to view one photo for a longer time than the
number of seconds they chose, clicking the Stop link will keep it in
front of them for as long as they have the browser open.

(Personally, I don't care for new windows. <g> )

> Thanks so much for your help.


You're welcome. I like this script for a few reasons: a) it does not
depend upon any server-side code, b) not server-intensive, and c) it's
fast.

--
-bts
-Warning: I brake for lawn deer
Beauregard T. Shagnasty

2006-04-11, 11:02 pm

Beauregard T. Shagnasty replied to hisself:

> It should be fairly easy to add an <a href...> and </a> around the <img
> element in the variable $Showslide , with a target="_blank" attribute.
>
> Unfortunately, I'm fairly busy trying to remodel a new house and sell
> the old one.


Ok, I'm not so busy. <g> See the update to the script.

http://k75s.home.att.net/ss/slideshow.phps

There is now a second line for the $Showslide variable. You could
comment out the first and uncomment the second, to have a clickable
image that would open that image in a new window.

Note that the slide show would continue to run in the original window,
and I don't think I want to try and stop that if ...

--
-bts
-Warning: I brake for lawn deer
kenacngd@yahoo.com

2006-04-11, 11:02 pm

Yep, it's really bother to make photo slideshow with Javascript. What
kind of software are you using to make photo slideshow? Have you ever
used Flash SlideShow Builder?

Have a look! http://www.photo2vcd.com/flash-slide-show.html
and here are some samples http://www.photo2vcd.com/other/showcase.html

Hope it would help. Enjoy~

Beauregard T. Shagnasty

2006-04-11, 11:02 pm

kenacngd@yahoo.com wrote:

> Yep, it's really bother to make photo slideshow with Javascript. What
> kind of software are you using to make photo slideshow? Have you ever
> used Flash SlideShow Builder?
>
> Have a look! http://www.photo2vcd.com/flash-slide-show.html and here
> are some samples http://www.photo2vcd.com/other/showcase.html
>
> Hope it would help. Enjoy~


Looks interesting, but it cost 40 bucks. (33 Euros) :-(

--
-bts
-Warning: I brake for lawn deer
bevoldjling@hotmail.com

2006-04-12, 6:47 pm

On Wed, 12 Apr 2006 00:13:27 GMT, "Beauregard T. Shagnasty"
<a.nony.mous@example.invalid> wrote:

>Beauregard T. Shagnasty replied to hisself:
>
>
>Ok, I'm not so busy. <g> See the update to the script.
>
>http://k75s.home.att.net/ss/slideshow.phps
>
>There is now a second line for the $Showslide variable. You could
>comment out the first and uncomment the second, to have a clickable
>image that would open that image in a new window.


You are too good !! Thanks heaps !
>
>Note that the slide show would continue to run in the original window,
>and I don't think I want to try and stop that if ...


That's not a problem to me....I kinda like it that way !

Too cool ! Thanks again !

Jane

bevoldjling@hotmail.com

2006-04-12, 6:47 pm

On Wed, 12 Apr 2006 02:41:25 GMT, "Beauregard T. Shagnasty"
<a.nony.mous@example.invalid> wrote:

>kenacngd@yahoo.com wrote:
>
>
>Looks interesting, but it cost 40 bucks. (33 Euros) :-(


Not in the cards for me ... $$$ !

> -Warning: I brake for lawn deer


What about flamingos & gnomes ??? Luv the sig !!

Jane


Beauregard T. Shagnasty

2006-04-12, 6:47 pm

bevoldjling@hotmail.com wrote:

> On Wed, 12 Apr 2006 02:41:25 GMT, "Beauregard T. Shagnasty"
> <a.nony.mous@example.invalid> wrote:
>
> Not in the cards for me ... $$$ !
>
>
> What about flamingos & gnomes ??? Luv the sig !!


Pink ones and lawn gnomes? :-0

--
-bts
-While motorcycling, never follow a pig truck
Beauregard T. Shagnasty

2006-04-12, 6:47 pm

bevoldjling@hotmail.com wrote:

>
> You are too good !! Thanks heaps !


You're welcome. I tested it (clickable image) on one of my uses of the
script, and it works ok, other than the noted situation that the new
window could completely cover the running show - especially if the
visitor has their browser maximized. This is the reason why 'new
windows' are never a good idea.

Oh, one more point. As written, this script works best with an image of
640px wide. I've never tried to use it with larger images.

--
-bts
-Warning: I brake for lawn deer
Bruce Lewis

2006-04-13, 7:01 pm

bevoldjling@hotmail.com writes:

> I want to put up a photo album slideshow but I want to stay away from
> Flash & Javascript. It just seems that anytime I use them, somebody
> in the family has trouble with their browser or security settings.


If it's to be shown at a family gathering, why would this be an issue?
You'd just be using one computer for the slide show.

If it is for everybody to look at photos from the family gathering
later, then why slide show format? The only reason to go through photos
at a fixed pace is to let a group look at them together. One or two
people at a computer would want to look at each photo for a different
amount of time, depending on their interest.

I've come to think the best "slide show" interface for individuals is
the scroll bar. Not only can you control the pace of going from picture
to picture, going backward and forward is easy. You can even zoom
forward and back to compare two pictures far away from each other in
sequence.

This is also the most low-tech web solution, as you simply put 640x480
or slightly larger photos all on one page vertically.

In my experience, almost everyone likes photos, but most people roll
their eyes about slide shows.

--

http://ourdoings.com/ Easily organize and disseminate news and
photos for your family or group.
bevoldjling@hotmail.com

2006-04-19, 6:44 pm

On Wed, 12 Apr 2006 14:33:48 GMT, "Beauregard T. Shagnasty"
<a.nony.mous@example.invalid> wrote:

>bevoldjling@hotmail.com wrote:
>
>
>You're welcome. I tested it (clickable image) on one of my uses of the
>script, and it works ok, other than the noted situation that the new
>window could completely cover the running show - especially if the
>visitor has their browser maximized. This is the reason why 'new
>windows' are never a good idea.
>
>Oh, one more point. As written, this script works best with an image of
>640px wide. I've never tried to use it with larger images.


I hope that you are not cramped for space & can keep the links you
provided active for a while.

I've had a real crunch come down at work & I'm firing on all cylinders
as it is. As long as I know those links will stay there, I hope to
get back to them in a couple of weeks. Is that okay with you?

Thanks again !


Beauregard T. Shagnasty

2006-04-19, 6:44 pm

bevoldjling@hotmail.com wrote:

> I hope that you are not cramped for space & can keep the links you
> provided active for a while.


Sure, but you could copy the scripts to a safe place on your computer.
They aren't very large files.

> I've had a real crunch come down at work & I'm firing on all
> cylinders as it is. As long as I know those links will stay there, I
> hope to get back to them in a couple of weeks. Is that okay with
> you?


Yes. I'm a fair bit under my limit at that free web space at the moment.

> Thanks again !


You're welcome.

--
-bts
-Warning: I brake for lawn deer
Sponsored Links


Copyright 2003 - 2008 forum4designers.com  Software forum  Computer Hardware reviews