Jquery CSS 多个“Tiles”，无需为每个 tile 添加更多 Jquery 代码答案

【问题标题】：Jquery CSS Multiple "Tiles" without having to add more Jquery code for every tileJquery CSS 多个“Tiles”，无需为每个 tile 添加更多 Jquery 代码
【发布时间】：2013-12-02 14:28:25
【问题描述】：

我的问题是我想做一个地铁风格的瓷砖。我已经运行了，但我想要不止一个，我不知道如何多次使用 jquery 代码或 css 代码而不会出现错误。

这是我使用Tile 的距离

My Fiddle

【问题讨论】：

您已经设置了tile 类，只需继续将其用于新图块即可。
我试图继续，但在这里你可以看到它的错误。 FIDDLE
我在下面添加了一个演示。应该按您的意愿工作。您可以将其修改为将磁贴绝对定位在屏幕中间的“open”类中。
在这个 jsFiddle 中查看我在 js 中创建的磁贴：jsfiddle.net/5mWdL/27

标签： jquery css microsoft-metro

【解决方案1】：

改为使用类： Demo

每个 ID 只能添加一个，这会在您使用多个图块时破坏您的代码。

$(".tile").on("click", function (e) { //opens the login
    e.stopPropagation();
    if(!$(this).hasClass('open') ) {
        $(this).animate({
            "width": "100%",
            "height": "100%"
        }, 1000).addClass('open');
    }
});
$(".close").on("click", function (e) {
    e.stopPropagation();
    $(this).parent().stop().animate({
        "width": "100px",
        "height": "50px"
    }, 1000).removeClass('open');
});

【讨论】：

如果一切按我的意愿工作，我会使用这个，我会检查这个答案