Welcome to WebmasterWorld Guest from 54.145.167.92

Forum Moderators: open

Message Too Old, No Replies

Animated "Loading." ?

   
7:34 am on Jun 13, 2008 (gmt 0)

5+ Year Member



I simply want to display "Loading" with 3 periods after it. But, I'd like the periods to come in sequentially. Such as:

Loading.
Loading..
Loading...

So loading is always there but there's 1 period, then 2, then 3. And repeat. How do I do this?

8:31 am on Jun 13, 2008 (gmt 0)

10+ Year Member



Try an animated GIF
9:48 am on Jun 13, 2008 (gmt 0)

5+ Year Member



lol

Okay, I was trying to not go that route since I've seen what I'm aiming for other places but you do have a point.
thanks

10:57 am on Jun 13, 2008 (gmt 0)

5+ Year Member



Hi,

Try this:

<html>
<head>
<script type="text/javascript">
window.onload=function(){
var dotspan = document.getElementById('dots');
window.setInterval(function(){
if(dotspan.textContent == '...'){
dotspan.textContent = '.';
}
else{
dotspan.textContent += '.';
}
}, 1000);
}
</script>
</head>
<body>
<p>Loading<span id="dots">.</span>
</body>
</html>

Andrew

6:57 pm on Jun 13, 2008 (gmt 0)

5+ Year Member



Do all browsers support textContent? And why use textContent instead of innerHTML? What are the advantages?
2:34 pm on Jun 14, 2008 (gmt 0)

5+ Year Member



Hi,

No, I didn't check before, but IE doesn't support textContent. IE's equivalent of textContent is innerText rather than innerHTML.
I didn't use innerHTML because the text I was setting did not need to be interpreted as HTML (this might only save a couple of nanoseconds, but every little helps!). I used textContent because that's the standard [w3.org]. So the code I posted above will only work in standards compliant browsers.

Andrew

8:52 am on Jun 18, 2008 (gmt 0)

5+ Year Member



Oh, by the way, thank you G :) Works in Firefox, any people using IE can just see "Loading." without the extra cool animated dots till I fix it :D

lol