[Web2.0] Scurire la pagina

Mar 19 Dic 2006 18:15:43 CET

Andrea Colanicchia ha scritto:
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
> <html>
> <head>
>   <title>BLUR Example</title>
>     <script language="javascript">
>         nav = (typeof document.all!=="undefined")?"ie":"moz";
>         show = false
>        
>         function doBlur()
>         {
>             el = document.getElementById('test');
>
>             el.style.display = 'block';
>             show = true
>         }
>        
>         function doUnblur()
>         {
>             el = document.getElementById('test');
>
>             el.style.display = 'none';
>             show = false
>         }
>     
>         function resizeBackground()
>         {
>             el = document.getElementById('test');
>            
>             el.style.width = ((document.documentElement.clientWidth)?
> document.documentElement.clientWidth : document.body.clientWidth) +
> "px";
>             el.style.height = ((document.documentElement.clientHeight)?
> document.documentElement.clientHeight : document.body.clientHeight) +
> "px";
>         }
>        
>         if (nav == "ie")
>         {
>             window.onresize = function () { if(show) { 
> resizeBackground(); } }
>         }
>         else
>         {
>             window.addEventListener('resize', resizeBackground, false);
>         }
>     </script>
>     <style type="text/css">
>         #test {
>             position: absolute;
>             top: 0px;
>             left: 0px;
>             width: 100%;
>             height: 100%;
>             display: none;
>             text-align:right;
>             background:
>             black; filter:alpha(opacity=60);
>             -moz-opacity: 0.6;
>             opacity: 0.6;
>             border-style: none;
>             padding: 0;
>             margin: 0;
>             z-index: 999;
>         }
>     </style>
> </head>
> <body id="body" onload="resizeBackground()">
>
> <input type="button" name="click" value="blur" onclick="doBlur();">
>
> <p>
> asdas da dadasdasdasdads ads ads<br>
> ad asdasd ads ads asd ads asd ads<br>
> ads asd adsadsads ads ads asd ads<br>
> a sdas<br>
> <br>
> asdas da dadasdasdasdads ads ads<br>
> ad asdasd ads ads asd ads asd ads<br>
> ads asd adsadsads ads ads asd ads<br>
> a sdas<br>
> <br></p>
>
> <div id="test">
>   <input type="button" name="unblur" value="close" onclick="doUnblur()">
> </div>
>
> </body>

Su Opera 9.01 non funziona come dovrebbe a me.
Su FF2, IE6 e IE7 avete fatto voi e confermo :-D

Penso comunque che sia giusto dire "meglio smanettare e farsi le 5 righe 
di codice per apprendere piuttosto che copiare librerie già fatte", però 
se sono state linkate le risorse alla lightbox era solo per *spulciare* 
e prendere degli spunti dove del tempo era già stato perso :-P ... 
(questo per lo meno da parte mia).

Ciau

-- 
Daniele La Delfa - Divisione Informatica
email: daniele.ladelfa a dearchitettura.com
deArchitettura.com   Via Francesco Tovaglieri, 411 - 00155 Roma
tel: 0645438979 | fax: 0645438980 | url: www.deArchitettura.com