<html>
<head>
<title> Dynamic | Data </title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
function viewNextMsg() {
if (messages.length == 0) {
alert("Empty Array");
} else {
$('#message').html(messages.pop()).fadeIn(500).delay(1000).fadeOut(500, viewNextMsg);
}
};
var messages = [
"Message 1",
"Message 2",
"Message 3",
"Message 4",
"Message 5"
].reverse();
$('#message').hide();
viewNextMsg();
</script>
</head>
<body onload="viewNextMsg()">
<p>Here is a message: <span id="message"></span></p>
</body>
</html>
View in JS Fiddle
<head>
<title> Dynamic | Data </title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
function viewNextMsg() {
if (messages.length == 0) {
alert("Empty Array");
} else {
$('#message').html(messages.pop()).fadeIn(500).delay(1000).fadeOut(500, viewNextMsg);
}
};
var messages = [
"Message 1",
"Message 2",
"Message 3",
"Message 4",
"Message 5"
].reverse();
$('#message').hide();
viewNextMsg();
</script>
</head>
<body onload="viewNextMsg()">
<p>Here is a message: <span id="message"></span></p>
</body>
</html>
View in JS Fiddle
No comments:
Post a Comment