Welcome to WebmasterWorld Guest from

Forum Moderators: incrediBILL

Message Too Old, No Replies

Opinion on how to setup an intro page that acts like a screensaver.



3:31 am on Dec 21, 2010 (gmt 0)

5+ Year Member

Hi all,

I'm not asking for code, i'm just asking for guidance or an opinion on how to approach this request.

First the back story.
I have a charities web page where the upper half is a form that allows visitors to select various options in order to display a list (table) of charities from a MySQL database table on the lower half of the page.

What I'd like
I would like to have an intro page that acts like a screen saver when the charities page is inactive for some minutes. As soon as the visitor clicks a picture on the intro screen saver page, the screen saver page is replaced with the charities page.

The problem
Jumping from the intro page to the charities page on mouse click is no problem...

I just don't know how i would determine inactivity on the charities page so it can jump back to the intro page. I know that there is a meta tag i can use to refresh (reload) the page after some time interval, but that's as far as i have gotten.

1. How would i go about setting up a timeout function?
2. would this be a candidate for a frame page?

Any help would be appreciated.


10:47 am on Dec 22, 2010 (gmt 0)

5+ Year Member

Hi nelsonm,

1. Use JavaScript - the entire functionality of this should be created with JS. Anything else would involve reloading pages. With JS you could add all this functionality and not have the page physically reload at all

2. Frames = bad, and it wouldn't be a candidate even if they weren't.

What I'd say though, is this a good idea? Websites turning into a screensaver isn't expected behaviour. Say someone lands on your page and gets a phone call, comes back 5 mins later, Your website as they saw it before is gone, they think the new thing is a pop-up and close it. Remember that many people browse with multiple tabs open and may open new pages in a tab in the background to look at later too.


5:23 am on Dec 23, 2010 (gmt 0)

5+ Year Member

This screen saver page is for a special internal web application at a museum and not for external use.


10:12 am on Dec 23, 2010 (gmt 0)

WebmasterWorld Senior Member 5+ Year Member

you could do a <div> overlay. do position:absolute at the top left corner, and make it appear with ajax. all you'd have to do to make it appear is change one of the CSS styles on the overlay from display:none to display:block


10:38 am on Dec 23, 2010 (gmt 0)

5+ Year Member

@londrum that would be a decent implementation, I'm not sure that classes as AJAX though unless data is retrieved asynchronously from the server


2:45 pm on Dec 23, 2010 (gmt 0)

5+ Year Member

I found this code by Guyon Roche on the internet.com site: [webreference.com...]

The third page has a demo link. It works but seems a bit complicated and i'm still not sure on how to alter it to fit my needs.

In any case, using the <div> w/ display:none/block might work as i remember using something like it on another project years ago. I'll have to dig it up to see.

Featured Threads

Hot Threads This Week

Hot Threads This Month