вывод информации в модальном окне
вывод в модальном окне
instantcms.ru/blogs/voznemozhno/modul-vsplyvayushe-okno.html не это ищите?
ну там я как понял из комментариев к 1,9 версии а у меня 1,10,3!
$(document).ready(function() { $('.open-window').click(function() { $('.modal-window').fadeIn(function() { $('.window-container').addClass('visible'); }); }); $('.close, .modal-window').click(function() { }); $('.window-container').click(function(event) { event.stopPropagation() }); });
<div class="open-window" >название ссылки:</div> </div> <div id="modal-window" class="modal-window"> <div class="window-container animation"> // здесь что выводишь </div> </div>
<a href="путь до файла" rel="#modal-window"> <button type="button" class="open-window" >название ссылки</button> </a> <div id="modal-window" class="modal-window"> <div class="window-container animation"> </div> </div>
<script src="/папка/modal.js" type="text/javascript"></script>
Вы вероятно стили для самого окно не прописали. Вот мои.
.modal-window { background: rgba(0, 0, 0, 0.5); display: none; height: 100%; width: 100%; left: 0; top: 0; position: fixed; overflow-y: scroll; z-index: 9999; } .window-container { border-radius:8px; border-top:30px solid #6097D8; background: #ffffff; display: block; margin: 10% auto; padding: 20px; width: 500px; z-index: 9999; opacity: 0; -webkit-transition: 0.4s; -moz-transition: 0.4s; -ms-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; cursor:pointer; } .animation { -webkit-transform: scale(0.5); -moz-transform: scale(0.5); -ms-transform: scale(0.5); transform: scale(0.5); } .visible { opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .close { display: block; cursor: pointer; position:absolute; right:10px; top:-20px; } .window-container form { padding:5px; text-align:center; }