这是我导师的演示,他做了一个横幅(像幻灯片一样),里面有 3 张图片会反复变化。当我将此代码应用于我的项目时,它出现了一个错误: Uncaught TypeError: Object # has no method 'filters' 。
我问他,他说 'filters' 方法用于 IE 浏览器,如果我想在 chrome 或 firefox 中使用它,我必须找到另一种方法。
我已经搜索了谷歌,但仍然没有找到答案。请有人告诉我如何解决这个错误。太感谢了。
JS代码:
var switchImage = 0;
var imageArray = ['image1','image2','image3'];
function blend() {
for (var i =0; i <imageArray.length; i++) {
if (i != switchImage) {
document.getElementById(imageArray[i]).style.visibility = "hidden";
document.getElementById(imageArray[i]).filters("blendTrans").apply();
document.getElementById(imageArray[i]).filters("blendTrans").play();
}
}
}
function reBlend() {
switchImage = Math.floor(Math.random() * (2 - 0 + 1)) + 0;
document.getElementById(imageArray[switchImage]).style.visibility = "visible" ;
for (var i = 0; i < imageArray.length; i++) {
if (i != switchImage) {
document.getElementById(imageArray[switchImage]).style.zIndex -= 4;
} else {
document.getElementById(imageArray[switchImage]).style.zIndex += 4;
}
}
blend();
}
图片代码:
<IMG ID ="image1" SRC ="images/banner1.png" ONFILTERCHANGE ="reBlend()"
style="position:absolute;
filter:blendTrans(duration=3); z-index: 3"/>
<IMG ID ="image2" SRC ="images/banner2.jpg" ONFILTERCHANGE ="reBlend()"
style="position:absolute;
filter:blendTrans(duration=3); z-index: 2"/>
<IMG ID ="image3" SRC ="images/banner3.jpg" ONFILTERCHANGE ="reBlend()"
style="position:absolute;
filter:blendTrans(duration=3); z-index: 1"/>