0

ホバー時のdivの背景画像の幅を変更したい。私のコードは次のとおりです。

HTML :

<div class="block2 todrop" target="regbuyer.php"></div>

CSS:

.col1 .block2                   { float: right; margin: 104px 0 0 0; width: 208px; height: 104px; background: url(../images/block2-1.jpg) no-repeat center center; background-size: 100% 100%; }
.todrop                         { cursor: pointer;  }
4

2 に答える 2

1

質問を読み直して、自分がばかだと気づきました

背景サイズを積極的に変更することはできませんが、背景サイズが異なるクラスを使用して、ホバー時に 2 つを交互に切り替えることができます。

$('.block2').hover(function(){
   $(this).removeClass('newSize').addClass('oldSize');
}, function(){
   $(this).removeClass('oldSize').addClass('newSize');
});​

CSS。

.newSize{
    background-size:25% 25%;
}
.oldSize{
    background-size:100% 100%;
}

要素が作成されたら、その要素のいずれかから開始するだけで、準備完了です。

フィドル

于 2012-10-06T02:16:05.643 に答える
0

何かのようなもの

$('.block2').live('mouseover', function() {
    $(this).animate({width: '300px'});
});

$('.block2').live('mouseout', function() {
    $(this).animate({width: '208px'});
});
于 2012-10-06T02:17:06.183 に答える