Mootools: DIV-Container einblenden u. ausblenden
Benutzen Sie die Buttons, um diesen DIV-Container auszublenden,
einzublenden oder nur teilweise sichtbar zu machen
HTML-Quellcode
- <div id="myElement" class="demoElement">
- Benutzen Sie die Buttons, um diesen DIV-Container auszublenden, einzublenden oder nur teilweise sichtbar zu machen
- </div>
- <p>
- <input type="submit" id="fadeOpacity" value="ausblenden">
- <input type="submit" id="tweenOpacity" value="einblenden">
- <input type="submit" id="tweenOpacity1" value="30% sichtbar">
- </p>
Javascript-Quellcode
- window.addEvent('domready', function(){
- var el = $('myElement');
- $('fadeOpacity').addEvent('click', el.fade.bind(el, [0]));
- $('tweenOpacity').addEvent('click', function(e){
- e.stop();
- el.fade(1);
- });
- $('tweenOpacity1').addEvent('click', function(e){
- e.stop();
- el.fade(0.3);
- });
- });
CSS-Quellcode
- div.demoElement {
- width: 180px;
- margin: 10px auto;
- border: 1px solid black;
- background-color: #f9f9f9;
- font-size: 12px;
- color: #000000;
- padding: 10px;
- }
Schlagwörter:
Mootools Tutorial, Javascript, Javascript Online Workshop, MooTools, DIV einblenden und ausblenden.


