Javascript - element.style.left返回空白

时间:2014-10-17 00:50:54

标签: javascript

我的代码设计用于拉出幻灯片菜单。出于某种原因,我似乎无法使用id“news”获取元素的“左”样式属性。这是我的javascript:

var current;
var currentValue;
var motionDir = 1;
window.onload = slide;
function slide() {
    current = document.getElementById('news'); //returns HTML Object div
    currentValue = current.style.left; //returns blank
    function move() {
        if(motionDir == 1) {
            if(currentValue !== '0%') {
                currentValue = parseInt(currentValue.substring(0, currentValue.length - 1)) + 2;
                current.style.left = currentValue + '%';
            } else {
                clearInterval(intervalID);
            }
        } else {
            if(currentValue !== '-50%') {
                currentValue = parseInt(currentValue.substring(0, currentValue.length - 1)) - 2;
                current.style.left = currentValue + '%';
            } else {
                clearInterval(intervalID);
            }
        }
    }
    var intervalID = setInterval(move, 20);
}

注意我在哪里设置当前的andent currentValue变量。 CurrentValue为我尝试设置的任何样式属性返回一个空值。如果我这样做:

currentValue = current.style;

然后输出[OBbject CSS2Properties],我不确定为什么它不说CSS3。无论如何,我完全被难倒,花了一个小时试图调试这个,但没有运气。我可以向您保证,所有代码都运行正常,并且可以正确链接到DOM。

1 个答案:

答案 0 :(得分:2)

除非您将其定义为内嵌样式,否则它不会起作用。

这意味着你必须拥有:

<div id="news" style="left: 15px;"></div>

为了让它发挥作用。

您可以使用offsetLeft以类似的方式获取它,否则请查看this response