使用jQuery显示无/块问题

在我的网页中，我必须在每一列中列出几篇文章，请参见下面的HTML代码。我正在做一个反应灵敏的设计。当视口大小大于800 px时，文本通过

display:block可见，但当视口低于800 px时，文本将隐藏在
显示：无在CSS3代码中。当文本被隐藏时，一个带加号的按钮将以与
display:block相同的方式添加而不是文本。当用户单击加号按钮时，通过jQuery
slideToggle
再次显示文本。到目前为止还不错

但我遇到的一个非常令人困惑的问题是，当我调整浏览器窗口的大小时，一切都很好，直到我单击其中一个加号来查看隐藏的文本，然后单击减号按钮来隐藏文本。但是，当我再次向上调整浏览器的大小时，文本将永远隐藏，但仅限于我单击的这篇文章！？我够清楚了吗？有什么问题吗？我已经盯着代码看了很长时间了，但我没发现出什么问题。有人可以吗

jQuery：

     $('div.plus').click(function(e){
    e.preventDefault();
    var article = $(this).parents('article');
    var extras = article.find('div.text').slideToggle('fast'); 
    var img = article.find('.plus img');
        if(img.attr('src') == "bilderGuide/bilderLayout/plus.png") {
        img.attr('src','bilderGuide/bilderLayout/minus.png');
        }
        else {
        img.attr('src','bilderGuide/bilderLayout/plus.png');
        }
    });

HTML:



尝试切换类，而不是使用幻灯片切换。这样，元素永远不会得到内联样式，因此问题就不存在了

jQuery设置元素
当隐藏它时，内联样式将否决css样式，因此您的css无法重新打开

如果您想要幻灯片动画，请使用css3
transition:max height 1s从0转到某个值。高度不起作用，
最大高度：自动。可能在将来某个时候。
“但是当我再次向上调整浏览器的大小时，文本将永远隐藏，但仅限于我单击的这篇文章！？”因此文本是隐藏的，您希望在调整大小时它可见吗？你期望的行为是什么？我不明白。你能提供一个JSFIDLE复制你的问题吗？如果我的问题不清楚，很抱歉。我的意思是，当我调整浏览器大小时，文章中的文本会隐藏或显示，具体取决于视口大小是否低于或高于800像素。但对于我点击的文章，什么都没有发生，文本一直隐藏，而当我调整窗口大小时，所有其他未点击的文章都隐藏或可见。糟糕，我传递了你所说的部分。看@Martijn的回答嗯，很有趣，但是你切换一个类是什么意思？一些示例代码？
article.find（'div.text'）.toggleClass（'someClassName'）好，但是文本不是.text类吗？你给了你想要切换的元素
.toggleClass（）
现在对我来说没有任何效果了！我太累了！我明天还要继续。现在我不明白脚本如何使用var extras=。。。部分该变量在以后的代码中没有使用，或者我在这里完全错了！？：(
<article>
<header>
<img src="image.jpg" alt=""/>
    <div class="articleContent">
        <div class="imageTextContainer">
        </div>
        <h2>H1</h2>
        <div class="text">
        <p>
        Text here
        </p>
        </div>
        <div class="articleContentArrow"></div>
        <div class="plus"><a href="#"><img src="plus.png" /></a></div>
    </div>