jQuery、HTML 5 和 IE 给出错误的动画

Question

我在 IE 中遇到 jQuery 动画问题（我在 IE 8 中进行了测试）。网站是用 HTML5 编写的，我的内部有带有 img 标签的figure标签。

单击时我想移动所有图形元素，因此在动画函数中我只需给出新的左侧位置。在 FF、Opera 和 Chrome 上运行良好，在 IE 上则有问题。

看起来 IE 每 200 毫秒重绘一次 HTML。如果我有“慢”动画，则从开始位置到结束位置有 3 次跳跃，而“快”则只有一次跳跃...

请帮助我。

这是我使用的一个简单代码：

这是一个创建图形的函数：

var createElement = function (w, h, left, id, photo, title, HTMLclass) {

var nid = Math.round(Math.random()*100)*1000 + (id*1);

var 图 = $("

").css({"z-index":1,"宽度":w+"px","高度":h+"px","左":左+"px","光标":"指针"}).attr("id",(nid+1)).attr("onclick","moveElements(this)").addClass(HTMLclass);

var img = $("").attr("src","photo/co/" + photo).attr("alt", 标题).css({"z-index":2,"width": w+"px","高度":h+"px"});

var Figcaption = $("

").text(caption); $("body").append(figure.append(img).append(figcaption));

};

这是一个带有 animate 的循环：

varfigures = $ (“图”).each(函数(索引){ $(this).animate({"left": newLeft}, "slow"); };

Answer 1

这可能与 Internet Explorer 不知道如何处理较新的 HTML 5 标记有关。尝试将以下 Javascript 插入您的头脑中。 javascript 的作用是为文章、页脚、页眉等创建元素，因此较旧的浏览器可以通过 DOM 加载来使用这些元素。

document.createElement("article");  
document.createElement("footer");  
document.createElement("header");  
document.createElement("hgroup");  
document.createElement("nav");
document.createElement("feature"); 

如果这不起作用，请尝试在此处发布您的代码，以便我们可以更仔细地查看。跨浏览器问题似乎表明 IE 不知道如何处理这些元素。