JQuery SmoothZoom 和 PrettyPhoto - 图像并不总是在 Firefox 中加载答案

【问题标题】：JQuery SmoothZoom and PrettyPhoto - images not always loading in FirefoxJQuery SmoothZoom 和 PrettyPhoto - 图像并不总是在 Firefox 中加载
【发布时间】：2014-04-01 02:37:54
【问题描述】：

我正在使用来自 http://codecanyon.net/item/smooth-zoom-pan-jquery-image-viewer/511142?ref=janecross 的 JQuery 插件 SmoothZoom 和 PrettyPhoto http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/ 来放大 PrettyPhoto 灯箱。

现在这在 Firefox 中对于一两张图片可以正常工作，但是图片无法加载并且我收到 PrettyBox 错误：

'图片无法加载。确保路径正确且图片存在'

内容正在通过 Ajax 加载。

奇怪的是它在 Firefox 中可以工作然后停止工作，但在 Safari 中它可以正常工作。加载到 PrettyBox 中的图像大小在 13 到 17 Mb 之间。但是，如果我显着减小它们的大小，似乎没有任何区别。

您可以使用 Firefox 在http://130.95.21.121/museum/search.php 查看此内容。

然后-

点击系统复选框并选择：

“泌尿生殖道和胎儿结构”，然后从相关菜单中选择肾脏。

在左侧 div 中，单击“T71.M35203”，然后单击右侧的图像。对以下内容执行相同操作：

T71.M83132 和 T71.M410210

使用 Safari 重复...

search.php中的相关代码：

function setZoom (){
            $('#fullResImage').smoothZoom('destroy').smoothZoom();
        }

        function closeZoom (){
            $('#fullResImage').smoothZoom('destroy');
        }

        //Set your popup window size here (in pixels):
        var canvasWidth = 640;
        var canvasHeight = 480;

        $(".zoom_gallery a[rel^='prettyPhoto']").prettyPhoto({
            default_width: canvasWidth,
            default_height: canvasHeight,   
            autoplay_slideshow: false, /* true/false */
            opacity: 0.70, /* opacity of background black */
            theme: 'pp_default', /* light_rounded / dark_rounded / light_square / dark_square / facebook */
            modal: true, /* If set to true, only the close button will close the window */  
            overlay_gallery: false,
            changepicturecallback: setZoom,
            callback: closeZoom,
            social_tools: false,
            image_markup: '<div style="width:'+canvasWidth+'px; height:'+canvasHeight+'px;"><img id="fullResImage" src="{path}" /></div>',
            fixed_size: true,
            responsive: false,
            responsive_maintain_ratio: true,
            max_WIDTH: '',
            max_HEIGHT: ''
        });

图片链接是从另一个通过 JSON/Ajax 发回的 php 脚本加载的：

<ul class='zoom_gallery'><li><a href='specimen_media/" . $specimen . "/" . $row['image_large'] . "' rel='prettyPhoto' title=''><img src='specimen_media/" . $specimen . "/" . $row['image_small'] . "'></a></li></ul>

【问题讨论】：

标签： jquery prettyphoto

【解决方案1】：

PrettyPhoto 中似乎有大小限制……一张 5Mb 的图像似乎可以正常工作。

【讨论】：