Benutzerdefinierte Suche
ty-ma-banner

Valid XHTML 1.0 Transitional

http://www.moritz-kuehnel.de/ » Javascript » Javascript Online Workshop » MooTools » DIV einblenden und ausblenden

Mootools: DIV-Container einblenden u. ausblenden

Benutzen Sie die Buttons, um diesen DIV-Container auszublenden, einzublenden oder nur teilweise sichtbar zu machen

HTML-Quellcode

  1. <div id="myElement" class="demoElement">
  2.     Benutzen Sie die Buttons, um diesen DIV-Container auszublenden, einzublenden oder nur teilweise sichtbar zu machen
  3. </div>
  4. <p>
  5.     <input type="submit" id="fadeOpacity" value="ausblenden">
  6.     <input type="submit" id="tweenOpacity" value="einblenden">
  7.     <input type="submit" id="tweenOpacity1" value="30% sichtbar">
  8. </p>
  9.  

Javascript-Quellcode

  1. window.addEvent('domready', function(){
  2.     var el = $('myElement');
  3.     $('fadeOpacity').addEvent('click', el.fade.bind(el, [0]));
  4.     $('tweenOpacity').addEvent('click', function(e){
  5.         e.stop();
  6.         el.fade(1);
  7.     });
  8.     $('tweenOpacity1').addEvent('click', function(e){
  9.         e.stop();
  10.         el.fade(0.3);
  11.     });
  12. });
  13.  

CSS-Quellcode

  1. div.demoElement {
  2.     width: 180px;
  3.     margin: 10px auto;
  4.     border: 1px solid black;
  5.     background-color: #f9f9f9;
  6.     font-size: 12px;
  7.     color: #000000;
  8.     padding: 10px;
  9. }
  10.  


Schlagwörter:
Mootools Tutorial, Javascript, Javascript Online Workshop, MooTools, DIV einblenden und ausblenden.

Webseite zu Favoriten hinzufügen:

bookmark in your browserbookmark at mister wongpublish in twitterbookmark at del.icio.usbookmark at digg.combookmark at furl.netbookmark at linksilo.debookmark at reddit.combookmark at spurl.netbookmark at technorati.combookmark at google.combookmark at yahoo.combookmark at facebook.combookmark at stumbleupon.combookmark at propeller.combookmark at newsvine.combookmark at jumptags.com