Question

所以我正在使用mootools的mousenter演示。我把它放在我的网站上试图影响链接，所以当有人在它们上面盘旋时，链接会变成另一种颜色。我遇到的问题是mootools代码只设置为处理一个ID！由于我将其用于导航，因此我有多个要更改的ID。我怎么能影响他们所有人呢？我知道我应该使用一个数组，但为了正确编码，我用javascript并不是那么好。请帮忙！

URl是www.portfoliobyart.com/h20

提前致谢！

Answer 1

我看了一下你的网站。在demo.js中，如果您更改此行

$('link').set('opacity', 0.5).addEvents({

到此：

$$('.nav a div').set('opacity', 0.5).addEvents({

您将对导航菜单中的每个项目实现相同的效果。

您应该阅读MooTools selectors了解更多相关信息。选择器是一个非常强大的工具。

Answer 2

下面的代码将获取每个导航链接元素并添加mouseenter和mouseout事件。

//selects all nav elements
$$('.nav a div').each(function(el){
    //this is the interior of the function that will run on each el
    //store the original bg color
    var color = el.getStyle('backgroundColor');

    //now add the mouseenter and leave events w/ the morphs
    el.set('opacity', 0.5).addEvents({
        mouseenter: function(){
        // This morphes the opacity and backgroundColor
            this.morph({
                'opacity': 1,
                'background-color': '#000000'
            });
        },
        mouseleave: function(){
        // Morphes back to the original style
            this.morph({
                opacity: 0.5,
                backgroundColor: color
            });
        }
    });
});

希望这有帮助！

帮助Mootools代码

2 个答案: