471,624 Members | 1,865 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 471,624 software developers and data experts.

Div display state changes

I have been developing an image gallery which needed to be dynamic as
possible.

so I have placed the gallery in a div plus a div containing the large
image to be displayed. It works by changing the display property of the
gallery div to 'none' and the largeImage div to 'block' which has an
affect of switching pages but obviously saving time developing a single
page for each large Image, but (cliche') when I refresh the page the
with the large Image div displaying 'block' it reverts the gallery and
largeImage display's back to their default states.

how can i prevent these states from reverting back to their default
states?

Here is the code example:
script language="javascript" type="text/javascript">
<!--
function displayImage(imgSrc){
document.getElementById('theGallery').style.displa y = 'none';
document.getElementById('imageContainer').style.di splay = 'block';
var image = document.getElementById('largeImage');
image.src = imgSrc;
}

function displayGallery(){
document.getElementById('theGallery').style.displa y = 'block';
document.getElementById('imageContainer').style.di splay = 'none';
}
//-->
</script>

</head>

<body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">

<div id="imageContainer" style="display:none; position:relative;
top:10px; text-align:center;">
<img id="largeImage" alt="Playboy UK Babes" title="Playboy UK
Babes"><br>
<a href="enable.html" onClick="displayGallery(); return false;">Go
back</a>
</div>
<div id="theGallery" style="display:block;">
<a href="enable.html" onClick="displayImage('imgs/large/large1.jpg');
return false;">
<img src="imgs/thumbs/thumb1.jpg" width="90" height="120" border="0">
</a></div>

Feb 3 '06 #1
4 2185
DoomedLung said the following on 2/3/2006 7:08 AM:
I have been developing an image gallery which needed to be dynamic as
possible.

so I have placed the gallery in a div plus a div containing the large
image to be displayed. It works by changing the display property of the
gallery div to 'none' and the largeImage div to 'block' which has an
affect of switching pages but obviously saving time developing a single
page for each large Image, but (cliche') when I refresh the page the
with the large Image div displaying 'block' it reverts the gallery and
largeImage display's back to their default states.

how can i prevent these states from reverting back to their default
states?


Set a cookie with "state" in it. When the page is loaded, read the
cookie and set the corresponding state in the page.

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Feb 3 '06 #2

Randy Webb wrote:
DoomedLung said the following on 2/3/2006 7:08 AM:
I have been developing an image gallery which needed to be dynamic as
possible.

so I have placed the gallery in a div plus a div containing the large
image to be displayed. It works by changing the display property of the
gallery div to 'none' and the largeImage div to 'block' which has an
affect of switching pages but obviously saving time developing a single
page for each large Image, but (cliche') when I refresh the page the
with the large Image div displaying 'block' it reverts the gallery and
largeImage display's back to their default states.

how can i prevent these states from reverting back to their default
states?


Set a cookie with "state" in it. When the page is loaded, read the
cookie and set the corresponding state in the page.

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/


Hey Randy, cheers for the speedy response but I forgot to mention that
I've tried that method already and it didn't work!?

Feb 3 '06 #3
DoomedLung said the following on 2/3/2006 7:26 AM:
Hey Randy, cheers for the speedy response but I forgot to mention that
I've tried that method already and it didn't work!?


Then you did it wrong. And know that cookies are not always accepted.
Reading/writing a cookie is the only way you are going to be able to
track state of a dynamic page from the client side.

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Feb 3 '06 #4

Randy Webb wrote:
DoomedLung said the following on 2/3/2006 7:26 AM:
Hey Randy, cheers for the speedy response but I forgot to mention that
I've tried that method already and it didn't work!?


Then you did it wrong. And know that cookies are not always accepted.
Reading/writing a cookie is the only way you are going to be able to
track state of a dynamic page from the client side.

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/


ok, thanks.

Feb 3 '06 #5

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

19 posts views Thread by dmiller23462 | last post: by
4 posts views Thread by RL Stevenson | last post: by
3 posts views Thread by Marc Robitaille | last post: by
5 posts views Thread by Sean | last post: by
3 posts views Thread by DoomedLung | last post: by
70 posts views Thread by Anson.Stuggart | last post: by
reply views Thread by leo001 | last post: by

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.