javascript - how to make overlay close after user register -
i building website users supposed login before viewing website content. try overlay login form problem not know how make overlay close after user press submit. think need javascript not know javascript.
can me, please? thank you!
this intend do:
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>css overlay</title> <style type="text/css"> html { height: 100%; min-height: 100%; } body { height: 100%; min-height: 100%; font-family:georgia, sans-serif; } #overlay { background: rgba(0,0,0,0.4); width: 100%; height: 100%;min-height: 100%; position: fixed; top: 0; left: 0; z-index: 10000; header, section,footer { width: 800px; margin: 0 auto 20px auto; padding: 20px; background: #ff0; } section { min-height: 1500px; } </style> </head> <body> <div id="overlay"></div> <section> <form> <input type='hidden' name='submitted' id='submitted' value='1'/> <label for='username' >username*:</label> <input type='text' name='username' id='username' maxlength="50" /> <br> <label for='password' >password*:</label> <input type='password' name='password' id='password' maxlength="50" /> <br> <input type='submit' name='submit' value='submit' /> </form> </section> </body> </html>
the direct answer question is: add onclick handler submit element
<input type="submit" onclick="document.getelementbyid('overlay').style.display = 'none';" name="submit" value="submit" /> and inside it:
- select element want hide
- hide setting it's display property 'none'
in general if want protect content it's better to
- hide overlay after login successful (so on kind of successfull ajax callback)
- not use js/html hide content since it's easy found tech-savy users
Comments
Post a Comment