Help - Search - Members - Calendar
Full Version: onclick gallery with text and images
HTMLHelp Forums > Programming > Client-side Scripting
Plane_Crazy_4_YHWH
OK, I posted this in the CSS section earlier, but I don't think it will really work without some JS...

Could someone help he figure out how to create a type of gallery that contains text, links, and images, only when clicked?

This is close to what I'm looking for, except I want it to display only when clicked.

http://www.cssplay.co.uk/menu/gallery-large.html

Thanks in advance,

KJ
Frederiek
Have you also taken a look at Stu Nicholls' other site, where he makes use of java script: http://www.stunicholls.com/ ?

You also might be interested in Lightbox (http://www.huddletogether.com/projects/lightbox2/) or Thickbox (http://jquery.com/demo/thickbox/), but you'll need the jQuery javascript library for that one.
pandy
You could also google "javascript+show+hide" and DIY.
Plane_Crazy_4_YHWH
ok, I have found this simple script that almost does the trick...

<script>
function showhide(id){
if (document.getElementById){
obj = document.getElementById(id);
if (obj.style.display == "none"){
obj.style.display = "";
} else {
obj.style.display = "none";
}
}
}
</script>

and then for the effect I wanted, just as an example,

in the body goes:

<a href="#" onclick="showhide('div1'); return(false);">Div1</a>

<div style="display: none;" id="div1">
This text is displayed for div1.
</div>

This works fine, except that when I have multiple divs to show and hide. When a second div is selected, it drops down below the first, and if a third is selected, it drops below the second, and so on...

How could this code be modified so that the first one dissapears when the second is clicked?
pandy
As you would do with "normal" DIVs to make them appear side by side, float them or whatever. Or maybe DIV isn't the best option.
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2009 Invision Power Services, Inc.