"Single Instance" Works; "Multiple" do not

[MickeyNotD]

1) Script Title: Drop down/ Overlapping Content

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

3) Describe problem:


IN the script for "Drop down/ Overlapping Content" I got it to work for a single instance on the page. BUT when I tried two instances, the second didn't work. Now, the instructions were good: it said,

============

dropdowncontent.init("searchlink", "right-bottom", 500, 'mouseover')

"If you have multiple Drop Down content instances on the page, call this function multiple times for each instance."
==============

The BASIC question is (sorry to ask): How do I "call this function"?


Here's what I've got on the web page:


<!--pop_up #1--> [This one works]

<p><a href="#" id="searchlink" rel="subcontent"><img src="img/spacer.png" alt="" class="pop_1" width="18" height="14" border="0"></a></p>

<DIV id="subcontent" style="position:absolute; visibility: hidden; border: 1px solid red; background-color: #F1FCFF; width: 360px; padding: 2px 8px 2px 8px; z-index:30;">

<p class="dropdown">POP UP text goes here</p>
</DIV>

<!-- end pop_up1-->


<!--pop_up #2 --> [This one does not work]

<p><a href="#" id="searchlink" rel="subcontent"><img src="img/spacer.png" alt="" class="pop_2" width="18" height="14" border="1"></a></p>

<DIV id="subcontent" style="position:absolute; visibility: hidden; border: 1px solid red; background-color: #F1FCFF; width: 360px; padding: 2px 8px 2px 8px; z-index:30;">

<p class="dropdown">Some other popup text</p>

</DIV>

<!-- end pop_up2-->



Any ideas?

Thanks very much.

[ddadmin]

For multiple instances of the script, the IDs of each container needs to be unique. In your case, you need to change "searchlink" and "subcontent" in the second instance's markup to something different from the first's. Take a look at the code you cut and paste in the code of Step 2 on the script page, which shows two working Drop Down Content DIVs.