1

Chrome (Windows 8) でクラス '.tile' の div に最初のホバーを実行すると、負のシフトのみが指定されている間、背景位置が反対方向に後退します。この動作は、そのような div ごとに最初のホバーで繰り返されます。ただし、後続のホバーでは繰り返されないようで、スムーズにスライドし、スタッターは発生しません。

古い jQuery アニメーションの吃音に関する FAQ で提案されているように、パディングを削除しようとしましたが、役に立ちませんでした (jQ 1.3+ には適用されなくなったと思いますが)。私はjQueryを初めて使用するので、少し助けていただければ幸いです。:)

$(function() {
    $('.tile').hover(function () {
        console.log('in');
        $(this).animate({
            'background-position-y': -($(this).children('figcaption').height())
        }, 'fast', 'linear');
        $(this).children('figcaption').slideToggle('fast');
    },
    function () {
        console.log('out');
        $(this).animate({
            'background-position-y': 0
        }, 'fast', 'linear');
        $(this).children('figcaption').slideToggle('fast');
    });
});
4

1 に答える 1

0

背景画像の高さがわからなかったため、css の背景位置規則により、中心からのオフセットを指定することは不可能であることに気付きました。

先に進み、画像サイズ変更スクリプト ( SLIR ) を使用して、画像をトリミングしました。結果の画像の寸法がわかっているので、絶対値を使用して背景を必要に応じて配置できます。

参考文献:

于 2013-12-19T18:18:21.627 に答える