PDA

View Full Version : Tab Content Script



Rohit Malik
07-18-2007, 08:25 AM
1) Script Title: Tab Content Script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/tabcontent.htm

3) Describe problem:
I was trying to use it at www.delhievents.com ( added the code inside blogger widget which i'm using )
But the href="#" in the code below tries to open the page at my site instead of opening the tab.

<li><a href="#" rel="tcontent2">Tab 2</a></li>

What can be done about it?

Regards, Rohit

ddadmin
07-18-2007, 08:39 AM
Are you trying to add a link inside one of the Tabbed contents that selects a particular tab when clicked on? If so this is also documented in the DD script page:


For example, to create a link that selects the 3rd tab of the Tab Content with UL id="maintab", you could use this code:


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

As you can see, the tab count starts at 0, so 2 references the 3rd tab.

Rohit Malik
07-18-2007, 09:29 AM
No, i was just trying to click on tab to load it's content. You can check the modified code below :



<ul id="maintab" class="shadetabs">
<li class="selected"><a href="javascript: expandtab('maintab', 0)">Tab 1</a></li>

<li><a href="javascript: expandtab('maintab', 1)">Tab 2</a></li>



</ul>

<div class="tabcontentstyle">

<div id="maintab" class="tabcontent">

Tab 1 content here

</div>


<div class="tabcontentstyle">

<div id="maintab" class="tabcontent">

Tab 2 content here

</div>

<script type="text/javascript"><br/>//Start Tab Content script for UL with id="maintab"

Separate multiple ids each with a comma.<br/>initializetabcontent("maintab")<br/></script>

content here

</div>

Rohit Malik
07-18-2007, 09:37 AM
And here is the old code which tries to open a url instead of tabs :
( when i click on a tab, it tries to open http://www.mydomain.com/# instead of the tab )

<ul id="maintab" class="shadetabs">
<li class="selected"><a href="#" rel="tcontent1">Tab 1</a></li>

<li><a href="#" rel="tcontent2">Tab 2</a></li>

</ul>


<div class="tabcontentstyle">

<div id="tcontent1" class="tabcontent">

Tab 1 content here
</div>


<div class="tabcontentstyle">

<div id="tcontent2" class="tabcontent">

Tab 2 content here

</div>
</div>

<script type="text/javascript"><br/>//Start Tab Content script for UL with id="maintab"

Separate multiple ids each with a comma.<br/>initializetabcontent("maintab")<br/></script>