javascript - jQuery 切换动画仅在 Safari 中失败

Question

JS:

$('.greenBox').hover(function(){
    $(this).addClass('expanded');
    $(this).removeClass('contracted');
}, function(){
    $(this).removeClass('expanded');
    $(this).addClass('contracted');
});

CSS:

.expanded {
    height: auto;
    min-height:200px;
    max-height:750px;
    margin-top:5px;
    // to make the box move up add back the bottom 300px
    // bottom: 300px;
    background: linear-gradient(#812990, #9e248e);
    -webkit-transition-timing-function: linear; 
    transition-timing-function: linear; 
}

这是“contracted”类。

.contracted {
    max-height: 137px;
    overflow:hidden;
}

Answer 1

jQuery 正在运行。 Safari 中的背景颜色不会改变，因为您需要使用:

background: -webkit-linear-gradient(#812990, #9E248E);

http://jsfiddle.net/hsqgqojx/