问题描述:

I'm using jquery to resize a slideshow image to full screen for a wordpress homepage. It works fine with Chrome & Safari, but it doesn't work with Firefox the first time I load it, I have to refresh the page for the script to work.

jQuery(document).ready(function($) {

$(".flexslider .slides img").load(function() {

var element = $(this);

resize_bg(element);

$(window).ready(function() {

resize_bg(element);

})

function resize_bg(element) {

element.css("left", "0");

var doc_width = $(window).width();

var doc_height = $(window).height();

var image_width = element.width();

var image_height = element.height();

var image_ratio = image_width / image_height;

var new_width = doc_width;

var new_height = Math.round(new_width / image_ratio);

if (new_height < doc_height) {

new_height = doc_height;

new_width = Math.round(new_height * image_ratio);

var width_offset = Math.round((new_width - doc_width) / 2);

element.css("left", "-" + width_offset + "px");

}

element.width(new_width);

element.height(new_height);

}

});

});

I would appreciate any suggestions as to how to get this to work with FF

相关阅读:
Top