Question

我实施了Galleria＆amp; SmoothDivScroll插件在一起，但在IE7＆amp; IE8当图像的方向为纵向时（即当图像被加载到#main_image，图像容器中时），图像变形[比例不会保持缩放]。

在Safari和Firefox中，一切都很好。有没有其他人遇到这个问题？你是怎么解决这个问题的？

Answer 1

我发现有些CSS给我带来了麻烦。 IE7＆amp; IE8显然不知道如何处理缩放同时保持比例相同。我给了图片width＆amp; height属性，似乎解决了这个问题。

Answer 2

我刚刚将整个页面拆开并重新组合在一起，发现它是我选项中的一个逗号

// Initialize Galleria
$('#galleria').galleria({
width:764,
transition: 'fade',
autoplay: 8000,
idleTime: 1000000, <-----THIS COMMA HERE (remove this)
});

一旦删除了这个，整个过程就在IE7上运行了。我现在不知道这对任何人是否有任何帮助，对许多人来说这也许是非常明显的事情。

Answer 3

我发现解决许多问题的关键是将Galleria.loadTheme（）移到（document）.ready（）之外。

首先尝试，如果不起作用，请搞乱其他事情。

Answer 4

我也有类似的问题，我认为smoothdivscroll与ie不兼容，因为在我的问题中，我使用了smoothdivscroll和jflow，它在firefox，chrome，safari，opera等上完美运行但就7号和8号而言，一切都有点疯狂。小时和天试图解决问题，我试图删除并逐一放置东西，删除滚动div后，一切都像魅力一样，即：）

我遇到此问题的网站：www.jardinsbelohorizonte.com

JoséMoreira

Answer 5

我找到了一个更完整的解决方案，它将强制正确缩放的width属性：

首先，你需要为大图像添加一个id，为了改变jquery.galleria.js文件中onPageLoad函数中的以下代码行：

var _img   = $(new Image()).attr('src',_src).addClass('replaced');

添加它，使其现在如下所示：

var _img   = $(new Image()).attr('src',_src).attr('id','mainImg').addClass('replaced');

现在为图像添加了一个id，因此可以将其作为目标。

接下来，在您的索引文件中（或者您放置了启动图库的代码），您现在可以更改代码，如下所示：

// fade in the image & caption
if(! ($.browser.mozilla && navigator.appVersion.indexOf("Win")!=-1) ) { // FF/Win fades large images terribly slow
     image.css('display','none').fadeIn(1000);
}
var newHeight = 420;
var mainImage = document.getElementById('mainImg');
var imgInitHeight = mainImage.height;
var imgInitWidth = mainImage.width;
var imgScaleRatio = newHeight/imgInitHeight;
var newWidth = Math.ceil(imgInitWidth*imgScaleRatio);
image.css('height', newHeight);
image.css('width', newWidth);
caption.css('display','none').fadeIn(1000);

变量newHeight是您希望显示大图像的高度。接下来，您需要定位图像以获得其高度和宽度在调整大小之前，这些值分别存储在imgInitHeight和imgInitWidth中。现在，如果您知道newHeight和imgInitHeight值，则可以计算图像必须按比例缩放以使其达到新维度的比率，这将存储在imgScaleRatio属性中。

确定比率后，您现在可以计算图像的新宽度，并确信这是正确缩放的。完成此操作后，只需将css值应用于图像即可完成！希望这有助于某人。

Jon Tivy-Jones

Answer 6

我得到了这个修复，让jQuery Gallery可以在IE8 + Windows Vista上运行。

从以下地址获取galleria代码：

jQuery(document).ready(function(){    
  //your code here    
});

以这种方式加载图库：

var interval;

Galleria.loadTheme(’/js/galleria.classic.js’);
interval = setInterval(’loadMyGalleria()’,1000);
function loadMyGalleria() {
  if ($(’#galleria > div’).size() == 0) {
    $(’#galleria’).galleria({
      image_crop: true,
      transition: ‘fade’,
      transition_speed: 1000,
      data_config: function(img) {
      return {
        description: $(img).next(’p').html() };
      }
    });
    clearInterval(interval);
  }

IE7中的Galleria Javascript画廊＆amp; IE8

6 个答案: