View Full Version : How to get an object instance ?

11-14-2008, 08:47 PM
I'm using stickmanlabs.com's accordion (http://stickmanlabs.com/accordion/) and I want to get the active accordion to do some manipulation.

I need to do something like this :

var activeAccordion = GetInstanceActiveAccordionOrSomewayToDoIt("AcdordionName");
activeAccordion.activate($$('#vertical_container .accordion_toggle')[0]);

Thank you

11-15-2008, 02:16 PM
Well, I'm not too sure about what would constitute the active accordion. However, if you want to access a given accordion, you would need to create it with a reference, ex:

var myAccordion = new accordion('#myId');

Once you have that, you can do some things with it using other script code as shown on the demo page.

If you want to somehow have Accordion v2.0 keep track of which of several accordions on a given page was last to be activated by the user, that would be a bit more complex. Unless the author has made some provision for it, it would require additional coding, at the very least a listener for the page.

11-15-2008, 02:21 PM
When I do this, I got two instances of the same object and the accordion got weird beheviors like opening container many time.

If someone can help me make a singleton we that.

11-15-2008, 02:29 PM
That sounds like you have either defined the same accordion more than once or have more than one accordion with the same variable reference. To see what's going on, I would need to see a page that demonstrates the problem:

Please post a link to the page on your site that contains the problematic code so we can check it out.

Please also tell me what to do on your page to get it to misbehave.

Alternatively, you could donate five bucks to the author. It is my understanding (though I could be wrong about this) that's all it would take for him to give you this type of support in a timely manner.

11-15-2008, 02:35 PM
Author's forum is down for now.

I'll try to make a temporary online of this mistake soon. It's on beta version for now.


11-17-2008, 03:00 PM
here the link : http://www.plandematchcommunication.com/temporaire/

If you click on accordion's red tabs, everything is fine. Now, click on the bottom black links to open specific tabs a few time. After, click on the red tabs again and look at the weird behevior.

I think that is because that every time, I got a new instance when this line is proceed :

var bottomAccordion = new accordion('vertical_container');

How can I open specific tab without make a new instance ?

Geemee Theway

11-17-2008, 04:57 PM
By declaring it in the global scope to begin with:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Plan de Match Communication </title>
<meta name="description" content="Publicité, marketing, claude lussier, mise en marché, radio, tv, affaires, stratégie" />
<meta name="keywords" content="Agence de publicité et stratégie marketing, " />
<meta name="author" content="" />
<base href="http://www.plandematchcommunication.com/temporaire/" />
<link href="favicon.ico" rel="icon" type="image/x-icon" />

<meta name="verify-v1" content="0rm0MfCF41YR034RbIX397YRnP1yBjNZ/cG0NwfliKU=" />
<!-- CSS -->
<link rel="stylesheet" type="text/css" href="css/reset.css">
<link rel="stylesheet" type="text/css" href="css/plandematchcommunication.css">

<script type="text/javascript" src="includes/prototype.js"></script>
<script type="text/javascript" src="includes/scriptaculous.js"></script>
<script type="text/javascript" src="includes/effects.js"></script>

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

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

// In my case I want to load them onload, this is how you do it!
Event.observe(window, 'load', loadAccordions, false);

// Set up all accordions
var bottomAccordion;
function loadAccordions() {
bottomAccordion = new accordion('vertical_container');

function openMe(ThisPanel) {
bottomAccordion.activate($$('#vertical_container .accordion_toggle')[ThisPanel]);
return false;


<link rel="stylesheet" type="text/css" href="css/lightwindow.css" />
<script type="text/javascript" src="includes/lightwindow.js"></script>

<div class="TEAMMain" id="TEAMSite">
<div class="TEAMHeader">
<a href="#"><img class="TEAM_logo" src="images/design/logo_plandematchcommunication.png" width="269" height="58" alt="Plan de Match Communication "></a>
</div> <!-- TEAMHeader -->

<div id="TEAMContent">

<div id="vertical_container" >

<div class="accordion_toggle"><h4 class="onglet1">Tab #1</h4></div>
<div class="accordion_content" style="background:url('images/design/contenu_back1.jpg') top left repeat-x #fbfbfc;">
<div style="margin:0 auto;width:960px;">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla non lorem sit amet augue mattis ornare. In porta, nisi sed iaculis pellentesque, arcu elit imperdiet libero, sed tincidunt risus ligula id ve

. . .

. . . ntum, mauris id ultrices commodo, sem turpis sodales mauris, a bibendum augue orci sit amet orci. Integer justo enim, viverra ut, dignissim elementum, porttitor in, felis.


</div> <!-- vertical_container -->

<div class="TEAM_footer">
<table width="100%" border="0">
<td valign="top">
<p class="TEAM_Menu"><a href="#" onclick="return openMe(0);">Toggle Tab #1</a>&nbsp;&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;&nbsp; </p>

<p class="TEAM_Menu"><a href="#" onclick="return openMe(1);">Toggle Tab #2</a> &nbsp;&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;&nbsp; </p>
<p class="TEAM_Menu"><a href="#" onclick="return openMe(2);">Toggle Tab #3</a></p>

<td valign="top" align="right">

</div> <!-- TEAM_footer -->

</div> <!-- TEAMContent -->

</div> <!-- TEAMMain -->


Notes: I made some other changes in your code, returning (false) onclick of the 'external toggles', for example. Mid section of page unchanged, removed in the above for brevity.

11-17-2008, 05:26 PM
Great! Thank you !