Question

好的，我有一个像http://jsfiddle.net/8vFEd/这样的代码段。我使用背景图像而不是平面背景框。单击任何矩形时，单击的矩形需要更改背景图像说（活动），其余部分更改为（暗淡）。单击第二个矩形后，需要具有（活动）bacground图像，其余为昏暗图像。基本上我只使用2个jquery背景图像，并根据点击的内容改变背景位置。有人可以指导我如何完成这个

其中一个将处于活动状态，其余部分将在点击该特定矩形时变暗。

Answer 1

我不确定我是否完全明白你要完成的任务，但你可能会尝试使用它：

$(this).css("border","2px solid red")
       .parent().siblings().find('a')
       .css('border', 0);

http://jsfiddle.net/8vFEd/23/

Answer 2

我会在Joseph的帖子上发表评论，但我还没有这个特权，所以嘿。

可能值得将2px solid #fff（其中#fff是父级的背景）的默认边框应用于所有链接，因此只是更改颜色的情况，这意味着点击链接时上下移动链接没有问题（正如你在他的小提琴中看到的那样）。

添加/删除图像，

$(".prop a").click(function() {
    // Give this the green background image
    $(this).css({ "border-color": "#f00", "background-image": "url('http://colourlovers.com.s3.amazonaws.com/images/patterns/113/113140.png')" })
    .parent().siblings().find('a')
    // Give all the others the red background image
    .css({ 'border-color': '#fff', 'background-image': "url('http://colourlovers.com.s3.amazonaws.com/images/patterns/155/155260.png')" });
});

快速轻松修复，来自他的代码：http://jsfiddle.net/bwfFL/1/

Answer 3

我假设您要更改背景图像（相同的逻辑适用于背景颜色）。可以说，你所有的矩形都有类“语言”。

$(".language").click(function () {
   // Dim out all the rectangles
   $(".language").css("background-image", "url(/dim.jpg)");

   // Make currently clicked rectangle active
   $(this).css("background-image", "url(/active.jpg)");
});

在jquery中更改背景图片onclick

3 个答案: