Question

我在magento网站上使用js图片库。因为Magento使用原型，我在这个画廊使用了原型;这是一个简单的应用程序，我认为不必为这一个元素加载jQuery库。

如果您在IE8或更低版本中查看http://web74.justhost.com/~persia28/，则图库幻灯片之间的过渡非常缓慢，以至于当下一张幻灯片到位时，一张幻灯片中的文本会在短时间内保持可见状态。

我知道IE与垃圾是垃圾，但我认为这里的缓慢程度是极端的，即使对于IE来说也是如此。

我不想只为这个画廊加载jQuery库，Magento就足够了;所以，如果它出现，我可能会选择将文本放在图像中，而不是HTML中。

无论如何，听到你的智慧会很高兴。

非常感谢，这是画廊的js代码。

var i = 0;          

// The array of div names which will hold the images.
var image_slide = new Array('image-1', 'image-2', 'image-3');

// The number of images in the array.
var NumOfImages = image_slide.length;

// The time to wait before moving to the next image. Set to 3 seconds by default.
var wait = 4000;

// The Fade Function
function SwapImage(x,y) {       
$(image_slide[x]).appear({ duration: 1.5 });
$(image_slide[y]).fade({duration: 1.5});
}

// the onload event handler that starts the fading.
function StartSlideShow() {
play = setInterval('Play()',wait);
$('PlayButton').hide();
$('PauseButton').appear({ duration: 0});

}

function Play() {
var imageShow, imageHide;

imageShow = i+1;
imageHide = i;

if (imageShow == NumOfImages) {
    SwapImage(0,imageHide); 
    i = 0;                  
} else {
    SwapImage(imageShow,imageHide);         
    i++;
}
}

function Stop () {
clearInterval(play);                
$('PlayButton').appear({ duration: 0});
$('PauseButton').hide();
}

function GoNext() {
clearInterval(play);
$('PlayButton').appear({ duration: 0});
$('PauseButton').hide();

var imageShow, imageHide;

imageShow = i+1;
imageHide = i;

if (imageShow == NumOfImages) {
    SwapImage(0,imageHide); 
    i = 0;                  
} else {
    SwapImage(imageShow,imageHide);         
    i++;
}
}

 function GoPrevious() {
clearInterval(play);
$('PlayButton').appear({ duration: 0});
$('PauseButton').hide();

var imageShow, imageHide;

imageShow = i-1;
imageHide = i;

if (i == 0) {
    SwapImage(NumOfImages-1,imageHide); 
    i = NumOfImages-1;      

} else {
    SwapImage(imageShow,imageHide);         
    i--;
}
}

Answer 1

我查看了网站，它似乎并不慢，需要相同的时间才能运行。看起来好像文本在不透明度上没有变化，直到动画结束然后才被隐藏。当我看IE7它正常工作，这是一个线索，IE8有不同的方式制作透明胶片。

当我知道Prototype 1.6.1修复了几个IE8错误并且Prototype 1.7修复了一些IE9错误时，Magento仍然附带Prototype 1.6.0。您可以尝试在js/prototype/和js/scriptaculous/目录中升级Prototype和Scriptaculous。我不知道是否包含了这个确切的问题，这就是为什么你应该在覆盖文件之前进行备份，如果这不起作用你就会有回滚的东西。

我可以优化这个js Prototype库，以便在IE中更快地制作动画吗？

1 个答案: