gpt4 book ai didi

javascript - X 秒后执行 jQuery 翻转

转载 作者:行者123 更新时间:2023-11-28 06:45:34 26 4
gpt4 key购买 nike

挣扎于“css vendor 前缀”,但无法让它在所有设备上工作。那么现在,让我们尝试一个名为 jQuery flip 的 jQuery 解决方案。

它在触发器上运行完美:“悬停”和“单击”但触发器“手动”需要根据此处的文档通过 JavaScript 激活:http://nnattawat.github.io/flip/

所以我的问题是:如何编写 javascript 以在 3 秒后激活翻转功能?

代码:

<head>
<style type="text/css">
.card {
width: 600px;
height: 400px;
margin: 20px;
}
.front, .back {
border: 2px gray solid;
padding: 10px;
}
.front {
background-color: #ccc;
}
.back {
background-color: red;
}
</style>
</head>
<body>
<div id="card-1" class="card">
<div class="front">
Front: Cursus aliquet mus et sociis, placerat adipiscing a placerat magnis integer nisi lacus in, turpis porttitor? Lectus nunc dis in porta, montes lacus. Tortor. Pid sit nisi eu nec aenean.
</div>
<div class="back">
<a href="http://google.com">link</a>
Back: Dolor scelerisque ridiculus! Mus? Augue, montes, montes proin rhoncus vel a parturient dapibus eros? Penatibus nascetur. In turpis nisi elementum nascetur habitasse augue egestas, in ac rhoncus odio porttitor turpis.
</div>
</div>

<script type="text/javascript">
$(function(){
// $(".card").flip();

$("#card-1").flip({
axis: "y", // y or x
reverse: false, // true and false
trigger: "manual", // click, hover or manual
speed: 500
});
});
</script>
</body>

提前致谢!

最佳答案

使用setTimeout()实现这一目标。

$(function(){

$("#card-1").flip({
axis: "y", // y or x
reverse: false, // true and false
trigger: "manual", // click, hover or manual
speed: 500
});

setTimeout(function(){
$("#card-1").flip(true);
}, 3000);

});

关于javascript - X 秒后执行 jQuery 翻转,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34067787/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com