Ajax tabs content with Accordion

[starfi3ld]

1) Script Title: Ajax Tabs Content

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...axtabscontent/

3) Describe problem: The accordion script doesnt seem to work.... This is what I did : http://www.boontan.net/anime.php . It is supposed to roll down.. an example would be http://www.boontan.net/mirror.php. But once I put accordion in to tabs content, it doesnt work properly anymore.. as seen from http://www.boontan.net/anime.php

Can anyone help me with this? how should i edit it so that it works?

[thetestingsite]

You will need to put this in the page that is not working (anime.php).

<script type='text/javascript' src='http://www.boontan.net/theme/mootools.accordion.js'></script>
<script type='text/javascript'>
	var acStretchers_page3 = [
	'acStretcher_page3_1',
'acStretcher_page3_2',
'acStretcher_page3_3',
'acStretcher_page3_4',
'acStretcher_page3_5',
'acStretcher_page3_6',
'acStretcher_page3_7',
'acStretcher_page3_8',
'acStretcher_page3_9',
'acStretcher_page3_10',
'acStretcher_page3_11',
'acStretcher_page3_12',
'acStretcher_page3_13',
'acStretcher_page3_14',
'acStretcher_page3_15',
'acStretcher_page3_16',
'acStretcher_page3_17',
'acStretcher_page3_18',
'acStretcher_page3_19',
'acStretcher_page3_20',
'acStretcher_page3_21',
	];

	var acTogglers_page3 = [
	'acToggler_page3_1',
'acToggler_page3_2',
'acToggler_page3_3',
'acToggler_page3_4',
'acToggler_page3_5',
'acToggler_page3_6',
'acToggler_page3_7',
'acToggler_page3_8',
'acToggler_page3_9',
'acToggler_page3_10',
'acToggler_page3_11',
'acToggler_page3_12',
'acToggler_page3_13',
'acToggler_page3_14',
'acToggler_page3_15',
'acToggler_page3_16',
'acToggler_page3_17',
'acToggler_page3_18',
'acToggler_page3_19',
'acToggler_page3_20',
'acToggler_page3_21',
	];
				var accordion_page3 = new yhfx.Accordion(acTogglers_page3, acStretchers_page3, {start: 'closed', alwaysHide: true, opacity: true, duration: 300 , onActive: function (el) {        }, onBackground: function (el) {    $(el).setStyle ('cursor', 'pointer');    }});
</script>

Then take that part out of the page that is working (mirror.php).

That should get it to work, but not 100% sure.
Hope this helps nonetheless.

[starfi3ld]

I've done that already..... the script works fine without the tabs content... but after i add that in to Ajax tabs content it does not work you see....

[starfi3ld]

this is the codes for it

        <link rel="stylesheet" type="text/css" href="http://www.boontan.net/css/ajaxtabs.css">

<script type="text/javascript" src="http://www.boontan.net/css/ajaxtabs.js">
</script>


<ul id="maintab" class="shadetabs">
<li class="selected"><a href="#default" rel="ajaxcontentarea" rev="http://www.boontan.net/theme/mootools.accordion.js">Downloads</a></li>
<li><a href="http://www.boontan.net/mirror.php" rel="ajaxcontentarea" rev="http://www.boontan.net/theme/mootools.accordion.js">Mirror</a></li>
</ul>

<div id="ajaxcontentarea" class="contentstyle">
<p><?php include 'http://server1.starfi3ld.com/list.php' ?>
</div>

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

and then I included another script.. This is the http://www.boontan.net/mirror.php both works fine... Just that when i combine them the result is http://www.boontan.net/anime.php which does not roll down... both on the mirror or the main part... remember that you have to wait for the page to completely load before clicking mirror... so that you can see the contents of mirror inside the AJAX script

<div id='accordion_wrapper' style='position:relative; width:97%; border:0px; margin:0px; padding:0px; overflow:hidden; '>
<div id='acAlignment' style='position:relative; border:0px; padding:0px; margin-bottom:0px; margin-top:0px; margin-right:auto; margin-left:0px; '>

<?php
// Read all folders in the current directory
$dir1 = "/home/mirror/animes/";
if ($dh1 = opendir($dir1)) {
    $folders1 = array();
    while (($folder1 = readdir($dh1)) !== false) {
        if ((filetype($dir1 . $folder1) == "dir") && ($folder1 != "." && $folder1 != "..") )    {
            array_push($folders1, $folder1);
        }
    }
    closedir($dh1);
}

// Sort the folders
$count1 = 1;
sort($folders1);
foreach ($folders1 as $folder1) {
    print "
        <h2 class='acToggle' id='acToggler_page3_$count1' style='    cursor:pointer;'>$folder1</h2>
        <div class='acStretchOut' id='acStretcher_page3_$count1'>
        <div class='acStretch' style='    padding-top:0px; padding-bottom:2px; padding-right:15px; padding-left:15px;        '>            
    ";
    // Read the animes in each folder
    if ($dh_inner1 = opendir($dir1 . $folder1))    {
        $files1 = array();
        while (($file1 = readdir($dh_inner1)) !== false) {
            if ($file1 != "." && $file1 != "..")    {
                array_push($files1, $file1);
            }
        }
    }
    
    // Sort the animes
    sort($files1);
    foreach ($files1 as $file1) {
        print ("<a href='http://domain.com/download.php?filename=$file1&path=$folder1/'>$file1</a><br>");
    }
    print "<div style='width:90%; clear:both;'></div></div></div>";
    $count1++;
}
?>

<div style='width:90%; clear:both;'></div></div></div>
<script type='text/javascript' src='http://www.boontan.net/theme/mootools.accordion.js'></script>
<script type='text/javascript'>
    var acStretchers_page3 = [
    <?
        // Loop the codes
        for ($i = 1; $i < $count1; $i++)    {
            print "'acStretcher_page3_$i',\n";
        }
    ?>
    ];

    var acTogglers_page3 = [
    <?
        // Loop the codes
        for ($i = 1; $i < $count1; $i++)    {
            print "'acToggler_page3_$i',\n";
        }
    ?>
    ];
                var accordion_page3 = new yhfx.Accordion(acTogglers_page3, acStretchers_page3, {start: 'closed', alwaysHide: true, opacity: true, duration: 300 , onActive: function (el) {        }, onBackground: function (el) {    $(el).setStyle ('cursor', 'pointer');    }});
</script>

So can anyone point out the problem? Im a noob in this....