[RESOLVED] Show and Hide Layers (images)

[leighchic]

Hi there

I am working on a website. It can be seen here -

http://www.themagickschool.com/leigh/

What i want to happen, is when user clicks on one of the thumbnails, an enlarged image will appear on the right block (onMouseClick). I will create all the individual enlarged images just slightly smaller than the white section of the block, so it sits in nicely. I am going to be using this function alot throughout this website, so i need it to work efficiently.

What is the best way?
Also, this function must work in IE 6 + and Firefox

Help much appreciated!


Ciao
Leigh

[dtm32236]

sounds like you're looking for this (http://www.netlobo.com/div_hiding.html)

[dtm32236]

or you can look at something like this (http://www.cssplay.co.uk/menu/photo_simple). i haven't looked at this code... i'm not sure how complicated it is.

the other one is really simple if you have even the most basic understanding of CSS and JavaScript.

[leighchic]

Hi

Thank u!

It worked for the first one, but now the second one doesnt work. Also, when the user clicks another, the large image needs to be replaced.. so how does that work?

[leighchic]

Oh, i just saw yr second comment. Let me have a look at that.

[leighchic]

:-( Oh goodness.. too complicated. I have looked at the source code, but i dont understand it... it doesnt seem as if there is a break down of how to do it.

[leighchic]

Ive downloaded the code from here:

http://www.stunicholls.com/gallery/left_right_click.html
I would need what they do there, which is the text underneath changing.

I am trying to make sense out of all of it. If you could break it down for me, so i could understand it better, that would be very helpful.

[Centauri]

Did you download the zip files from the link right down the bottom of that site ?

It is essentailly an unordered list where the thiumbnail is a background of the <li> (thumbnail images need to be in the thumbs folder, with file names of th1.jpg, th2.jpg etc, unless you want to change the file names as listed in the left_right_click.css file). Within each <li> there is a div that contains the full size images which are currently linked to Stu's site - replace those file names with your image names. Following each div is a <span> which contains the displayed text - replace the Lorem ipsum text there with your own.

[leighchic]

Yes, i did download the zip files. Thank u for the breakdown!! I will have a go later today and see if i can figure it out!

[leighchic]

I found another solution from another website i worked on a few years ago, which seems to be much simpler. BUT now, my problem is i dont know how to change the descriptions at the bottom each time. Any suggestions?

[leighchic]

I could do with some help again please!

I found this piece of code from another website: http://www.plus2net.com/javascript_tutorial/hide-layer.php

I used it in my code to try show the text layer - which needs to change each time, but it does not work.

At the moment, when you click the first thumbnail, a piece of text should appear beneath the big image, but it doesnt.

What am i doing wrong?

http://www.themagickschool.com/leigh/

[leighchic]

Also, when another thumbnail is clicked, the text layer needs to become hidden again and new text layer needs to appear.

I tried to study http://www.stunicholls.com/gallery/l...ght_click.html

But, its too complicated for me to understand - to integrate into my design

[leighchic]

I want to delete this thread but i dont seem to be able to? what do i do?

[dtm32236]

did you ever get this working? it looks like you did on your site.

and I'm not sure you can delete threads - I'm pretty sure you can't. You'd have to ask a moderator (like LeeU)... why do you want it deleted anyway?

[leighchic]

Yeah, i got it working.. used all sorts of different methods - put them all together, and it works! Miraculously! :-)

I wanted it deleted as i am not working on it anymore. Who do i email to ask?

[dtm32236]

if you really want it deleted, you can Private Message 'LeeU' or any other moderator and ask, but normally all posts remain up even after they're resolved in the case that someone else has a question about the same issue - they can search and find the old thread or they may be referred to it by another user...