PDA

View Full Version : Ajax tabs Content - How not to load external page



pmalerba
03-15-2007, 12:45 PM
1) Script Title: Ajax Tabs Content script
2) Script URL (on DD):
http://www.dynamicdrive.com/dynamici...axtabscontent/

3) Describe problem:
Hi to everyone! This is my first post! Congratulation to DD staff!

I'm using this script in this way:




<div id="1">

<ul id="maintab" class="shadetabs">
<li class="selected"><a href="#default" rel="ajaxcontentarea">Lorem Ipsum Lorem Lorem Ipsum</a></li>
<li><a href="lorem.htm" rel="ajaxcontentarea">Lorem Ipsum Lorem Lorem Ipsum</a></li>
<li><a href="lorem.htm" rel="ajaxcontentarea">Lorem Ipsum</a></li>

</ul>

<div id="ajaxcontentarea" class="contentstyle">
<p>Lorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem IpsumLorem Ipsum </p>
</div>
</div>

<div id="2">
<ul id="secondtab" class="shadetabs">
<li class="selected"><a href="#default" rel="secondtabcontentarea">Lorem</a></li>
<li><a href="lorem.html" rel="secondtabcontentarea">Lorem</a></li>
<li><a href="lorem.html" rel="secondtabcontentarea">Lorem</a></li>
<li><a href="lorem.htm" rel="secondtabcontentarea">Lorem</a></li>
</ul>

<div id="secondtabcontentarea" class="contentstyle">
<p>Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum</p>
</div>
<div id="#secondtabcontentarea" class="contentstyle">
<p>Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum </p>
</div>
</div>

<div id="3">
<ul id="thirdtab" class="shadetabs">
<li class="selected"><a href="#default" rel="thirdtab">Lorem Impsum</a></li>
<li><a href="external2.htm" rel="thirdtab">external2</a></li>
<li><a href="external3.htm" rel="thirdtab">external3</a></li>
</ul>

<div id="thirdtab" class="contentstyle">
<p>Lorem Impsum Lorem Lorem Impsum Lorem Lorem Impsum Lorem Lorem Impsum Lorem Lorem Impsum Lorem Lorem Impsum Lorem </p>
</div>
</div>

<script type="text/javascript">
//Start Ajax tabs script for UL with id="maintab" Separate multiple ids each with a comma.
startajaxtabs("maintab", "secondtab" , "thirdtab")
</script>


The script works perfectly in the same page without any problem.
I would like to load the content not from an external page, like for example external2.html but from the same page...something like happens for #default.

So i will have for example:


<div id="3">
<ul id="thirdtab" class="shadetabs">
<li class="selected"><a href="#default" rel="thirdtab">Lorem Impsum</a></li>
<li><a href="#mydiv" rel="thirdtab">My Div</a></li>
<li><a href="#mydiv2" rel="thirdtab">My Div 2</a></li>
<li><a href="external3.htm" rel="thirdtab">external3</a></li>
</ul>

<div id="thirdtab" class="contentstyle">
<p>Lorem Impsum Lorem Lorem Impsum Lorem Lorem Impsum Lorem Lorem Impsum Lorem Lorem Impsum Lorem Lorem Impsum Lorem </p>
</div>
<div id="??" class="contentstyle"> ???

I have to put my #mydiv here? How?
</div>

I don't know if it's possible.

I've two main reasons to do that:
1- I use this script on a portfolio website. The site is formatted via css and if a user accesses to single file (external.html) doesn't see the entire site (no graphics, no img etc.)
2- If search engines indicize me and i use for example
<meta name="robots" content="index,follow"> i will be indicized as http://mysite.com/external.html and so... we come back to point 1 :P

Tnx to everyone!

ddadmin
03-15-2007, 10:05 PM
Well, there is Tab Contents script (http://www.dynamicdrive.com/dynamicindex17/tabcontent.htm), which loads all of its contents using DIVs on the same page. But the limitation obviously is that the a content cannot be an external file, with only Ajax Tabs Content supports. Will the former suffice?