单击展开折叠交换背景

时间:2011-12-10 15:19:42

标签: css background onclick swap

我需要jquery,或者只在可能的情况下使用css来交换类的背景来制作展开折叠按钮。

<div class="parrent">
<div class="expand_collapse"></div>
</div>

CSS

.expand_collapse{
background:url(/img/expand.png) 0 0 no-repeat;
}

在“parrent”上点击背景应该在expand.png和collapse.png之间进行。

感谢名单

1 个答案:

答案 0 :(得分:0)

<强> HTML

<div class="parent">
    <div class="action"></div>
</div>

<强> CSS

.parent .action {
    background:url(/img/expand.png) 0 0 no-repeat;
}
.parent .action.collapse {
    background:url(/img/collapse.png) 0 0 no-repeat;
}

<强>的jQuery

$(document).ready(function() {
    $(".parent").click(function() {
        $(this).find(".action").toggleClass("collapse");
    });
});

链接示例: http://jsfiddle.net/TPAXz/