0 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org    /TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<script type = "text/javascript">

var textHeadingArray = ["Bloom Defender", "Civilization Wars", "Flight", "Rebuild 2",  "Wonderputt"];

var textHeadingIndex = 0;

function changeMainImage() {

textHeadingIndex++;
        if (textHeadingIndex >= textHeadingArray.length) {
        textHeadingIndex = 0;   
}

var changeTheHeading = document.getElementById("slidehsowheading").innerHTML = textHeadingArray[textHeadingIndex];

var heading = document.getElementById("slidehsowheading").style.width;

var sizeOfHeading = heading;
alert(sizeOfHeading);

var subtraction = 75 - sizeOfHeading;

var changeTheHeadingAgain = document.getElementById("slidehsowheading").style.left = subtractionRounded + "px";
}

var mainTiming = setInterval("changeMainImage()", 5000);

</script>

</head>

<body>

<h1 id = "slidehsowheading">Bloom Defender</h1>

</body>
</html>

我试图使用此代码更改幻灯片的标题，我对 javascript 有点陌生，所以我的问题是当警报弹出时它返回为 null（警报仅用于调试），所以当我尝试使用此等式中 h1 的空宽度是错误的。该等式应该在计时器更改标题后得到标题的宽度并除以 2，然后从背景宽度除以 2 即 75 中减去该宽度，使用此公式，您可以将标题居中在其背景中元素

4

2 回答 2

1

问题是[object].style.width只有在 CSS 中或通过style.width方法明确设置宽度时才有效。

尝试使用该offsetWidth属性：

var heading = document.getElementById("slidehsowheading").offsetWidth;
于 2012-04-25T01:29:10.773 回答
0

您需要在 DOM 加载后执行此操作。将您的 javascript 放在身体的末端而不是头部。此外，您应该使用 console.log 而不是警报进行调试。

于 2012-04-25T01:27:09.790 回答