Так вот же, с кодом, или выбирайте любое по ссылке в поиске.
Только вместо onmouseup="setTimeout('sexyTOG()',1);" - или ничего, если подгрузка не по аяксу (но тогда не сможете обработать ошибку скрипта на сервере - неприход ответа через нек.время. напр.), или это самое sexyTOG() при успешном приходе ответа ajax + сам ответ куда-нибудь вывести. Ну и названия поменять и поставить ссылку на перезагрузку для юзера, которому надоест ждать.
| Код |
<script type="text/javascript">
function $(v) { return(document.getElementById(v)); }
function $S(v) { return($(v).style); }
function agent(v) { return(Math.max(navigator.userAgent.toLowerCase().indexOf(v),0)); }
function isset(v) { return((typeof(v)=='undefined' || v.length==0)?false:true); }
function XYwin(v) { var z=agent('msie')?Array(document.body.clientHeight,document.body.clientWidth):Array(window.innerHeight,window.innerWidth); return(isset(v)?z[v]:z); }
function sexyTOG() { document.onclick=function(){ $S('sexyBG').display='none'; $S('sexyBOX').display='none'; document.onclick=function(){}; }; }
function sexyBOX(v,b) { setTimeout("sexyTOG()",100); $S('sexyBG').height=XYwin(0)+'px'; $S('sexyBG').display='block'; $('sexyBOX').innerHTML=v+'<div class="sexyX">(click outside box to close)'+"<\/div>"; $S('sexyBOX').left=Math.round((XYwin(1)-b)/2)+'px'; $S('sexyBOX').width=b+'px'; $S('sexyBOX').display='block'; }
</script>
<style type="text/css">
#sexyBG { display: none; position: absolute; background: #000; opacity: 0.7; -moz-opacity: 0.7; -khtml-opacity: 0.7; filter: alpha(opacity=40); width: 100%; height: 100%; top: 0; left: 0; z-index: 99; }
#sexyBOX { display: none; position: absolute; background: #b9e77b; color: #333; font-size: 1.2em; text-align: center; border: 1px solid #111; top: 70px; z-index: 100; }
.sexyX { font-size: 12px; color: #ddd; padding: 4px 0; border-top: 1px solid #636D61; background: #778574; }
</style>
<div class="Summery">
<div class="wrap">
<h1></h1>
This will create a basic “lightbox” or “thickbox” interface using HTML masking.<br><br>
<b>Example:</b> <div id="sexyBG"></div>
<div id="sexyBOX" onmousedown="document.onclick=function(){};" onmouseup="setTimeout('sexyTOG()',1);"></div>
<a href="#" onclick="sexyBOX('YourURL','300'); return false;">Open SexyBox!</a>
</div>
</div>
|
|
)