[jQuery] Need help with scrambled open/shut script

[jQuery] Need help with scrambled open/shut script

I downloaded jQuery a few months ago and used it to make a simple open-shut script. While redesigning/upgrading my websites, I messed it up. I'm not sure if I deleted a critical file, nixed the link to a critical file or what.


I published a simplified version of a page at <a href="http://www.geobop.org/Test.php">http://www.geobop.org/Test.php</a> There are four open/shut scripts on the page:<br clear="all">

MyRegions (top center)


Microsoft notice (top right)

Links (bottom)

Books (bottom)

I think it might actually be a CSS problem, not JavaScript. When I hover my cursor over the Microsoft banner, the page moves in response (in Opera, at least), though the related display div doesn't open.


The MyRegions box was frozen open until I added the following styles:

<style type='text/css'>
.trigger {
  position:relative;
  cursor:pointer;
  z-index:2;
}
.menu {
  position:absolute;
  visibility:hidden;
  overflow:hidden;
  z-index:1;
  margin:0;
  padding:4px;
  background:#BF8660;
}
</style>
Now it's frozen shut.
















I suspect the fix is a simple one, but I'm confused between JavaScript, CSS and all my PHP includes. I may simply have several things in the wrong order.

Thanks for any tips.

--

David Blomstrom
Writer & Web Designer (Mac, M$ & Linux)
<a href="http://www.geobop.org">www.geobop.org</a>