MooTools Full Screen Background - Asset.image


<style>
#bg{position:fixed !important;position:absolute;bottom:0}
</stylev

<script>
window.addEvent('load', function() {resize();});
window.addEvent('resize',function(){resize();});

function resize(){ win= window.getSize(); if($('bg') !=null){$('bg').dispose();} var bg = new Element('div',{id:'bg'}).inject(document.body,'top'); bg.setStyles({'overflow':'hidden','top':0,'left':0,'width':win.x,'height':win.y,'display':'block'});
var image = 'bg1.jpg'; var loader = new Asset.images(image, { onComplete: function() { var imgL = new Element('img',{src:image}); imgL.setStyles({'opacity':0}); imgL.inject(bg); imgW = imgL.getSize().x; imgH = imgL.getSize().y; if(imgW/imgH>win.x/win.y){n_imgH = win.y; n_imgW = (win.y/imgH)*imgW;} else {n_imgH = (win.x/imgW)*imgH; n_imgW = win.x;} imgL.setStyles({'width':n_imgW ,'height':n_imgH,'display':'block','opacity':1}); } });};
</script>