CSS3转换很棒!到目前为止,我通过以下方式触发它们:hover或:样式表中的活动声明.我正在寻找是否有办法从jquery触发它们.
例如:
@H_404_4@#MyDiv{ border:1px solid red; background:blue; transition: all 0.3s linear; } MyDiv:hover{ border:1px solid black; background:yellow; }当鼠标在MyDiv上移动时,鼠标移动将触发,但是我想要做的就是:
@H_404_4@$('#MyDiv').transition(hover); //that would be ideal换句话说,我想触发css动画,如果我将鼠标悬停在其他div上,#MyDiv动画将以$(‘#SomeOtherDiv’)触发.mouseenter(function(){$(‘#MyDiv’) .transition(hover);});
jquery动画功能不支持颜色转换,而我知道您可以添加jqueryUI插件使其正常工作,我想知道是否有一些方法可以使其无效,使用jquery调用css转换.
谢谢.
解决方法
@H_404_4@#MyDiv {
border:1px solid red;
background:blue;
transition: all 2.0s linear;
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
-ms-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
}
.hover{
border:1px solid black;
background:yellow;
transition: all 2.0s linear;
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
-ms-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
}
$("#MyOtherDiv")
.mouseenter(function(){
$("#MyDiv").addClass("hover");
})
.mouseleave(function(){
$("#MyDiv").removeClass("hover");
});