2013-05-10 3 views
-2

Я создаю сайт, на котором пользователи должны войти в систему, прежде чем просматривать содержимое веб-сайта. Я пытаюсь сделать это с помощью формы входа в оверлей, но проблема в том, что я не знаю, как закрыть оверлей после нажатия на кнопку «Отправить». Мне кажется, мне нужен JavaScript, но я ничего не знаю о Javascript.Как сделать наложение закрытым после регистрации пользователя

Может кто-нибудь мне помочь, пожалуйста? Спасибо!

Это то, что я намерен сделать:

<!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> 
+0

Java! = JavaScript 2 разных языках. Изучите его и верните, когда у вас есть более точный вопрос о коде. – Shikiryu

+0

Можете ли вы имитировать то же самое на http://Jsfiddle.net – dreamweiver

+0

@Shikiryu: это была типичная ошибка ввода. – dreamweiver

ответ

0

Прямой ответ на ваш вопрос: Добавить обработчик OnClick к представить элемент

<input type="submit" onclick="document.getElementById('overlay').style.display = 'none';" name="Submit" value="Submit" /> 

И внутри него:

  • Выберите элемент, который хотите скрыть
  • Скрыть его, установив его дисплей свойство «ни»

В общем, если вы хотите защитить свой контент, лучше

  • Скрыть накладку после Войти успешно (так в какой-то преуспевающим Аякса обратный вызов)
  • Не использовать JS/HTML, чтобы скрыть свое содержание, так как это легко можно найти из технически Сави пользователей
+0

Спасибо, Николай Нинарский. Я пытаюсь это прямо сейчас. – luchid

+1

Проблема, которая может произойти здесь, заключается в том, что после нажатия кнопки в форме будет обновлена ​​страница, а не макет, который вы скрыли наложение, в конце концов вы снова оказываетесь с видимым наложением. В этом случае было бы неплохо предоставить интерфейсу способ обнаружить, зарегистрирован ли пользователь, в котором реализована на стороне сервера. Так что, возможно, добавьте класс «вошел в систему» ​​в теле –

+0

@NickolayNinarski правильно ... Так почему бы вам не добавить это к своему ответу, чтобы он заполнил его? –

Смежные вопросы