Jak sprawic zeby to okno dialogowe wyswietliło sie po kliknieciu w jakis przycisk ?
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">
<script type="text/javascript">
* Pokaż okno dialogowe
* @param what - klasa diva do otwarcia, np '.okno'
* @param w - szerokość okna w pikselach
*/
function showdial(what, w) {
var wd = $(window).width();
var hg = $(window).height();
// przesuwamy okno do środka
$('.'+what).css({width:w});
var dialLeft = (wd/2) - ($("."+what).width()/2);
var dialTop = 50;
// dial_over to id diva przyciemnionego tła,
// uniemożliwia ono interakcję z innymi elementami strony.
$('#dial_over').css({height:hg, width:wd}).show();
$('.'+what).css({left:dialLeft,top:dialTop}).show();
}
/**
* Zamknij okno
* @param co - klasa diva do zamknięcia.
*/
function kill(co) {
$('#dial_over').hide();
$('.'+co).hide();
}
</script>
<style type="text/css">
#dial_over {
width:100%;
height:100%;
/* przezroczystość */
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity:0.5;
opacity:0.5;
background:#000;
position:absolute;
left:0px;
top:0px;
z-index:100;
display:none;
}
#dial {
background:#fff;
/* cień pod oknem */
-moz-box-shadow:1px 1px 5px #555;
-webkit-box-shadow:1px 1px 5px #555;
box-shadow:1px 1px 5px #555;
display:none;
top:30px;
z-index:200;
position:absolute;
/* zaokrąglone rogi, nie działają w IE */
-o-border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
text-align: left;
}
</style>
<div id='dial' class='klasa'><em>tu jego treść</em></div>