Tweet
Aloha,
ich versuche mich momentan an mootools. Alles funktioniert prima, jedoch habe ich ein kleines Problem. Ich nutze das SlideFX und wenn die Seite geladen ist, ist automatisch der erste Div bereits geöffnet. Jedoch möchte ich das anfangs alle Divs geschlossen sind und erst bei einem Mouseover der jeweilige Div aufgeschoben wird. Kann mir bitte jemand sagen, wie ich das hin bekomme? Danke schonmal vorab!
ich versuche mich momentan an mootools. Alles funktioniert prima, jedoch habe ich ein kleines Problem. Ich nutze das SlideFX und wenn die Seite geladen ist, ist automatisch der erste Div bereits geöffnet. Jedoch möchte ich das anfangs alle Divs geschlossen sind und erst bei einem Mouseover der jeweilige Div aufgeschoben wird. Kann mir bitte jemand sagen, wie ich das hin bekomme? Danke schonmal vorab!
Code:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="demo.css" type="text/css" />
<script type="text/javascript" src="../mootools.js"></script>
<script type="text/javascript" type="text/javascript">
window.addEvent('domready', function() {
var status = {
'true': 'open',
'false': 'close'
};
var myVerticalSlide = new Fx.Slide('vertical_slide');
$('v_slidein').addEvent('click', function(e){
e.stop();
myVerticalSlide.slideIn();
});
$('v_slideout').addEvent('click', function(e){
e.stop();
myVerticalSlide.slideOut();
});
// When Vertical Slide ends its transition, we check for its status
// note that complete will not affect 'hide' and 'show' methods
myVerticalSlide.addEvent('complete', function() {
$('vertical_status').set('html', status[myVerticalSlide.open]);
});
});
</script>
<title>Fx.Slide Demo</title>
</head>
<body>
<div class="marginbottom">
<a id="v_slideout" href="#">slide out</a>
| <a id="v_slidein" href="#">slide in</a>
| <strong>status</strong>: <span id="vertical_status">open</span>
</div>
<div id="vertical_slide">
Lorem ipsum dolor sit amet.
</div>
</body>
</html>
Kommentar