Php Magento调整大小后如何获取原始图像文件？

我正在magento建立一家网店。 在产品详细信息页面上，我正在调整Magento本身的图像大小，这样就不必加载非常大的图像

当我点击图像时，它会打开一个带有图像的灯箱，但这次它必须更大

但是因为我调整了它的尺寸，它的质量真的很低

还有一件事我似乎想不通。 我也有一些较小的图像，当它们悬停在上面时，应该作为主图像出现。如果我将鼠标悬停在它们上方，我的调整大小功能将不再工作

我希望有人能指出我的错误：）

这是我的密码：

用于获取和调整图像大小的HTML/PHP代码

<p class="product-image">
<?php
    $_img = '<img id="image1" src="'.$this->helper('catalog/image')->init($_product, 'image')->resize(235, 350).'" alt="'.$this->htmlEscape($this->getImageLabel()).'" title="'.$this->htmlEscape($this->getImageLabel()).'" width="235" height="350    "  />';
    echo $_helper->productAttribute($_product, $_img, 'image');
?>

}

事件。观察（窗口“加载”，函数（）{
jQuery（'#image1'）。addimagezoom（{
zoomrange:[，]，
放大镜尺寸：[，]，
放大镜位置：''，
是的，
大图像：'/在加载图像并初始化脚本后，尝试使用
naturalWidth
和
naturalHeight
方法


注意：如果你想用另一种方法来做这件事，你也可以检查这个答案：
谢谢你的这两个建议：）这在我的项目中肯定会有用：）但现在它没有解决问题。警告“自然宽度”和“高度”会给我调整大小的尺寸。警告“pic\u real\u width

也会给我调整大小的尺寸，但如果我将鼠标悬停在画廊图像上（这会更改主图像）它为我提供了正确的维度。啊，我修复了悬停后更改维度的问题。但此代码仍然存储页面上图像的原始维度。但在加载页面时，它会调整大小。我需要图像本身的原始维度。请确保：在imag之后使用图像原始大小函数加载了e和resize函数。你的意思是什么？我正在做这样的事情。（这里的基础是）$image->resize（$newWidth，$newHeight）；echo$\u helper->productAttribute（$\u product，$image，'image'））；因此，在将图像加载到页面之前，图像已调整大小。然后在jQuery中，我使用加载到页面上的图像源打开一个lightbox。当然，这会使图像变得相当模糊，因为它已调整为较小的大小。您知道解决此问题的方法吗？这样我就可以获得图像文件本身的原始尺寸页面加载时新维度的ead？您的ligthbox插件可能会出现错误。您听说过用于实体弹出窗口的colorbox插件吗？我总是使用它，从不创建js冲突。

function imageswitcher(imagename){  
jQuery('#image1').attr('src', imagename);
var options =   {
    zoomrange: [<?php echo Mage::getStoreConfig('featurezoom/zoomrange/start');?>, <?php echo Mage::getStoreConfig('featurezoom/zoomrange/end');?>],
    magnifiersize: [<?php echo Mage::getStoreConfig('featurezoom/magnifiersize/height');?>,<?php echo Mage::getStoreConfig('featurezoom/magnifiersize/width');?>],
    magnifierpos: '<?php echo Mage::getStoreConfig('featurezoom/general/magnifierpos');?>',
    cursorshade: true,
    largeimage: imagename //<-- No comma after last option!
        }
    jQuery('#image1').addimagezoom(options);

function doTimer(imageName){
myTimer=setTimeout(function(){
    imageswitcher(imagename);
}, 2000);

Event.observe(window, 'load', function() {
    jQuery('#image1').addimagezoom({    
    zoomrange: [<?php echo Mage::getStoreConfig('featurezoom/zoomrange/start');?>, <?php echo Mage::getStoreConfig('featurezoom/zoomrange/end');?>],
    magnifiersize: [<?php echo Mage::getStoreConfig('featurezoom/magnifiersize/height');?>,<?php echo Mage::getStoreConfig('featurezoom/magnifiersize/width');?>],
    magnifierpos: '<?php echo Mage::getStoreConfig('featurezoom/general/magnifierpos');?>',
    cursorshade: true,      
    largeimage: '<?php echo $this->helper('catalog/image')->init($_product, 'image');?>' //<-- No comma after last option!
})
});

(function(window, $, undefined) {

        jQuery(function() {
            /*$(window).on('click', function(e) {
                console.log(e.target);
                //e.preventDefault();
            });*/

            $('.zoomtracker').on('click', function(e) {
                removeLightbox();
                $('body').css('overflow-y', 'hidden'); // hide scrollbars!
                $('<div id="overlay"></div>')
                  .css('top', $(document).scrollTop())
                  .css('opacity', '0')
                  .appendTo('body');

                $('<div id="lightbox"></div>')
                  .hide()
                  .appendTo('body');

                var img = new Image();
                img.onload = function() {

                    var width  = img.width,
                        height = img.height;

                    $('<img id="lightboxImage" />')
                      .attr('width', '235')
                      .attr('src', img.src)
                      .load(function() {
                        positionLightboxImage(e);
                      })
                      .click(function() {
                        removeLightbox();
                      })
                      .appendTo('#lightbox');
                };
                img.src = $('#image2').attr('src');
                $('#overlay').click(function(e){
            })
                /*var height = $('<img />').attr('width', .width());
                alert(height);

                $('<img />')
                  .attr('src', $(this).attr('href'))
                  .load(function() {
                    positionLightboxImage(e);
                  })
                  .click(function() {
                    removeLightbox();
                  })
                  .appendTo('#lightbox');

                return false;*/
                e.preventDefault();
              });
        });


            function positionLightboxImage(e) {
              var top = 173;
              var left = 271;

              /* In plaats van de img width en height de hoogte en breedte van het scherm berekenen en aan de hand heirvan het centrum bepalen. */

              $('#lightbox')
                .css({
                  'top': top,
                  'left': left
                })
                .fadeIn(500)
                .animate({'width': '640','left': '50%', 'margin-left': -($('#lightbox').width()/2), 'top': '19%', 'margin-top': -($('#lightbox').height()/2)}, {queue: false}, 8000);

              $('#lightboxImage')
                .animate({'width': '550','height': '930'}, {queue: false}, 8000)

            }

            function removeLightbox() {
              $('#overlay, #lightbox')
                .fadeOut(500, function() {
                  $(this).remove();
                  $('body').css('overflow-y', 'auto'); // show scrollbars!
                })
                .animate({'width': '235','left': '-72', 'margin-left': ($('#lightbox').width()/2), 'top': '-295', 'margin-top': ($('#lightbox').height()/2)}, {queue: false}, 8000);

                $('#lightboxImage')
                   .animate({'width': '235', 'height': '350'}, {queue: false}, 8000)
            }

            jQuery.fn.center = function () {
                this.css("position","absolute");
                this.css("top", Math.max(0, (($(window).height() - this.outerHeight()) / 2) + 
                                                            $(window).scrollTop()) + "px");
                this.css("left", Math.max(0, (($(window).width() - this.outerWidth()) / 2) + 
                                                            $(window).scrollLeft()) + "px");
                return this;
            }

    })(window, jQuery);

var img = $("img")[0];
alert( img.naturalWidth + "x" + img.naturalHeight );