jquery - 使用 jQuery 加载页面时的 CSS 过渡

Question

以下工作非常好，http://jsfiddle.net/pDERw/199/，我怎样才能在页面加载时发生这种情况，目前它工作悬停状态

div:hover{do something}

score 2 · Accepted Answer

这取决于你想要哪个，但你可以把你的代码放在里面：

$(document).ready(function(){ //your code here });

或者可能：

$(window).load(function(){ //your code here });

第一个将在 DOMready 上执行（当所有元素都加载到 DOM 中时），第二个将在所有图像等都渲染后执行。

看到您的示例，最好的方法可能是将您的 div:hover 状态的 css 添加到一个类中，并将该类添加到加载事件的元素中。下面是一个例子：

score 2 · Accepted Answer

你可以像这样创建一个黑客

<body>
    <div class="onLoad"><br /></div>
</body>

并将样式替换div :hover{ ... }为

.onLoad
{
    -webkit-animation: 'zoom' 3s;
    width: 392px;
    height: 285px; 
    right:300px; 
    opacity:0.9; 
}

score 0 · Accepted Answer

我的解决方案是将 div:hover 变成一个全新的类，例如 .animated_load ，然后使用 jQuery 在页面加载时为您的 div 分配类，如下所示：

$(document).ready($('#div_id').addClass('animated_load'));

3 回答 3