Как получить всплывающее окно div, нажав кнопку «Отправить», используя модный ящик / лайтбокс?

0

моя отметка

<div class="popup bg-white"><!--pop up box begins-->
            <a href="" class="close-btn fr center_text">
                <b class="small-font">X</b>
                <span>CLOSE</span>
            </a>
            <div class="popup-title medium_18 font-bold">Please edit your details below:</div>
            <div class="clearfix">  
                <input type="text" class="input_box" value="" name="" placeholder="Miss Rachael Short" size="49" />
            </div>  
            <div class="clearfix">
                <input type="text" class="input_box" value="" name="" placeholder="Industrial Way" size="49" />
            </div>  
            <div class="clearfix">  
                <input type="text" class="input_box" value="" name="" placeholder="Bath" size="49" />
            </div>
            <div class="clearfix">  
                <input type="text" class="input_box" value="" name="" placeholder="Somerset" size="49" />
            </div>  
            <div class="clearfix">  
                <input type="text" class="input_box" value="" name="" placeholder="BA2 8SF" size="49" />
            </div>
            <button class="btn btn-common fr btn-big auto_width" value="submit" type="submit" name="submit">EDIT</button>
        </div><!--pop up box ends-->

Кнопка <button class="btn btn-common fl btn-myacc auto_width" value="submit" type="submit" name="submit">EDIT</button>

[UPDATE] css .popup { visiblity: hidden }

Мне нужно всплывать popup div при нажатии кнопки EDIT.

Как я могу обменивать код JS для этого? Мой сайт имеет скрипт fancybox в заголовке.

  • 1
    Добавить onclick = "show_dialog ()" к вашей кнопке ??
  • 0
    спасибо за предложение, но это не работает.
Теги:
popup
fancybox
lightbox

1 ответ

1
Лучший ответ

Поместите свою кнопку за пределы всплывающего div, дайте уникальный идентификатор всплывающему div и классу на свою кнопку и соответствующим образом настройте свой код fancybox.

демонстрация

HTML

<div id="popupID" class="popup bg-white"><!--pop up box begins-->
        <!-- rest of the html -->    
</div><!--pop up box ends-->

<button class="fancybox btn btn-common fr btn-big auto_width" value="submit" type="submit" name="submit">EDIT</button>

JQuery

$(".fancybox").fancybox({
    'href' : '#popupID'
});
Поделиться
  • 0
    спасибо @shubhra .. все работает нормально.
  • 0
    но как изменить причудливую ширину и высоту коробки? это автоматически для высоты и 130px для ширины автоматически. Я попробовал <script> $(".fancybox").fancybox({'href' : '#popupID', 'width' : 600, 'height' : 600 }); </script> но не работает
Показать ещё 3 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню