Home/ Questions/Q 6472373
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-25T06:20:12+00:00

I’m trying to create an interface that’s like the right-hand side of what’s shown

  • 0

I’m trying to create an interface that’s like the right-hand side of what’s shown below with jQuery — tabbed/decked messages with header(subject) and footer.
enter image description here

Has anyone done something similar with jQuery or can suggest a direction to approach the problem? I’ve searched on the Web for a while but haven’t found a solution that’s close enough. I ran across the “30 jQuery tabs tutorial” but didn’t find what I am looking for either.

Thanks in advance for your help. Let me know if I can provide more details on what I’m looking for.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Basic ugly idea:

    <!DOCTYPE html>
<html>
<head>
<scriptsrc="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
    jQuery(document).ready(function(){
    $('.thread .head').click(function() {
    $(this).next().slideToggle("fast");
    return false;
    }).next().hide();
    }); 
</script
<meta charset=utf-8 />
<title>basic Idea</title>

<style>
  .thread { width: 300px; border: 1px soildl; }
  .thread h2{ background-color: #CCC; margin: 0; border: 1px solid #FFC;}
  .thread div{ background-color:#FDF; border: 1px solid #000;}
</style>
</head>
<body>
  <div class="thread">
    <h2 class="head">The information here</h2>
    <div>
       blah blah blah blah
    </div>
    <h2 class="head">come other information here</h2>
    <div>
       blah blah blah blah Goo Goo Goo
    </div>
    <h2 class="head">hee hee hee</h2>
    <div>
       ho ho ho ho ho
    </div>    
  </div>
</body>
</html>

    JSBIN

    • 0