hello,
I'm doing full screen background change system with jquery.
When enter to site makes full screen size default background, and when click button must change background. Everythink works fine on opera! But FireFox nothink happend. I think problem is with attr function, please help found problem.
All this you can see in http://www.hiphopdance.lt
$(document).ready(function(){
//default actions
var now_img="images/bg.jpg";
resize(1600,900,"#bgimg",now_img);
$(window).bind("resize", function() { resize(1600,900,"#bgimg"); });
//default actions end
//clicks
$('li#red').click(function(){
$("img#bgimg").attr({src:'http://www.hiphopdance.lt/images/redbg.jpg'});
resize(1024,683,"#bgimg");
$(window).bind("resize", function() { resize(1024,683,"#bgimg"); });
});
//end clicks
//resize function start
function resize(img_width,img_height,img_id)
{
var ratio = img_height / img_width;
// Get browser window size
var browserwidth = $(window).width();
var browserheight = $(window).height();
// Scale the image
if ((browserheight/browserwidth) > ratio){
$(img_id).height(browserheight);
$(img_id).width(browserheight / ratio);
} else {
$(img_id).width(browserwidth);
$(img_id).height(browserwidth * ratio);
}
// Center the image
$(img_id).css('left', (browserwidth - $(img_id).width())/2);
$(img_id).css('top', (browserheight - $(img_id).height())/2);
};
//resize function end
});
