1) Script Title: Drop down/ Overlapping Content script

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

3) Describe problem:

Hi guys,

this is probably pretty simple but on this script there are 4 preset locations for the div to appear left-bottom, right-bottom, left-top, right-top...

I want to position the div that appears away from the link used to drop it down. Is this poss?

Here is an eg page:

HTML Code:
<!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">
<head>

<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>


<style>
margin-top:0px;
margin-bottom:0px;
margin-right:0px;
margin-left:0px;
</style>

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

/***********************************************
* Drop Down/ Overlapping Content- © Dynamic Drive (www.dynamicdrive.com)
* This notice must stay intact for legal use.
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>



<!--Example #1: -->

<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td align="center" valign="top"><table width="1000" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td><p>Demo #1: <a href="open dropdown menu" id="searchlink" rel="subcontent"> OSCE</a></p>
          <p>&nbsp;</p>
          <p> hihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihihih</p>          </td>
      </tr>
    </table></td>
  </tr>
</table>
<p><div id="subcontent" align="left" style="position:absolute; visibility: hidden; border: 1px solid orange; width: 900px; background-image: url(../bg2.png); layer-background-image: url(../bg2.png); top: 39px; left: 12px;">
          
          
  <div id="countrydivcontainer" style="border:1px solid gray; width:450px; margin-bottom: 1em; padding: 10px">
<p>This is some default tab content, embedded directly inside this space and not via Ajax. It can be shown when no tabs are automatically selected, or associated with a certain tab, in this case, the first tab.</p>
</div>
          
          
          </div></p>
<script type="text/javascript">
//Call dropdowncontent.init("anchorID", "positionString", glideduration, "revealBehavior") at the end of the page:

dropdowncontent.init("searchlink", "", 300, "click")
dropdowncontent.init("contentlink", "", 300, "click")

  </script>
  
  
<p><a href="javascript: countries.loadajaxpage('external4.htm')">Load "external2.htm" into content container via Ajax</a></p>


<ul id="countrytabs">
<li><a href="external3.htm" rel="countrycontainer">Tab 3</a></li>
</ul>





<script type="text/javascript">

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

</script>

</body>
</html>
See the script page on DD for the js.

What im really trying to do is have the div that opens be centred horizontally in the page with a vertical offset from the top of the page, rather than open to the 'bottom-right' of the link you click to open it (which is what the js is written to make it do).


Any help would be much appreciated.

Thanks

Matt