M2DAI Ответов: 1

Всплывающая форма не отображается, когда я нажимаю на кнопку


@import url(https://fonts.googleapis.com/css?family=Bree+Serif);
@import url(https://fonts.googleapis.com/css?family=Open+Sans);

* {
  margin: 0;
  padding: 0;  
}

body {
 background: beige;
  color: #B1B1B1; 
}

#contactform {
border-radius:25px;
background:white;
cursor:pointer;
border-color: red;
box-shadow:0px 20px 20px -20px;
width: 90px;
height: 50px;
position: fixed;
bottom: 0 !important;
right: 0 !important;
justify-content: right !important;
}

#contact {
  overflow: auto;
}


{
    box-sizing: border-box;
 }

#contact #form {
  max-width: 410px;
  float:bottom;
  position:right;
  width:410px;
  display: none;
  bottom: 0;
  right: 15px;
  border: 3px solid #f1f1f1;
  z-index: 9;
}
#contact #form h2 {
  font: 48px 'Bree Serif', Georgia, serif;
}
#contact #form span {
  display:block;
  float:left;
  width:100px;
  padding-top:5px;
  font: 14px/16px'Bree Serif', Georgia, serif;
}
#contact #form input {
  float:left;
  width:255px;
  border:0px;
  color:#F1F1F1;
  padding:10px 10px 10px 30px;
  font: 11px/20px'Open Sans', Verdana, Helvetica, sans-serif;
  margin-bottom:10px;
}
#contact #form textarea {
  float:left;
  border:0px;
  width:255px;
  height:140px;
  padding:10px 10px 10px 30px;
  font: 11px/20px'Open Sans', Verdana, Helvetica, sans-serif;
  color:#F1F1F1;
  resize: none;
}
#contact #form input.name {
  background:#222222 url(http://img7.uploadhouse.com/fileuploads/17737/177370145f09fe433945815665aa214f80dbc6af.png) no-repeat 10px 8px;
}
#contact #form input.email {
  background:#222222 url(http://img6.uploadhouse.com/fileuploads/17737/177370138cc63992182149e9befabff3eafa6d23.png) no-repeat 10px 9px;
}
#contact #form input.captcha {
  background:#222222 url(http://img3.uploadhouse.com/fileuploads/17737/17737011310213e71805ecf2292144cbbecf42ad.png) no-repeat 10px 9px;
}
#contact #form textarea.message {
  background:#222222 url(http://img3.uploadhouse.com/fileuploads/17737/1773701229ed8c2f465a8274623ca8976adaf196.png) no-repeat 10px 8px;
}
#contact #form input.submit {
  cursor: pointer;
  width:85px;
  height:30px;
  float:right;
  padding:0px 0px 5px 0px;
  margin:10px 16px 0px 0px;
  background:#222222;
  color:#F1F1F1;
  font: 14px/16px'Bree Serif', Georgia, serif;
}
#contact #form input.btn cancel {
  cursor: pointer;
  width:85px;
  height:30px;
  float:left;
  padding:0px 0px 5px 0px;
  margin:10px 16px 0px 0px;
  background:#222222;
  color:#F1F1F1;
  font: 14px/16px'Bree Serif', Georgia, serif;
}
#contact #captcha span{
  width: 24px;
}
#contact #captcha input{
  background: url(http://img3.uploadhouse.com/fileuploads/17737/17737011310213e71805ecf2292144cbbecf42ad.png) no-repeat scroll 0 0 transparent;
  margin: 5px 0 0;
  padding: 0;
  border: medium none;
  cursor: pointer;
  width: 15px;
}


Что я уже пробовал:

I added to the code...

    {
        box-sizing: border-box;
     }

MadMyche

Вы понимаете, что предоставленный код не имеет ни формы, ни кнопки, чтобы его открыть?

M2DAI

да... Я пропустил HTML-часть ... но удостоверения личности и классы есть.

ZurdoDev

И что мы можем сделать с этим, не видя html? Вы сказали, что у вас есть кнопка, которая не будет выполнять код, но не показали нам код для кнопки.

1 Ответов

Рейтинг:
0

Dan Parks

Предполагая, что у вас есть всплывающий модал в вашем коде, есть вероятность, что если у вас есть HTMl и CSS, то причина, по которой он не отображается, заключается в конфликте jQuery. Это распространенная проблема, но, не видя вашего полного всплывающего модального кода, никто не может помочь.

Проверьте консоль разработчика в chrome и посмотрите, есть ли какая-либо ошибка jquery в разделе "консоль", если нет, Пожалуйста, включите свой полный модальный код здесь.