Make your own Lightbox using jquery

Here is the easy way to create your own light box using jquery in a simple way

Html:
Create any button for triggering the function
For example
input type="button" name="test" onclick="myLightbox()"

Here is the CSS for the overlay container

#popup-overlay {
height:100%;
left:0;
position:absolute;
top:0;
width:100%;
z-index:5;
background:#777777;
opacity: 0.8;filter: alpha(opacity = 80); ZOOM: 1
}
#my-div {

left:100px;

position:absolute;

top:50px;

       z-index:15;

}

Here is the script to enable the lightbox


function myLightbox(){
scrollbar("hide");
$("body").append('<div id="popup-overlay"></div>');
     $("body").append('<div id="my-div"><input type="button" name="close" onclick="closeLightbox()" /></div>');
window.location.href= "#";
}


function closeLightbox(){
scrollbar("show");
$("#my-div").remove();
$("#popup-overlay").remove();
}


function scrollbar(action){
    if(action == "show"){
$("html") .css('overflow',''); 
//if previous statement is not working use the following
//        document.body.scroll = "";
  //      document.body.style.overflow = "";       
    }
    else {
$("html") .css('overflow','hidden');
//if previous statement is not working use the following 

      //  var oTop = document.body.scrollTop;
       // document.body.style.overflow = "hidden";
       // document.body.scrollTop = oTop;   
    }
}

Note: For this you need to load the jquery file.

Rotate Div or Image using Jquery (IE and Firefox Tested)

Rotate Div or Image using Jquery (IE and Firefox Tested


Here is the Html image tag for which one you want to rotate 90 degeree, 180 degree, etc. This rotating is clock wise direction. you can make this as a anticlock wise direction too

img src="test.jgp" id="test1"
img src="123.jgp" id="test2"


Here is the Javascript function for image or div rotation.



function rotateDiv(childDiv){
//FOR IE 1=>90, 2=>180, 3=>270, 4=>360//filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=4);
var style_rotate = $("#"+childDiv).attr("style");
var checkIndex = $("#"+childDiv).attr("style");
if(checkIndex.indexOf("(rotation=4)") != -1 || checkIndex.indexOf("rotate(360deg)") != -1){
style_rotate = style_rotate+"-moz-transform: rotate(90deg);filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);";
}
else if(checkIndex.indexOf("(rotation=1)") != -1 || checkIndex.indexOf("rotate(90deg)") != -1){
style_rotate = style_rotate+"-moz-transform: rotate(180deg);filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);";
}
else if(checkIndex.indexOf("(rotation=2)") != -1 || checkIndex.indexOf("rotate(180deg)") != -1) {
style_rotate = style_rotate+"-moz-transform: rotate(270deg);filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);";
}
else if(checkIndex.indexOf("(rotation=3)") != -1 || checkIndex.indexOf("rotate(270deg)") != -1) {
style_rotate = style_rotate+"-moz-transform: rotate(360deg);filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=4);";
}
$("#"+childDiv).attr("style",style_rotate);

}

Keeping background colors in printing

Internet Explorer:
- 'Tools' menu
- 'Internet Options...' menu item
- 'Advanaced' tab
- 'Print background colors and images' checkbox

Mozilla:
- 'File' menu
- 'Page Setup...' menu item
- 'Print Background (colours & images)' checkbox

Drupal Mysql Query

Some of the Mysql Statement in drupal

1. use db_query instead mysql_query

2. mysql_insert_id = db_last_insert_id

3. mysql_fetch_array = db_fetch_array