javascript - 单击文本时打开和关闭 div 以显示图像 javascript

Question

我使用此 JavaScript 在单击文本时打开包含图像的 div http://jsfiddle.net/BfMDL/1/

我的脚本:

$(document).ready(function() {
    $('.image_trombi').hide();

    $('.titre').click(function() {
        $('.image_trombi').slideUp();
        $(this).next().slideToggle();
        return false;        
    });
});

我的html

<div><a href="#" class="titre">image 1</a><div class="image_trombi"><img src="http://lorempixel.com/output/fashion-q-c-200-200-9.jpg" class="trombi_anim"/></div>
<div><a href="#" class="titre">image 2</a><div class="image_trombi"><img src="http://lorempixel.com/output/fashion-q-c-200-200-5.jpg" class="trombi_anim"/></div>
<div><a href="#" class="titre">iamge 3</a><div class="image_trombi"><img src="http://lorempixel.com/output/sports-q-c-200-200-5.jpg" class="trombi_anim"/></div>

它工作得很好，但我希望再次单击链接后关闭 div。

因此，单击“image1”，打开图像 1，然后再次单击“image1”关闭图像 1...等等...

Answer 1

仅使用 slideToggle() 正如您所做的那样 slideToggle()您不需要 slideUp() 该图像容器。

$('.titre').click(function() { 
    $(this).next().slideToggle();
    return false;        
});

Fiddle Demo