CSS：在鼠标移出时转换不透明度？
.item:hover { zoom: 1; filter: alpha(opacity=50); opacity: 0.5; -webkit-transition: opacity .15s ease-in-out; -moz-transition: opacity .15s ease-in-out; -ms-transition: opacity .15s ease-in-out; -o-transition: opacity .15s ease-in-out; transition: opacity .15s ease-in-out; } 为什么只有当我hover时才会使不透明度变成animation，而不是当我用鼠标离开物体时？
在这里演示： http : //jsfiddle.net/7uR8z/
您只将转换应用到:hover伪类，而不是元素本身。
.item { height:200px; width:200px; background:red; -webkit-transition: opacity 1s ease-in-out; -moz-transition: opacity 1s ease-in-out; -ms-transition: opacity 1s ease-in-out; -o-transition: opacity 1s ease-in-out; transition: opacity 1s ease-in-out; } .item:hover { zoom: 1; filter: alpha(opacity=50); opacity: 0.5; }
演示： http : //jsfiddle.net/7uR8z/6/
如果您不希望转换影响mouse-over事件，而只是mouse-out :hover ，则可以closures:hover状态的转换：
.item:hover { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; zoom: 1; filter: alpha(opacity=50); opacity: 0.5; }
演示： http : //jsfiddle.net/7uR8z/3/
顺便说一句，我在FIREFOX中一直苦苦挣扎着，直到我意识到你在单词opacity中有一个错字：
-moz-transition: opactiy .15s ease-in-out;
需要是
-moz-transition: opacity .15s ease-in-out;
我设法find一个解决scheme使用CSS / jQuery，我很舒服。 最初的问题：我不得不强制显示animation，因为我有悬挂在该地区以外的元素的可见性。 这样做，在animation过程中，现在使大块文本悬挂在内容区域之外。
解决scheme是启动不透明度为0的主文本元素，并使用addClass注入并转换为不透明度为1的removeClass 。然后在再次单击时removeClass 。
我确定有一个所有的jQquery方法来做到这一点。 我只是不是做这件事的人。 🙂
所以这是最基本的forms
.slideDown().addClass("load"); .slideUp().removeClass("load");
感谢大家的帮助。
$(window).scroll(function() { $('.logo_container, .slogan').css({ "opacity" : ".1", "transition" : "opacity .8s ease-in-out" }); });
检查小提琴： http : //jsfiddle.net/2k3hfwo0/2/
