PDA

View Full Version : Ajax Tabs Content script - Non Tabbed Content



Dean
07-19-2007, 01:27 AM
1) Script Title: Ajax Tabs Content script
2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/ajaxtabscontent/


3) Describe problem: After some help. How would I modify this script to allow the first content that is displayed to not be related to one of the Tab names that is shown. When a tab is selected, that tab's content is displayed, but when the page is loaded the initial content (non tab related) is shown.

ddadmin
07-19-2007, 04:57 AM
I'm not sure I understand. Right now you already have a default content that is shown when the page loads, albeit it's associated with a tab. If you're merely wishing to display some other default content, why not just embed it on the page directly like any content on the page?

Dean
07-19-2007, 05:37 AM
My question is to how to make it appear in the "tabbed" content area until a tab is selected.

ddadmin
07-19-2007, 09:33 AM
If all your tabs are ajax tabs that call an external page, you can easily display content within the tabcontentarea that goes away after any of the tabs are clicked. Just insert that content into the tabcontentarea tab:


<ul id="maintab" class="shadetabs">
<li><a href="external.htm" rel="ajaxcontentarea">Bird</a></li>
<li><a href="external2.htm" rel="ajaxcontentarea">Dog</a></li>
<li><a href="external3.htm" rel="ajaxcontentarea">Cat</a></li>
<li><a href="external4.htm" rel="ajaxcontentarea">Sea Otter</a></li>
</ul>

<div id="ajaxcontentarea" class="contentstyle">
<p>This is some \tab content, embedded directly inside this space and not via Ajax. It can be shown until one of the tabs are clicked on. <p>

<p><b><a href="javascript: expandtab('maintab', 2)">Select 3rd tab of "maintab"</a></b></p>
</div>

The code in red is the temporary content. This technique only works if non of your tabs are of the following syntax:


<li class="selected"><a href="#default" rel="ajaxcontentarea">Intro</a></li>

That's because if the script detects that one of the tabs contain the "default" keyword, the inline content inside your tabcontentarea becomes the default content associated with that tab, and can be recalled by clicking on this tab (instead of going away for good).