我之前从未使用过jQuery,我想问一下如何做一些对你们来说简单的事情.我环顾四周但找不到答案.
好的,所以说我有一个HTML文档;
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
</head>
<body>
<h1>Hello world!</h1>
<p>Here is a message: <span id="message"></span></p>
</body>
</html>
我想问的是如何创建一个字符串列表,当页面加载时,显示第一个字符串,并在指定时间的随机间隔后,它将更改为下一个,依此类推,也可能在以后大约5个消息它会将用户重定向到另一个页面.
如果我的消息是:
Hello!
This is a website!
You are now going to be redirected.
Are you ready?
You're now being redirected...
在我的真实网站中,如果消息可以从用户隐藏(在页面上,但在css/js文件中它会没问题)并且它有一个很好的淡入淡出效果,因为下一个消息进来.
有人可以向我解释如何工作吗？
我只想补充一点,我没有jQuery的经验(只有一点JavaScript),我不知道脚本/函数在哪里.有人可以告诉我如何,或链接到初学者指南,告诉我这个？
Lie*_*yan 17
这是一种方法(jsfiddle演示):
function nextMsg() {
if (messages.length == 0) {
// once there is no more message, do whatever you want
alert("redirecting");
} else {
// change content of message, fade in, wait, fade out and continue with next message
$('#message').html(messages.pop()).fadeIn(500).delay(1000).fadeOut(500, nextMsg);
}
};
// list of messages to display
var messages = [
"Hello!",
"This is a website!",
"You are now going to be redirected.",
"Are you ready?",
"You're now being redirected..."
].reverse();
// initially hide the message
$('#message').hide();
// start animation
nextMsg();
稍加修改,您应该能够自定义每条消息的间隔.