1
divの上にマウスを置くと、いくつかのエフェクトが発生します。問題は、divには擬似要素:: afterがあることです。コンテンツ要素のCSSルールを使用して、divを仮想要素(再生ボタン)に設定します。jQueryのホバーエフェクト:: after
私のホバー効果は、:: after要素がある場所以外のdivの部分をホバリングしているときに機能します。
jQueryを使用して:: after要素を指す方法があるかどうかを知りたいだけです。 :: after要素を "play"という名前の変数として定義しようとしましたが、そこには運がありませんでした。これは私のスクリプトです:
var play = $('a.image-wrap::after');
$(".image-holder, .big-headline a, .small-headline a, play").on({mouseenter: function() {
$('.image-holder').css('background-color', color);
$('.image-holder img').css({
'mix-blend-mode': 'multiply',
opacity: .6
});
if ($(window).width() > 1115) {
$('.read').css('right', '35%');
} else {
$('.read').css('right', '0');
}
},
mouseleave: function() {
$('.image-holder').css('background-color', '');
$('.image-holder img').css({
'mix-blend-mode': '',
opacity: ''
});
$('.read').css('right', '');
}
});
は、より良いあなたがアクセスすることはできません::後、:: JSを使用する前に、 – user7417866
をjQueryのないCSSでそれを処理します。あなたはCSSを使用して –
を変換する必要があります。親要素にクラスを追加して、それをターゲットにすることはできません。例えば、.hovering:hover:after' – Pete