How to change text after time using jQuery?

I found this code in stackoverflow HERE , but it does not work for me ...

I only see this:

Hello world! Here is a message: 

but I do not see messages that should change over time ...

I copy / paste all the code from my index.html file:

 <html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"> </script> </head> <body> <script type="text/javascript"> function nextMsg() { if (messages.length == 0) { alert("redirecting"); } else { $('#message').html(messages.pop()).fadeIn(500).delay(1000).fadeOut(500, nextMsg); } }; var messages = [ "Hello!", "This is a website!", "You are now going to be redirected.", "Are you ready?", "You're now being redirected..." ].reverse(); $('#message').hide(); nextMsg(); </script> <h1>Hello world!</h1> <p>Here is a message: <span id="message"></span></p> </body> </html> 

Thank you in advance:)

+6
source share
1 answer

Just change the order, do not run javascript at the beginning of the code always at the end and / or use a document ready to make sure dom is loaded before js is executed

 <h1>Hello world!</h1> <p>Here is a message: <span id="message"></span></p> <script> $(document).ready(function() { function nextMsg() { if (messages.length == 0) { alert("redirecting"); } else { $('#message').html(messages.pop()).fadeIn(500).delay(1000).fadeOut(500,nextMsg); } }; var messages = [ "Hello!", "This is a website!", "You are now going to be redirected.", "Are you ready?", "You're now being redirected..." ].reverse(); $('#message').hide(); nextMsg(); }); </script> 
+3
source

Source: https://habr.com/ru/post/979660/


All Articles