复制chrome webstore元素效果

Question

这个有点棘手，我在这里创建了jsfiddle http://jsfiddle.net/WXmcL/10/来复制https://chrome.google.com/webstore/category/home插件容器。除了一个元素链接之外，一切都很好。

我需要将

 <a class="link" href="linktoapp"></a>

正确，但也让用户到达

<a href="linktoinfo">Info1</a>

因为我不能在a元素中有任何ul或div，所以我不能达到这个效果。是的，我可以做跨度，但我的评分包含ul，div等，我会有更多的标记在里面。如果你在chrome store上查看，你总是可以链接到应用程序，同时达到评级。它们将所有元素都放在a标记中，但是页面验证看不到它。所以在我看来，js已经加载完成了，还是？

谢谢!

Answer 1

当你在构建你的效果时，你应该忘记验证。让它与你需要的标记一起工作，然后你可以坐下来，去掉那些不能验证的东西，并通过javascript注入它。

mootools有一个很棒的元素构造器。

new Element("a.linktoinfo[html=Info]").inject(element)；

您可以通过构造函数选项对象将任何属性传递给它。

例如：

new Element("a", {
    "class": "foo",
    "href": "#",
    "events" : {
        click: function() {
            showInfo(this.getParent());
        }
    }
}).inject(element.getElement("a.link", 'after');

等等。

顺便说一句，当你改变类的时候，只需要确保它改变了你不同的属性。在您的例子中，使.myInfoOn / .myInfoOff具有不同的高度是有意义的。在未更改的其他值之间指定变形是没有意义的。

这种变形器解析类中定义的所有css规则，您可以在每个事件中传递这些规则，实际上，最好手动设置它。如果它是硬连接的，它的伸缩性就会变小，我意识到这一点--但你可以在你的类中设置为一个变量。