Klaus Hartl wrote:
> After talking with Jörn we decided to join power and do a rewrite with 
> Thickbox 3 as result...
>
> So yes, we're volunteering!
>
>   
This is most xlnt! :) Off the top -- will you support the ability to 
maintain pre-existing events (e.g. not forget events attached to inline 
content to be displayed via the $.clone() method, as current TB does)?

I've been looking for a minimalistic modal window plugin to use. While I 
like Gavin's (http://jquery.glyphix.com/) I think there could be a more 
streamlined one. Here's a draft of one I wrote;

===[ JS ]===
$().ready(function() {
   // Quick modal
   if($('#Modal')[0]) { // Draw Modal Window on load, if #Modal exists
     var h = $('body').height();
     $('body').append('<div id="Overlay"></div>');
     $('#Overlay').css({display: 'block', height: h+'px', opacity: 0.5});
    
     // hide/close modal window if clicked "outside", or clicking close 
links inside
     $('#CoverTop a, #Overlay').click(function(){
        $('#Cover, #Overlay').hide();
        return false;
     });
   }
});

===[ CSS ]===
#Overlay { z-index: 99; position: absolute; width: 100%; top: 0; 
background-color: #000; display: none; }

#ModalContainer { z-index: 100; position: absolute; width: 100%; margin: 
auto; top: 66px; }

#Modal {  width: 600px; margin: auto; background-color: #fff; border: 
1px solid black; padding: 12px; }

#ModalTop {padding-bottom: 5px;}

.left { float: left; }
.right { float: right; }


===[ HTML ]===

<div id="ModalContainer">
    <div id="Modal">
        <div id="ModalTop"><!-- degrades gracefully if JS disabled && 
modal window displayed on load --><a href="index.php" 
class="left">Close</a><a href="index.php" class="right">Close</a></div>

        ...Faux Modal Window Content...
    </div>
</div>

...PAGE CONTENT...

obviously this can be extended.. the overlay may (sometimes) not cover 
whole page. To get around this I'd probably set <body> overflow to 
hidden & extend the height of the overlay a thousand or so px ;)

~ Brice

_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/

Reply via email to