Mozilla Firefox 和函数执行问题

Posted 2023-04-13

【中文标题】Mozilla Firefox 和函数执行问题

【英文标题】：Problem with Mozilla Firefox and function execution

【发布时间】：2011-05-23 13:56:50

【问题描述】：

大家好，我对这段代码有疑问。当我在 IExplorer 9、Chrome 12.0.742.30 dev 和 Opera 11.10 下尝试代码时 - 代码可以正常运行，但在 Firefox 3 和 4 代下代码运行缓慢。我的意思是当我在第三张图片并且图片大小为 400x400px 并且我按“上一张”/“下一张”时，函数 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】：

调用更新函数后你设置的 currentImage

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

应该是

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

【讨论】：

结果是一样的。在我发布之前，脚本是相同的......就像你帖子中的第二个......

我修复了脚本，现在在所有浏览器下都能正常工作：]

@T0m3kk 很高兴听到它有什么问题？ （作为答案发布并接受）

只是我圈出了这个问题 :) 我无法发布修复，因为修复是 81 行 - 超过 2000 个符号 :) 只是我删除了这个函数并将它添加到 div 的绑定中。我对函数做了一点改动：）如果你仍然感兴趣，我会给你看代码：）

@T0m3kk 不是小问题 :)