Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Передача параметра в модальное окно (https://javascript.ru/forum/jquery/46349-peredacha-parametra-v-modalnoe-okno.html)

cript 06.04.2014 23:43

Передача параметра в модальное окно
 
Приветствую!
Есть такой код модального диалога:
<script>
$(document).ready(function () {
$('a.btn-ok, #dialog-overlay, #dialog-btn').click(function () {		
$('#dialog-overlay, #dialog-box').hide();		
return false;
});
$(window).resize(function () {
if (!$('#dialog-box').is(':hidden')) popup();		
});		
});
function popup(message) {
var maskHeight = $(document).height();  
var maskWidth = $(window).width();
var dialogTop = (maskHeight/3) - ($('#dialog-box').height());  
var dialogLeft = (maskWidth/2) - ($('#dialog-box').width()/2); 
$('#dialog-overlay').css({height:maskHeight, width:maskWidth}).show();
$('#dialog-box').css({top:dialogTop, left:dialogLeft}).show();
$('#dialog-message').html(message);			
}
</script>
<div id="dialog-box">
<div class="dialog-content">
<div id="dialog-message" align="center">
<img src="">
</div>
</div>
</div>
<a href="#dialog-box" rel="test.gif" onclick="javascript:popup();">test.gif</a>

Подскажите как передать название изображения (параметр) в диалоговое окно?

Aetae 06.04.2014 23:55

onclick="popup('<img src=\'test.gif\'>');"

cript 07.04.2014 00:33

Цитата:

Сообщение от Aetae (Сообщение 306497)
onclick="popup('<img src=\'test.gif\'>');"

И как ее в итоге отобразить?

Aetae 07.04.2014 00:49

Щито?
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script>
$(document).ready(function () {
$('a.btn-ok, #dialog-overlay, #dialog-btn').click(function () {    
$('#dialog-overlay, #dialog-box').hide();      
return false;
});
$(window).resize(function () {
if (!$('#dialog-box').is(':hidden')) popup();      
});    
});
function popup(message) {
var maskHeight = $(document).height(); 
var maskWidth = $(window).width();
var dialogTop = (maskHeight/3) - ($('#dialog-box').height()); 
var dialogLeft = (maskWidth/2) - ($('#dialog-box').width()/2);
$('#dialog-overlay').css({height:maskHeight, width:maskWidth}).show();
$('#dialog-box').css({top:dialogTop, left:dialogLeft}).show();
$('#dialog-message').html(message);        
}
</script>
<div id="dialog-box">
<div class="dialog-content">
<div id="dialog-message" align="center">
<img src="">
</div>
</div>
</div>
<a href="#dialog-box" rel="test.gif" onclick="popup('<img src=\'http://javascript.ru/forum/images/ca_serenity/misc/logo.gif\'>');">test.gif</a>

cript 07.04.2014 03:17

Aetae,
Отлично работает, только вот еще проблема, при добавлении display:none не срабатывает, а именно:
<style>
#dialog-box {	
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
background: #eee;
width: 428px; 
position: absolute; 
z-index: 5000; 
display: none;
}
</style>

А без этого окно остается открытым...

cript 07.04.2014 23:18

Цитата:

Сообщение от Aetae
onclick="popup('<img src=\'test.gif\'>');"

Еще в таком случае отображается только картинка, то есть если в блоке присутствует еще какой либо текст, то он будет заменен на переданное изображение..

Aetae 08.04.2014 00:44

Это следует из вашего кода.

cript 08.04.2014 01:01

Цитата:

Сообщение от Aetae
Это следует из вашего кода.

Может есть какое нибудь еще решение?

Aetae 08.04.2014 01:07

Есть. Написать именно то, что вам нужно. Мне это делать неохота.

cript 08.04.2014 02:21

Может кто нибудь знает как провести выборку из адресной строки?


Часовой пояс GMT +3, время: 01:11.