PDA

View Full Version : Ajax tabs without tabs?



inflatablemouse
11-21-2010, 01:50 PM
1) Script Title: Ajax tabs

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

3) Describe problem:
Hi all,

There may be a more elegant solution to my problem, but since I am not a coder it's very hard for me to come up with a proper solution to my problem. I'll try to keep it concise.

I am maintaining a site for a small community of Eve Online players, my site can be found here:
http://www.elysianempire.com/

When you go to the site and click the 'killboard' menu button, the killboard loads in place of the main site. This is because the killboard is not supposed to be shown inline, and is not an integrated module of the main site, SMF + SimplePortal.

I managed to load the killboard site into a tab in your Ajaxtabs demo. I am thinking if I could strip this down to a one page thing without borders and tabs, I could refer to that page as a custom action (I have an module that allows custom pages to be shown from a menu item as an integrated part on the site). So if that page contains the code to load the killboard, in theory I should have a seamless site :)

I hope that makes sense and someone can help me accomplish this.

Many thanks!

inflatablemouse
11-21-2010, 07:54 PM
wow I actually managed on my own :eek:

I added another section to the the CSS file called "ee", removed all formatting and changed everything to zero pixels. That took care of removing the tab.

Changed demo.htm:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd">
<html style="overflow:hidden" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<link rel="stylesheet" type="text/css" href="ajaxtabs/ajaxtabs.css" />

<script type="text/javascript" src="ajaxtabs/ajaxtabs.js">

/***********************************************
* Ajax Tabs Content script v2.2- Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>

</head>

<body>

<ul id="countrytabs" class="ee">
<li><a href="http://www.elysianempire.com/kb" rel="#iframe"></a></li>
</ul>

<div id="countrydivcontainer" style="border:0px; width:1000px; y-overflow:hidden">
</div>

<script type="text/javascript">

var countries=new ddajaxtabs("countrytabs", "countrydivcontainer")
countries.setpersist(true)
countries.setselectedClassTarget("link") //"link" or "linkparent"
countries.init()

</script>

</body>
</html>

Next in the ajaxtabs.js, I changed the defaultiframe line:

this.defaultIframe='<iframe scrolling="no" src="about:blank" marginwidth="0" marginheight="0" frameborder="0" vspace="0" hspace="0" class="tabcontentiframe" style="width:100%; height:auto; min-height: 1000px";></iframe>'