Javascript 单击图像块时在图像块下显示文本块

我想让图像块覆盖文本块，即文本块上的图像块 当我在图像中单击时，它应该显示文本块，并且图像块变得隐藏（可能是为了进一步扩展文本块以显示内容）

注意：文本div应在image div下不可见，单击图像时，文本div应显示，图像将隐藏：

JAVASCRIPT:

$(function(){ 
    $('.close').click(function(){ 
        $('#textDiv').show(); 
        $('#imageDiv').hide(); 
    }); 
 }) 

HTML:

这是图像的文本

如果您想要这样，请查看演示

JQUERY HTML

x
这是图像的文本。。。

执行以下操作：

html

---

你能再具体一点吗？你有任何代码吗？谢谢你的回答-注意文本div在image div下应该是不可见的，单击应该显示的图像，图像将隐藏$（function（）{$（'.close'）。单击（function（）{$（'.#textDiv'）.show（）；$（'.#imageDiv'）.hide（）}）这是图像的文本，谢谢-这部分满足了我的要求，但我需要在文本块上设置关闭按钮，以关闭文本框，并且文本块中包含的滚动条将非常有用，而不是切换效果

<div id="imageDiv" >
   <a href="#" class="close">Close <img src="images/close.png" class="close"></a>
</div> 

<div id="textDiv" style="display:none;">This is the text for the image </div>

$('#imageDiv img').on('click', function(){
    $(this).hide();
    $(this).siblings('#textDiv').show();
});
$('#textDiv .close').on('click', function(){
    $(this).parent('#textDiv').hide();
    $(this).parent().siblings('img').show();
});

<div id="imageDiv" >
   <img src="http://wallpaper-fullhd.com/wp-content/uploads/2013/03/at-the-beach-hd-wallpaper-1920x1200.jpg" class="close" width="200" height="200">
   <div id="textDiv">
       <a class="close">x</a>
       This is the text for the image. ...</div>
</div> 

$('div').click(function(){
   $('div').toggleClass('active'); 
});

<div id="imageDiv" class="active">
    <a href="#" class="close">Close <img src="images/close.png" class="close" /></a>
</div> 

<div id="textDiv" >This is the text for the image </div>

.active{
    display: none;
}