Question

以下效果非常好，http://jsfiddle.net/pDERw/199/，如何在页面加载时实现这一点，此时它的工作状态为悬停状态

div:hover{do something}

Answer 1

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

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

或可能：

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

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

看到你的例子，最好的方法是将div：hover状态的css添加到类中，然后将类添加到load事件的元素上。以下是此示例：

Answer 2

你可以创建像这样的黑客

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

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

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

DEMO ：http://jsfiddle.net/chridam/pDERw/201/

Answer 3

我的解决方案是创建div：将鼠标悬停在一个像.animated_load这样的全新类中，然后使用jQuery在页面加载时将div分配给类：

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