如何使用jquery觸發類和懸停效果

Question

是否可以使用jquery設置下面的CSS？

像.addClass（）jQuery中

.macbook:not(:hover) .macbook-lid { 
    -webkit-transform: rotate3d(-1, 0, 0, 91deg); 
    -moz-transform: rotate3d(-1, 0, 0, 91deg); 
    transform: rotate3d(-1, 0, 0, 91deg); 
} 
.macbook:not(:hover) .macbook-lid:before { 
    width: 94%; 
} 

Answer 1

試試這個，

CSS

.macbook:not(:hover) .macbook-lid { } 
.test{ 
    -webkit-transform: rotate3d(-1, 0, 0, 91deg); 
    -moz-transform: rotate3d(-1, 0, 0, 91deg); 
    transform: rotate3d(-1, 0, 0, 91deg); 
} 
.macbook:not(:hover) .macbook-lid:before { 
    width: 94%; 
} 

SCRIPT

$('.macbook').on('click',function(){ 
    $('.macbook-lid').toggleClass('test'); 
}); 

Tried創建Demo

Answer 2

爲Ti可能使用jquery設置下面的CSS ??

是的。

JS：

$('.element').hover(function() { 
$(this).addClass('class-below'); 
}, function { 
$(this).removeClass('class-below'); 
}); 

CSS：

.class-below:before { .... } 

你會使用這個類來添加以下邏輯。