‹‹ homejQuery BlockUI Plugin

This page demonstrates how to use plain CSS to style the block overlay.

Click to block

First, disable the plugin's default overlay styles:

// clear out plugin default styling
$.blockUI.defaults.overlayCSS = {};

Second, declare whatever styles you like in your stylesheet. You declare the styles for the element: div.blockOverlay.

The following style block is used on this page:

<style type="text/css">

div.blockOverlay {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; 
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); 
    -moz-opacity:.70;
    opacity:.70;
    background-color: #00f;
}

</style>
That's it!