WinFuture-Forum.de: Moo Tools Drop Down News - WinFuture-Forum.de

Zum Inhalt wechseln

Nachrichten zum Thema: Entwicklung
Seite 1 von 1

Moo Tools Drop Down News


#1 Mitglied ist offline   Party 

  • Gruppe: aktive Mitglieder
  • Beiträge: 501
  • Beigetreten: 16. Januar 04
  • Reputation: 0

geschrieben 11. Mai 2008 - 11:33

Hallo liebe community
erstmal entschuldigung für den langen code im anhang.

Also ich möchte eine fx funktion wie auf folgender seite erstellen http://moofx.mad4milk.net/ also das man auf die überschrift klickt und der text herein slidet. ok kein problem soweit. ich möchte aber das es auch nicht die erste news gleich anzeigt sondern wirklich erst wenn man drauf klickt. Unten ist ein teil des codes aber ich bin leider nocht nicht draufgekommen wo ich das genau einstelle bin leider nicht so ein js spezialist.

villeicht könnt ihr mir da ja weiterhelfen.

vielen dank erstmal für eure bemühungen

<script type="text/javascript">
	//scripts have been put here as a courtesy to you, the sourcecode viewer.
	//this script uses mootools: http://mootools.net
	
	var stretchers = $$('div.accordion');
	var togglers = $$('h3.toggler');

	stretchers.setStyles({'height': '0', 'overflow': 'hidden'});
	
	window.addEvent('load', function(){
		
		//initialization of togglers effects
		
		togglers.each(function(toggler, i){
			toggler.color = toggler.getStyle('background-color');
			toggler.$tmp.first = toggler.getFirst();
			toggler.$tmp.fx = new Fx.Style(toggler, 'background-color', {'wait': false, 'transition': Fx.Transitions.Quart.easeOut});
		});
		
		//the accordion
		
		var myAccordion = new Accordion(togglers, stretchers, {
			
			'opacity': false,
			
			'start': false,
			
			'transition': Fx.Transitions.Quad.easeOut,
			
			onActive: function(toggler){
				toggler.$tmp.fx.start('#e0542f');
				toggler.$tmp.first.setStyle('color', '#fff');
			},
		
			onBackground: function(toggler){
				toggler.$tmp.fx.stop();
				toggler.setStyle('background-color', toggler.color).$tmp.first.setStyle('color', '#222');
			}
		});
		
		//open the accordion section relative to the url
		
		var found = 0;
		$$('h3.toggler a').each(function(link, i){
			if (window.location.hash.test(link.hash)) found = i;
		});
		myAccordion.display(found);
		
		//the draggable ball
		
		var ball = $('header').getElement('h1');
		var ballfx = new Fx.Styles(ball, {duration: 1000, 'transition': Fx.Transitions.Elastic.easeOut});
		new Drag.Base(ball, {
			onComplete: function(){
				ballfx.start({'top': 13, 'left': 358});
			}
		});
		
	});
	
</script>

0

Anzeige



#2 Mitglied ist offline   Party 

  • Gruppe: aktive Mitglieder
  • Beiträge: 501
  • Beigetreten: 16. Januar 04
  • Reputation: 0

geschrieben 13. Mai 2008 - 13:56

<script type="text/javascript">  
	var stretchers = $$('div.accordion');
	var togglers = $$('h3.toggler');

	stretchers.setStyles({'height': '0', 'overflow': 'hidden'});
	
	window.addEvent('load', function(){
		
		//initialization of togglers effects
		
		togglers.each(function(toggler, i){
			toggler.color = toggler.getStyle('background-color');
			toggler.$tmp.first = toggler.getFirst();
			toggler.$tmp.fx = new Fx.Style(toggler, 'background-color', {'wait': false, 'transition': Fx.Transitions.Quart.easeOut});
		});
		
		//the accordion
		
		var myAccordion = new Accordion(togglers, stretchers, {
			'opacity': false,
			'start': false,
			
			'transition': Fx.Transitions.Quad.easeOut,
			
		
			onBackground: function(toggler){
				toggler.$tmp.fx.stop();
			}
		});
		
		//open the accordion section relative to the url
		
		var found = 0;
		$$('h3.toggler a').each(function(link, i){
			if (window.location.hash.test(link.hash)) found = i;
		});
		myAccordion.display(-1);
		
		
	});
	
</script>


Hab mich nun mal genauer damit beschäftigt und bin draufgekommen :D also falls es auch mal wer brauchen sollte man muss statt "myAccordion.display(found);" "myAccordion.display(-1);" schreiben..... *gg*
0

Thema verteilen:


Seite 1 von 1

1 Besucher lesen dieses Thema
Mitglieder: 0, Gäste: 1, unsichtbare Mitglieder: 0