$(document).ready(function(){
function aaa(){
$('.poss img').toggle(function () {
$(this).css({border: '2px solid white'}).animate({
borderWidth: 2
}, 9000);
},function () {
$(this).animate({
borderWidth: 2
}, 9000);
aaa();
});
}
aaa();
});

.poss{
position: absolute;
width: 100%;
height: 100%;
top: 90px;
}
.poss img {
position: absolute;
border-radius: 80px;
border: 2px solid white;
box-shadow: 2px 2px 14px rgba(30, 38, 74, 0.86);
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-user-drag: none;
user-drag: none;
-webkit-touch-callout: none;
}

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- comt -->
<link rel="stylesheet" type="text/css" href='/stylesheets/style.css'>
<link rel="stylesheet" href="<%= baseUrl %>/stylesheets/bootstrap.css">
<script type="text/javascript" src="<%= baseUrl %>/javascripts/jquery-3.1.0.min.js"></script>
<script src="<%= baseUrl %>/javascripts/bootstrap.js"></script>
<script type="text/javascript" src="<%= baseUrl %>javascripts/appscript.js"></script>
<style>
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
width: 70%;
margin: auto;
}
</style>
</head>
<body background="<%= baseUrl %>images/back.jpg">
<div class="poss" style=" float: none; z-index: 1000; position: absolute; width: 20%; margin: 0 auto; left: 0px; right: 0px; " >
</div>
</body>
</html>
&#13;
这里我附上了html,css和j查询
在这里,我寻找减慢jquery中两个函数之间同时转换的速度。 <div>
图像应在页面加载后开始动画,而不会触发任何事件。我还想在切换上插入一个延迟。
答案 0 :(得分:0)
您可以使用javascript提供的setTimeout(function, milliseconds)
“计时事件”来完成此操作。
第一个参数是要执行的函数。
第二个参数表示执行前的毫秒数。
示例:
$('.poss img').toggle(function() {
$(this).css({
border: '2px solid white'
}).animate({
borderWidth: 2
}, 9000);
}, setTimeout(function() {
$(this).animate({
borderWidth: 2
}, 9000);
}, 3000));