Tabs in module

hallo!

Is it possible to put up tabs in the module?
like on this page:
http://the-magic-fields.proboards.com/

Hello, IdaTR

You mean the on with the text such as "cbox info staff updates links"

Yup ! Thats it!
Is that possible? (:

The CSS code for tabs.

Code:

#tabs_container {
 border-bottom: 1px solid #ccc;
}
#tabs {
 list-style: none;
 padding: 5px 0 4px 0;
 margin: 0 0 0 10px;
 font: 0.75em arial;
}
#tabs li {
 display: inline;
}
#tabs li a {
 border: 1px solid #ccc;
 padding: 4px 6px;
 text-decoration: none;
 background-color: #eeeeee;
 border-bottom: none;
 outline: none;
 border-radius: 5px 5px 0 0;
 -moz-border-radius: 5px 5px 0 0;
 -webkit-border-top-left-radius: 5px;
 -webkit-border-top-right-radius: 5px;
}
#tabs li a:hover {
 background-color: #dddddd;
 padding: 4px 6px;
}
#tabs li.active a {
 border-bottom: 1px solid #fff;
 background-color: #fff;
 padding: 4px 6px 5px 6px;
 border-bottom: none;
}
#tabs li.active a:hover {
 background-color: #eeeeee;
 padding: 4px 6px 5px 6px;
 border-bottom: none;
}

#tabs_content_container {
 border: 1px solid #ccc;
 border-top: none;
 padding: 10px;
}
.tab_content {
 display: none;
}

The HTML code for the tabs.

Code:

<div id="tabs_container">
    <ul id="tabs">
        <li class="active"><a href="#tab1">Tab 1</a></li>
        <li><a href="#tab2">Tab 2</a></li>
        <li><a href="#tab3">Tab 3</a></li>
    </ul>
</div>
<div id="tabs_content_container">
 <div id="tab1" class="tab_content" style="display: block;">
 
 <p>Content for the first tab</p>
    
</div>
<div id="tab2" class="tab_content">
 <p>Content for the second tab</p>
 </div>
    
 <div id="tab3" class="tab_content">
    
 <p>
  Content for the third tab  
 </p>
    
 </div>
    
</div>


Javascript Code for tabs

Code:

$(document).ready(function(){
   $("#tabs li").click(function() {
      //   First remove class "active" from currently active tab
      $("#tabs li").removeClass('active');

      //   Now add class "active" to the selected/clicked tab
      $(this).addClass("active");

      //   Hide all tab content
      $(".tab_content").hide();

      //   Here we get the href value of the selected tab
      var selected_tab = $(this).find("a").attr("href");

      //   Show the selected tab content
      $(selected_tab).fadeIn();

      //   At the end, we add return false so that the click on the link is not executed
      return false;
   });
});

Please post below if you don't understand it.

It's not possible to put recent topics into it too? ^^ or login options?

I'm not sure but let me do some test's on my forum and see what I come up with...

Sure (: I'm waiting then.

Hi, IdaTR

I'm sorry but I can figure this out.

Ah i see  
Well thanks for trying anyway ! (: