Displaying a div(has style"display:none") by clicking image in another div

I have 5 images on a div(like thumb images of products). And I'm having another div with briefed tabbed section.

My coding(like below):

1. Div with 5 images.
2. Another Div has 5 tabbed section with its product details.
3. In addition, second div has property style"display:none". I want make it visible to see the clicked thumb for its detailed div section.

开发者_运维百科

Thanks in advance.

---

You can use .show() and .hide() to toggle the 'display:none' to show/hide the div.

---

Here is an example of how to do this.

http://jsbin.com/anere3/3/edit

Hope this helps.

Bob

---

My answer can only get as good as your description.

$("#theDivToBeClickedOn").click(function(){
        $("#theDivWhereImageIs").show();
});

---

I assume you have some other tags that have the specific image descriptions, so you'll have to show/hide them too.

$('#div1 img').click(function(){  //when you click on the thumb in the first div
        var i = $('#div1 img').index(this); //get index of thumb to correspond to image
        $('#div3').toggle(); //show third div
        $('#div3 div').eq(i).toggle(); //show the particular thumb's description
});