naurus 0 Report post Posted November 10, 2006 Today I was looking around for a good DHTML loading bar and couldn't find one so I decided to make it myself!Here is the javascript that goes into the <head> part of the doc: var x = 0;var y = 115;var a = 0;setTimeout(fadeIn, 1);function fadeIn(){document.getElementById("003").style.opacity=a;a = a+.1;if(a<1.1){setTimeout(fadeIn, 100);}else{setTimeout(progressBar, 1);}}function progressBar(){x = x+1;document.getElementById("001").style.width=x;document.getElementById("002").style.width=x;if(x<113){setTimeout(progressBar, 1);}else{setTimeout(fadeOut, 1000);}}function fadeOut(){document.getElementById("003").style.opacity=a;a = a-.1;if(a!=0){setTimeout(fadeOut, 100);}} And here is the table that I put the bars and text in:<table id="003" style="opacity: 0; text-align: left; margin-left: auto; margin-right: auto;" border="0" cellpadding="0" cellspacing="0"><tbody><tr><td style="vertical-align: top; text-align: center;"><hr id="001" style="border: 1px solid rgb(51, 119, 255); margin-bottom: 0px; height: 2px; width: 0px;" noshade="noshade"></td></tr><tr><td align="center" valign="top"><span style="color: rgb(51, 119, 255);">Loading Conent</span></td></tr><tr align="center"><td style="vertical-align: top;"><hr id="002" style="border: 1px solid rgb(51, 119, 255); margin-top: 1px; height: 2px; width: 0%;" noshade="noshade"></td></tr></tbody></table> Sorry, but this only works in FF, but with a little tweaking it could work in IE and Opera.Post if you have any Q's! Share this post Link to post Share on other sites
Saint_Michael 3 Report post Posted November 10, 2006 Although I could easily load this up and take a look at it, but it would be good to have a live demo link to show us what it looks like.Also your tables info could be converted to css as well make the coding look cleaner as well. Share this post Link to post Share on other sites
Hercco 0 Report post Posted November 10, 2006 I went for the bother to copy and paste and run it it browser. And it looked quite neat actually! I've been considering dhtml menus for me new site design and a loader like this would be quite neat. By the way, I tested in Opera 9.02 too and worked like a charm. And if it works in Firefox it'll work with all modern Gecko based browsers like Netscape and Mozilla. So I guess your script just doesn't work in IE. And we don't really care, right? Share this post Link to post Share on other sites
naurus 0 Report post Posted November 10, 2006 For hercco: Well, most people do use IE (which sucks!), so I will probably fix that by changing some of the CSS.For saint-michael: I made the tables in a WYSIWYG editor (NVU) but I could edit them manually if I needed to (the javascript is all original). And one of the reasons I posted this is that I need a good place to host my schools debate site, (which needs smtp). Share this post Link to post Share on other sites
Saint_Michael 3 Report post Posted November 10, 2006 Well for demo purposes you could use Xisto.net services you don't have to post, just have to deal with the ads. But since it is a demo you shouldn't have to worry about it.But to fix the problems you will have to convert it to css.Regardless if your a opera, ff, IE user, your designing a website for other people. Meaning you have to make sure the design is flawless all three browsers. Yeah it takes extra work to get it perfect, but after it's done oyu don't have to have to worry about making changes to the website while peopel are trying to access it. Share this post Link to post Share on other sites
naurus 0 Report post Posted November 10, 2006 (edited) Here is a live demo that is hosted on awardspace (which is crappy cuz it doesn't have SMTP).http://skriptkrypt.awardspace.com/Just click login and the page should come up. The script is in the sidebar. Edited November 10, 2006 by naurus (see edit history) Share this post Link to post Share on other sites
