使用jQuery定位元素在Internet Explorer 8中无法正常工作

我有一组div中的图像，我使用jQuery在页面加载时定位。使用jQuery定位元素在Internet Explorer 8中无法正常工作

var myimg = $('#myimg'); 
... // Calculate x and y 
myimg.css('left', x); 
myimg.css('bottom', y);

每张图片都具有position: absolute风格，而其包含的div有一个position: relative风格。

这适用于除Internet Explorer 8之外的所有浏览器（未尝试过9）。图像没有设置位置。我可以确认JavaScript正在运行，尤其是因为我还在使用jqueryrotate旋转图像以在我定位它们时旋转图像，并且它们在IE中出现旋转。

编辑

这是一个完整的JavaScript代码。我特别想做的是将图像排列成一个圆圈。

var num_imgs = 14; 

var angle_delta = 360/num_imgs; 

var center_x = 365; 
var center_y = 245; 
var radius = 230; 

for (var i = 0; i < num_imgs; ++i) { 
    var angle = (angle_delta * i) + 90; 

    var radians = angle * 0.0174532925; 
    var x = Math.round(radius * Math.cos(radians)); 
    var y = Math.round(radius * Math.sin(radians)); 

    var img = $('#myimg-' + i); 
    img.rotate(90 - angle); // Only part of the code that works 
    img.css('left', center_x + x); 
    img.css('bottom', center_y + y); 
}

来源

2011-11-28 MacDonald

这应该在IE8中正常工作。你能提供你遇到麻烦的完整代码吗？ – Blazemonger

您不是在多个元素上使用“myimg”ID，对吗？我只问，因为你说你有“一套图像”。 – Blazemonger

http://jsfiddle.net/SLgVy/2/能正常工作。请注意，图像必须首先完全定位。 – Blazemonger

尝试将每个图像打包在<div>中，并将您的myimg# id分配给该div，而不是直接将其分配给图像。为每个图像添加一个类，其中包含<div>，以便您可以一次完成绝对定位。

您需要使用少量DOM遍历才能获得实际图像，但这只对插件很重要 - 只需使用img.children('img').rotate(90 - angle)而不是img.rotate(90 - angle)即可。您的CSS定位将全部使用<div>。

http://jsfiddle.net/R86Ud/4/

来源

2011-11-29 13:53:31 Blazemonger

您的x和y值是简单的整数，还是他们有'px'后缀？它们应该是'100px'，而不是简单的100，所以如果你错过了px，那可能是问题所在。

来源

2011-11-28 20:52:58

'.css'方法应该根据需要自动添加'px'。 – Blazemonger

你确定吗？即使在jQuery示例中，我总是看到'px'用于设置这些类型的值（而不是.width（）和.height（））。有链接？ –

http://jsfiddle.net/SLgVy/3/ - DOM检查器显示“px”值。 – Blazemonger

使用jQuery定位元素在Internet Explorer 8中无法正常工作

回答

相关问题