Databases
StackOverflow2013
Postsdbo
PO
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Just store a reference to the last displayed item.</p> <p>It doesn't loop through all possible messages, because that is inefficient and is relatively expensive. Note that I didn't verify this in jQuery, be my guest. </p> <pre><code>var lastOpenItem = undefined; $('h1').click(function(){ if( lastOpenItem ) { lastOpenItem.removeClass('showMe'); var curSelect = $(this).next('.parent'); lastOpenItem = ( curSelect == lastOpenItem ) ? undefined : curSelect; } }); </code></pre> <p><br/> On top of that, your code seems redundant to me, as it has twice the same line in both IF and ELSE. I would suggest moving it out of the condition.</p> <pre><code>$('.parent').removeClass('showMe').hide(); </code></pre> <p><br/> I would honestly give your classnames semantic names (up, down,showMe vs. activeMessage, arrowExpand, whatever), but oh well.</p> <p>I would also regroup your HTML, because your dynamic ID's with numbers are not.. so nice. </p> <p><br/> Lastly, you don't have to toggle 2 classes. Give the arrow the class "arrow" or something, and the CSS can be toggled by it's parent state, since they are mutually bounded.</p> <p><br/> HTML:</p> <pre><code>&lt;h1 id="ticket_thread_2" class="ticket_thread_h1 activeMessage"&gt;Thread # 2 &lt;span class="ticket_arrow"&gt;&amp;nbsp;&lt;/span&gt;&lt;/h1&gt; &lt;div class="parent"&gt; &lt;div class="sub_thread"&gt;&lt;p&gt;Thread Messages #2 1&lt;/p&gt;&lt;/div&gt; &lt;div class="sub_thread"&gt;&lt;p&gt;Thread Messages #2 2&lt;/p&gt;&lt;/div&gt; &lt;/div&gt; </code></pre> <p><br/> CSS:</p> <pre><code>.ticket-arrow{ background:url(http://www.gc-cdn.com/personalstylist/down.png) no-repeat; width: 15px; height:10px; display:block } .activeMessage&gt;.arrow { background-image:url(http://www.gc-cdn.com/personalstylist/up.png); }​ </code></pre> <p>I do find it uncommon to use absolute urls for images, I think you should copy them local, unless you wish them to change when gc-cdn.com does change them too..</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload