Home/ Questions/Q 224223
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-11T19:17:47+00:00

I’m changing my background-image css property using Mootools: $(document.body).setStyle(‘background-image’,’url(‘ + pBackground + ‘)’); And

  • 0

I’m changing my background-image css property using Mootools:

$(document.body).setStyle(‘background-image’,’url(‘ + pBackground + ‘)’);

And it’s its working, but how can a make one fade effect between picture change?

Thanks,
Pedro

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You can’t fade a background specifically… you have to fade the element that has the background.

    For your situation, I would suggest using a <div> that encompasses everything in the <body> of your HTML, ie:

    <html>
<body>
<div id="main">

</div>
</body>

    You could then set the background-image property of the #main div, and do something like this:

    function backgroundChange(pBackground)
{
    var m = $('main');
    var fx = new Fx.Tween(m,{
        duration: 1500,
        onComplete: function(){ 
            m.setStyle('background-image','url(' + pBackground + ')');
            m.fade('in');
        }
    });
    fx.start('opacity',1,0);
}
    • 0