Navigacija
Lista poslednjih: 16, 32, 64, 128 poruka.

Mootools background image animacija - kako dodati fade opciju sa promenom slika?

[es] :: Javascript i AJAX :: Mootools background image animacija - kako dodati fade opciju sa promenom slika?

[ Pregleda: 1740 | Odgovora: 1 ] > FB > Twit

Postavi temu Odgovori

Autor

Pretraga teme: Traži
Markiranje Štampanje RSS

etrarkia

Član broj: 139578
Poruke: 112
*.dynamic.isp.telekom.rs.



+2 Profil

icon Mootools background image animacija - kako dodati fade opciju sa promenom slika?25.07.2010. u 17:16 - pre 167 meseci
Na koji nacin povezati jedan element u HTML-u (ili CSS-u) tako da ima vise Mootools funkcija (konkretno efekata)?

Imam sledeci kod:

Code:

...
<style type="text/css">
        #animate-area    { 
            width:inherit; 
            height:1080px;
            background:url(images/0background.jpg) 0 0 repeat-x;
            z-index:1;
        }
    </style>
    
    <script type="text/javascript" src="js/mootools.js"></script>
    <script type="text/javascript">
            window.addEvent('domready',function() {
            //settings
            var duration = 50000;
            var length = 700;
            var count = 0;
            var tweener = $('animate-area').set('tween',{ duration: duration, transition: 'linear' });
            //showtime!
            var run = function() {
                tweener.tween('background-position','-' + (++count * length) + 'px 0px');
            };
            run();
            run.periodical(duration);
        });
    </script>
</head>
<body>

<div id="animate-area">

...


gde se slika kontinuirano pomera levo-desno duz ekrana (preko CSS-a, iz #animate-area).
Da li neko moze da mi pomogne da povezem animaciju sa sledecim fade-om:

Code:

window.addEvent('domready', function() { 

  Element.implement({ 

    fancyShow: function() { 

      this.fade('in'); 

    }, 

    fancyHide: function() { 

      this.fade('out'); 

    } 

  }); 

});

...

<p> 

  <strong>Fancy: </strong><a href="javascript:$('blove2').fancyShow();">Show</a> | <a href="javascript:$('blove2').fancyHide();">Hide</a><br /> 

  <img src="/dw-content/beatles-love.jpg" id="blove2" /> 

</p>


 
Odgovor na temu

Aleksandar Ružičić
Software Architect, Appricot d.o.o.
Beograd

Član broj: 26939
Poruke: 2881

Jabber: krckoorascic@gmail.com
Sajt: krcko.net


+44 Profil

icon Re: Mootools background image animacija - kako dodati fade opciju sa promenom slika?26.07.2010. u 16:11 - pre 167 meseci
probaj da koristis Fx.Morph kojim ces da kontrolises background-position i opacity stilove.
 
Odgovor na temu

[es] :: Javascript i AJAX :: Mootools background image animacija - kako dodati fade opciju sa promenom slika?

[ Pregleda: 1740 | Odgovora: 1 ] > FB > Twit

Postavi temu Odgovori

Navigacija
Lista poslednjih: 16, 32, 64, 128 poruka.