MooTools Can't figure out mouse event...

sethwb · 03-31-2009, 11:41 PM

I have searched my brains out and after hours of tinkering with the code I'm spent.

The problem I am having is with the mootools accordion script.

There is a gap between the div and the next accordion item in the list (about 10 pixels). I have set all margins and padding to 0 in the style sheet as such:

* {margin: 0px; padding: 0px;}

I am wondering if there is a way to add a mouse event handler that will push everything below the opened div up 10 pixels so that unsightly gap goes away...

how could I do that?

abduraooft · 04-01-2009, 07:55 AM

Quote:

I am wondering if there is a way to add a mouse event handler that will push everything below the opened div up 10 pixels so that unsightly gap goes away...

We are not psychic. Can we have a link to your page?

sethwb · 04-01-2009, 08:47 PM

This one is actually right on my PC:

index.html:

Quote:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<style type="text/css" media="screen">
@import url('global.css');
</style>
<link rel="shortcut icon" href="/images/favicon.ico" />
<script type="text/javascript"
src="mootools.js"></script>
<script type="text/javascript"
src="demo.js"></script>
</head>

<body>
<div id="top">
<img src="topbgL.jpg" width="934" height="84" />
</div>
<div id="strip">
</div>
<div id="bod">
<ul id="accordion">
<li>
<ul class="toggler"><li></li></ul>
<div class="element"><img src="pl.png" /></div>
</li>
<li>
<ul class="toggler"><li></li></ul>
<div class="element"><img src="d3.png" /></div>
</li>
<li>
<ul class="toggler"><li></li></ul>
<div class="element">Hello.</div>
</li>
<li>
<ul class="toggler"><li></li></ul>
<div class="element">Hello.</div>
</li>
</ul>
</div>
<div id="foot">
</div>

<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-000000-0";
urchinTracker();
</script>

</body>
</html>

demo.js:

Quote: