-1

私は既存のサイトを持っており、ほとんどの場合と同様に、いくつかのcssを変更するためにjQueryオーバーライドを使用する必要があります。要素のサイズを変更して背景画像を表示することはできますが、ホバー状態を機能させることができません。

ここで私の動作中のJSfiddleを見ることができます：http：//jsfiddle.net/wdNF6/

うまくいかないように見える大きなものは

$('.slideshow-screen .slide-item-current .play-button').hover( function(){
        $(this).css('background-position', 'something something');
}

.hover()私はstackoverflow全体で見つけた例から使用しました。例に進むと、ボタンは青色で画像が含まれているはずです。その上にカーソルを合わせると、bg画像の位置が変更されます。しかし、例に行くと、デフォルトのcsspre-jQueryが表示されます。jqueryの2番目のビットを削除すると、最初の部分が機能します。

助言がありますか？

4

2 に答える 2

2

関数の閉じ中括弧がありません

$('.slideshow-screen .slide-item-current .play-button').hover( function(){
            $(this).css('background-position', 'bottom center');
    }​); <--- Missing this

また、これは簡単に次のように書くことができます

$('.play-button').css({
    width: '90px',
    height: '90px',
    'background-color': '#0000ff',
    'background-position': 'top center',
    'background-image': 'url(http://www.lessardstephens.com/layout/images/slideshow_big.png)'
});

$('.play-button').hover(function() {
    $(this).css('background-position', 'bottom center');
});​

フィドルをチェック

于 2012-11-29T17:10:22.977 に答える
1

チェックしましたか？コードにタイプミスがありました。

あなたは最後にエンディングを逃しました);。

$(document).ready(function () {
    $('.slideshow-screen .slide-item-current .play-button').css({
        width: '90px',
        height: '90px',
            'background-color': '#0000ff',
            'background-image': 'url(http://www.lessardstephens.com/layout/images/slideshow_big.png)',
            'background-position': 'top center'
    });

    $('.slideshow-screen .slide-item-current .play-button').hover(function () {
        $(this).css('background-position', 'bottom center');
    },
    // Also you need to reset
    function () {
        $(this).css('background-position', 'top center');
    });
});​

修正済み：http：//jsfiddle.net/Vc84h/

于 2012-11-29T17:09:34.657 に答える