Проблема с Mozilla Firefox и выполнением функций - PullRequest
0 голосов
/ 23 мая 2011

Привет всем, у меня есть проблема с этим кодом.Когда я пробую код под IExplorer 9, Chrome 12.0.742.30 dev и Opera 11.10 - код работает правильно, но в Firefox 3 и 4 поколения код работает медленно.Я имею в виду, что когда я на третьем изображении и размер изображения составляет 400x400 пикселей, и я нажимаю «предыдущий» / «следующий», функция updateLightBox () должна изменять размер контейнера с размером второго изображения, но это не так.Размер второго изображения составляет 200x200px, но в следующий раз, когда я нажимаю «предыдущий» / «следующий», контейнер получит этот размер, но первое изображение имеет другой размер, и изображение не находится в центре дисплея, а кнопки не находятся на ихмест.

$('div#next').unbind().bind('click', function() {
    if(currentImage == arrayLength-1) {
        var Image = 0;
    }
    else {
        var Image = currentImage+1;
    }
    $('img#image').attr('src', imageArray[Image]);
    updateLightBox();
    cfg.activeImage = Image;
    currentImage = Image;
});
$('div#prev').unbind().bind('click', function() {
    if(currentImage == 0) {
        var Image = arrayLength-1;
    }
    else {
        var Image = currentImage-1;
    }
    $('img#image').attr('src', imageArray[Image]);
    updateLightBox();
    cfg.activeImage = Image;
    currentImage = Image;
});

Функция updateLightBox () имеет вид:

function updateLightBox() {
    var imgWidth = $('img#image').width();
    var imgHeight = $('img#image').height();
    var top = (height - imgHeight) / 2;
    var left = (width - imgWidth) / 2;

    $('div#imgAlt').remove();
    $('span#imgNum').remove();
    $('div#alt').append('<div id="imgAlt">'+altArray[cfg.activeImage]+'</div>');
    $('div#alt').append('<span id="imgNum">'+(cfg.activeImage+1)+' / '+arrayLength+'</span>');
    $('img#image').attr('alt', altArray[cfg.activeImage]);

    $('div#lightbox').animate({
        'top': top,
        'left': left,
        'width': imgWidth+'px',
        'max-width': imgWidth+'px',
        'min-width': cfg.minContainerWidth+'px',
        'height': imgHeight+'px',
        'max-height': imgHeight+'px',
        'min-height': cfg.minContainerHeight+'px'
    }, cfg.containerResizeSpeed);

    $('div#image').animate({
        'position': 'absolute',
        'margin': 0,
        'padding': 0,
        'zIndex': 902,
    }, cfg.containerResizeSpeed);

    $('div#alt').animate({ 
        'width': imgWidth-20+'px',
    }, cfg.containerResizeSpeed);

    $('div#prev').animate({
        'top': (imgHeight / 2) - 16+'px',
    }, cfg.containerResizeSpeed);

    $('div#next').animate({
        'top': (imgHeight / 2) - 16+'px',
    }, cfg.containerResizeSpeed);

    $('div#imgAlt').css({
        'font-family': 'Times New Roman, Georgia, Serif',
        'font-size': '14px',
        'font-weight': 'bold',
        'color': cfg.altTextcolor,
    });

    $('span#imgNum').css({
        'font-family': 'Times New Roman, Georgia, Serif',
        'font-size': '11px',
        'font-weight': 'bold',
    });
}

Если кто-нибудь знает, как это исправить, и скажите мне, что я буду очень счастлив и благодарен:)

С уважением, Джордж:]

1 Ответ

0 голосов
/ 23 мая 2011

Ваша настройка currentImage после вызова функции обновления

updateLightBox();
cfg.activeImage = Image;
currentImage = Image;

Должно быть

cfg.activeImage = Image;
currentImage = Image;
updateLightBox();
...