Question

我试过谷歌，但我无法明确回答。

我正在尝试编辑#sidebar的样式：从mootools悬停。我的css如下：

#hoverzone:hover {
    background: #EEE;
}

现在，我正在尝试在页面加载时编辑mootools的背景颜色，以表示启用了javascript。我知道我能做到：

$('hoverzone').addEvent('mouseenter', function(){
    this.setStyle('background','000');
});

但我想知道是否有一个我可以在页面加载时调用的函数，这可以在一行中完成而不会让用户做任何事情。

由于

编辑：是的，我很匆忙，古老地输入而不是鼠标中心

Answer 1

您无法使用javascript定位伪选择器。所以你需要创建一个覆盖旧的CSS规则。

http://jsfiddle.net/dimitar/Z9RPP/

var StyleWriter = new Class({
    // css classes on the fly, based on by Aaaron Newton's old work
    createStyle: function(css, id) {
        try {
            if (document.id(id) && id) return;

            var style = new Element('style', {id: id||'',type:'text/css'}).inject(document.getElements('head')[0]);
            if (Browser.ie)
                style.styleSheet.cssText = css;
            else
                style.set('text', css);

        } catch(e) {
            //console.log("failed:", e);
        }
    }
});

new StyleWriter().createStyle("#hoverzone:hover { background:red;}", "foo");

Answer 2

您可以使用Windows对象的事件domready或load。

例如：

window.addEvent('load', function(){
    $('hoverzone').setStyle('background-color','000');
});

Answer 3

为什么要使用javascript。为什么不只是css：

#hoverzone { background: #000 }
#hoverzone:hover { background: #EEE }

改变风格：在mootools中悬停选择器

3 个答案: