One Time Photo Drop-Down

[ksiads]

I'd like to have a photo drop-down from the top of my main page and stop at approximately the middle of the web page. The user could then get rid of the image by clicking on an X in the top-right corner of the photo. The photo WOULD NOT drop down again on subsequent reloads of the main page.

Below is a simplified illustration of what I'd like to do.




Thanks for your help.


Kevin

[gwpriester]

There must be a code that could do this (which is why I am sure you asked).

You could accomplish this in Web Designer 11 Premium or Designer Pro X11 using an animation limited to one time. The photo could fade to white or have a white rectangle slide in front of it.

[Acorn]

The short answer is no.

The long answer is no as Xara web sites do not store any history or session data; they are stateless.
A browser refresh would restart the experience.
You could create a Cookie for this provided the end-user allowed Cookies (and JavaScript).

The Xara way might be to land once on the page and for all links to it thereafter actually point to a sister page that doesn't have the photo drop.
The use of the back key and a revisit to the original page would start it all over but for that sessionand all internal links the page is never revisited.

Acorn

[siran]

As Acorn said this will not work if the user disabled cookies, but you may have a look here: http://oerel.goip.de/onetimepopup
It uses sessionStorage. If you replace it with localStorage you can remember the visit even if the browser is closed and reopened.
The example was taken from another tread so it will display a form after 5 seconds. You can place whatever you want on the pop-up layer.

[Acorn]

As Acorn said this will not work if the user disabled cookies, but you may have a look here: http://oerel.goip.de/onetimepopup
It uses sessionStorage. If you replace it with localStorage you can remember the visit even if the browser is closed and reopened.
The example was taken from another tread so it will display a form after 5 seconds. You can place whatever you want on the pop-up layer.

Cheers siran, are you saying in the Page's Head, you simply change:

if (!sessionStorage.getItem("popupAlreadyOpened")) {
setTimeout(popupopen,5000);
sessionStorage.setItem("popupAlreadyOpened",true);

to

if (!localStorage.getItem("popupAlreadyOpened")) {
setTimeout(popupopen,5000);
localStorage.setItem("popupAlreadyOpened",true);

I've tried it and it seems to work a charm.

Acorn

[siran]

Even if cookies are disabled? I tried in Firefox and it didn't work there.

[Egg Bramhill]

Worked fine for me in FF siran.

Sweet solution and thanks, I've managed to get a page to do exactly as Kevin required thanks for your code.

My coding is rubbish. One thing I can't understand though:

// now call the function that opens the pop-up after a delay of 1000 milliseconds (in this example).
// you can change the value to anything you want. i would recomment 7200000 (which is 2 hours). this actually was the reason i was unhappy with eggs solution. ;-)
// added check for already opened pop-up

Surely, all that changing the timing to 2 hours will mean, is that the pop-up won't display for 2 hours? (never in reality as the visitors not going to hang around that long!)

Local or Session storage don't use cookies?

[Egg Bramhill]

Here's an example of the session option. It will show the pop-up after closing & reopening the page / tab / browser:

http://parkeston.com/pop-up-longevity/session/index.htm

Here's an example of the local option. It will NOT show the pop-up after closing & reopening the page/ tab / browser. In fact it never will again unless some value is passed:

http://parkeston.com/pop-up-longevity/local/index.htm

[siran]

Yes Egg, that was a joke. Just wanted to say that I don't like those pop-up things that have to be clicked away. And your solution in the other thread only allowed for 10 seconds.
It still will not work in FF for me when cookies are disabled. Strange, maybe some other setting is also involved here?

[Egg Bramhill]

I don't like them either siran, they're a pita!

Cookies shouldn't be required, see:

http://www.w3schools.com/html/html5_webstorage.asp