我正在使用下面的代码一次又一次地为文本设置动画,但下面的代码以我在下面的代码中提到的10个案例结束,但我要求文本一次又一次地动画。
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery TextFX - A jQuery Text Animation Engine</title>
<style type="text/css">
body{margin:0;padding:0;color:#333}#effectTwo{display:none}
</style>
<link rel="stylesheet" type="text/css" href="cj-text-fx.min.css" />
<script src="jquery-1.6.1.min.js" type="text/javascript"></script>
<script type="text/javascript">jQuery.noConflict();</script>
<script src="jquery.easing.1.3.min.js" type="text/javascript"></script>
<script src="cj-text-fx.min.js" type="text/javascript"></script>
<script type="text/javascript">
var isOn = 0,
sets, fx, toAnimate = "#effect",
settings = {
animation: 8,
animationType: "in",
backwards: !1,
easing: "easeOutQuint",
speed: 1E3,
sequenceDelay: 100,
startDelay: 0,
offsetX: 100,
offsetY: 50,
onComplete: fireThis,
restoreHTML: !0
};
jQuery(document).ready(function () {
fx = jQuery("#effect");
jQuery.cjTextFx(settings);
jQuery.cjTextFx.animate(toAnimate)
});
function fireThis() {
if (isOn !== 13) {
isOn < 13 ? isOn++ : isOn = 0;
switch (isOn) {
case 1:
sets = {
animationType: "out",
restoreHTML: !1
};
break;
case 2:
fx.html("Systematic Approch for Innovation");
sets = {
animation: 11
};
break;
case 3:
sets = {
animation: 11,
animationType: "out",
restoreHTML: !1
};
break;
case 4:
fx.html("Systematic Approch for Innovation");
sets = {
animation: 1
};
break;
case 5:
sets = {
animation: 1,
animationType: "out",
restoreHTML: !1
};
break;
case 6:
fx.html("Systematic Approch for Innovation");
sets = {
animation: 6,
backwards: !0
};
break;
case 7:
sets = {
animation: 4,
animationType: "out",
backwards: !0,
restoreHTML: !1
};
break;
case 8:
fx.html("Systematic Approch for Innovation");
sets = {
animation: 2,
easing: "easeOutBounce"
};
break;
case 9:
sets = {
animation: 2,
animationType: "out",
speed: 500,
easing: "easeInBack",
restoreHTML: !1
};
break;
case 10:
fx.html("Systematic Approch for Innovation"), sets = {
animation: 14,
startDelay: 1E3,
linked: !0,
hyperlink: "generator.html",
color: "#0000FF",
linkTarget: "_self",
onComplete: null
}
}
jQuery.cjTextFx.animate(toAnimate, sets)
}
};
</script>
</head>
<body>
<div id="container">
<div id="text-fx">
<div id="effect">Systematic Approch for Innovation</div>
</div>
</div>
</body>
</html>
请告诉我解决问题的方法。迫在眉睫。提前致谢。
答案 0 :(得分:0)
变化:
if (isOn !== 13) {
isOn < 13 ? isOn++ : isOn = 0;
和
case 10:
fx.html("Systematic Approch for Innovation"), sets = {
animation: 14,
startDelay: 1E3,
linked: !0,
hyperlink: "generator.html",
color: "#0000FF",
linkTarget: "_self",
onComplete: null
}
}
jQuery.cjTextFx.animate(toAnimate, sets)
要:
isOn !== 11 ? isOn++ : isOn = 0;
和
case 10:
fx.html("Systematic Approch for Innovation"), sets = {
animation: 14,
startDelay: 1E3,
linked: !0,
hyperlink: "generator.html",
color: "#0000FF",
linkTarget: "_self",
onComplete: function(){
jQuery.cjTextFx.animate(toAnimate, sets)
}
}
}