Georg: Mootools Fx.Slide-Effekt

Beitrag lesen

Grüß Gott!

Ich habe eine Frage zu mootools und diesem Fx.Slide-Effekt.

http://demos.mootools.net/Fx.Slide

Gibt es eine Möglichkeit, dass der Effekt das, was darunter liegt, überlabbt? Ich meine das so: Wenn ich jetzt "toggle" anklicke, geht "wandert" ja die Anzeige mit horizontal etc. einige Pixel nach unten. Bei meiner "Wunschvorstellung" sollte davon nichts mehr zu sehen sein, weil das darüber liegt. Das ist aber auch blöd zu erklären :-)

In der Hoffnung, dass mich jemand verstanden hat: Vielen Dank!

LG

CSS:

  
h3.section {  
	margin-top: 1em;  
}  
  
#vertical_slide, #horizontal_slide {  
	background: #D0C8C8;  
	color: #8A7575;  
	padding: 10px;  
	border: 5px solid #F3F1F1;  
	font-weight: bold;  
}  
  
div.marginbottom {  
	/* Since the Fx.Slide element resets margins, we set a margin on the above element */  
	margin-bottom: 10px;  
}  

  
window.addEvent('domready', function() {  
	var status = {  
		'true': 'open',  
		'false': 'close'  
	};  
	  
	//-vertical  
  
	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();  
	});  
  
	$('v_toggle').addEvent('click', function(e){  
		e.stop();  
		myVerticalSlide.toggle();  
	});  
  
	$('v_hide').addEvent('click', function(e){  
		e.stop();  
		myVerticalSlide.hide();  
		$('vertical_status').set('html', status[myVerticalSlide.open]);  
	});  
	  
	$('v_show').addEvent('click', function(e){  
		e.stop();  
		myVerticalSlide.show();  
		$('vertical_status').set('html', status[myVerticalSlide.open]);  
	});  
	  
	// 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]);  
	});  
  
  
	//--horizontal  
	var myHorizontalSlide = new Fx.Slide('horizontal_slide', {mode: 'horizontal'});  
  
	$('h_slidein').addEvent('click', function(e){  
		e.stop();  
		myHorizontalSlide.slideIn();  
	});  
  
	$('h_slideout').addEvent('click', function(e){  
		e.stop();  
		myHorizontalSlide.slideOut();  
	});  
  
	$('h_toggle').addEvent('click', function(e){  
		e.stop();  
		myHorizontalSlide.toggle();  
	});  
  
	$('h_hide').addEvent('click', function(e){  
		e.stop();  
		myHorizontalSlide.hide();  
		$('horizontal_status').set('html', status[myHorizontalSlide.open]);  
	});  
	  
	$('h_show').addEvent('click', function(e){  
		e.stop();  
		myHorizontalSlide.show();  
		$('horizontal_status').set('html', status[myHorizontalSlide.open]);  
	});  
	  
	// When Horizontal Slide ends its transition, we check for its status  
	// note that complete will not affect 'hide' and 'show' methods  
	myHorizontalSlide.addEvent('complete', function() {  
		$('horizontal_status').set('html', status[myHorizontalSlide.open]);  
	});  
});