在悬停时删除a：before属性

Question

我的图片上有一个课程，并通过.images:before在其上放置了一个叠加层。 现在我想（例如使用jquery），在悬停时移除该叠加层......

这是我虽然但不起作用的事情：

$(document).ready(function(){
     $('.images').hover(function (){
           $(this).css('background','');
     });
});

继承人... ...

    .image {
    position: relative;
    display: inline-block;
}

.image:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url('images/overlay.png');
}

非常感谢任何帮助

Answer 1

您可以将伪选择器与伪元素组合使用：

.image {
    position: relative;
    display: inline-block;
}

.image:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url('images/overlay.png');
}

.image:hover:before {
    display : none;
}

小提琴：http://jsfiddle.net/Re9bj/17/