Response title
This is preview!
Loading new content into a div - old content still displaying before new content loads
in Using jQuery
•
9 years ago
I'm trying to provide basic password protection for certain pages on a site. What I want to happen is when they enter the password, the new page fades in. What is actually happening is that "loading" flashes on the screen, then the old content (gallerychoose2), then the new content flashes twice and stays there. I can't seem to get it so that the page goes blank or says "loading" and is then replaced by the new content. This should be really simple, but I can't seem to get it to work! Any ideas? Thanks!
- <head>
- <title></title>
-
- </head>
- <body>
- <script>
- $("#words").html('<p> Loading...<\/p>');
- //this script is to add password protection to a gallery.
- var pw="demo";//change "demo" to whatever password you want to use.
- var password=prompt('This is a password protected area, please enter your password to continue', '');
- if (password.toLowerCase()==pw)
- $("#words").load('landgallery.html', function(){
- $("#words").fadeIn('600');
- })
- else if (password.toLowerCase()!=pw)
- var password=prompt('Incorrect password, please try again.', '');
- if (password.toLowerCase()==pw)
- $("#words").load('landgallery.html', function(){
- $("#words").fadeIn('600');
- })
- else if (password.toLowerCase()!=pw)
- alert('Incorrect password. Please contact us to obtain your password.','');
- $("#words").load('gallerychoose2.html', function(){
- $("#words").fadeIn('600');
- })
-
- </script>
- <div id="words"><p>Loading...</p></div>
- </body>
1