Having problems with a "lightbox" based plugin I wrote.

Having problems with a "lightbox" based plugin I wrote.

Hey guys, I wrote this plugin and at the moment its working with every browser, except some issues in IE. When using Global Variables, with IE it erases the global variable everytime the jBox is loaded. Any ideas as to why it happens?
  1. // @title: jBox v0.2
  2. // @author: John Madrigal
  3. // Copyright © 2010 Hitcents.
  4. /*
  5.  * Use for documentation: The purpose of this box is to make it more customizable. As in have 6 different types of boxes using
  6.  * different classes for each box and allowing each box to look different. This is the first attempt at making a plugin so
  7.  * chances are there will most likely be bugs somewhere within the code. All the options that can be called with there
  8.  * description is in the defaults object below.
  9.  */
  10.  
  11. // jBox code
  12. $(document).ready(function(){
  13.     jbox_data = "<div id='jbox_wrap' style='display:none;'>";
  14.     jbox_data+= "<div class='jbox_overlay'></div>";
  15.     jbox_data+= "<div id='jbox_content' class='jbox_content_wrap'>";
  16.     jbox_data+= "<div class='jbox_contentInner'></div><span class='jbox_close'></span>";
  17.     jbox_data+= "</div></div>";
  18.     $("body").append(jbox_data);   
  19. });
  20. (function( $, window ){
  21.  
  22.     $.fn.jbox = function( options ) {
  23.    
  24.         // Options for jBox
  25.         var defaults = {
  26.             'width'        : '80%',        // set width of content
  27.             'height'    : '500px',        // set height of content
  28.             'opacity'    : '.8',            // set opacity of content
  29.             'classname'    : 'jbox_style',    // give the box a class
  30.             'iframe'    : false,        // if outside content, it needs to be in this
  31.             'inline'    : false,        // allows you to grab content from the page
  32.             'selector'    : '',            // set the selector (ex. #jbox_code)
  33.             'href'        : '',            // give a relative link to grab from
  34.             'dataType': 'html',            // a function that happens after the jBox is loaded.
  35.             'close' : 'Close',             // path to an image file or just a word or message
  36.             'preload' : '',              //path to preloader image
  37.             'callback' : '',             // function to call after ajax load or inline loading
  38.             'flag' : '',                 // if flagged, checks against to not use click
  39.             'gloVar' : ''                 // if flagged, checks against to not use click
  40.         },
  41.         sets = $.extend({}, defaults, options),
  42.        
  43.         // Variables needed for the plugin
  44.         overlayWidth,
  45.         overlayHeight;       
  46.        
  47.        
  48.        
  49.         // Calculate the overlay based on the browser
  50.         function overlayShow(){
  51.             if($.browser.msie){
  52.                 overlayWidth = document.documentElement.clientWidth;
  53.                 overlayHeight = document.documentElement.clientHeight;
  54.             }
  55.             else{
  56.                 overlayWidth = window.innerWidth;
  57.                 overlayHeight = window.innerHeight;
  58.             }
  59.            
  60.             $(".jbox_overlay").css({
  61.                 "position":"fixed",
  62.                 "top":"0",
  63.                 "left":"0",
  64.                 "height":overlayHeight,
  65.                 "width":overlayWidth,
  66.                 "z-index":"100"
  67.                            
  68.             });
  69.            
  70.             $(".jbox_overlay").animate({
  71.                 opacity: sets.opacity
  72.             }, 0);
  73.            
  74.             $(".jbox_overlay").click(function(){
  75.                 $("#jbox_wrap").hide();
  76.                 // $("#jbox_wrap").remove();
  77.             });
  78.            
  79.         }
  80.        
  81.         // Show a jBox based on params
  82.         function jboxShow(parems){
  83.                        
  84.             overlayShow();
  85.            
  86.             $(window).resize(function () {
  87.                 overlayShow();
  88.             });
  89.            
  90.             // Create Content
  91.             $("#jbox_content").css({
  92.                 "position":"relative",
  93.                 "height":sets.height,
  94.                 "width":sets.width,
  95.                 "z-index":"100"
  96.             });
  97.            
  98.             $(".jbox_contentInner").css({
  99.                 "width":"100%",
  100.                 "height":"100%",
  101.                 "z-index":"110"
  102.             });
  103.            
  104.             if(sets.preload !== undefined){
  105.                 $(".jbox_contentInner").html('<img id="jbox_load" src="' + sets.preload + '" alt="Loading" />');
  106.             }
  107.            
  108.            
  109.             // Creates the Iframe
  110.             if(sets.iframe != false)
  111.             {
  112.                 $(".jbox_contentInner").html("<iframe style='z-index:110' src ='"+sets.href+"' width='100%' height='100%'></iframe>");
  113.             }
  114.             else{
  115.                 // Creates the box if href is set
  116.                 if(sets.href != ""){           
  117.                     $.ajax({
  118.                         url: sets.href,
  119.                         dataType: sets.dataType,
  120.                         success: function(output){
  121.                            
  122.                             if(sets.dataType == 'json'){
  123.                                 $(".jbox_contentInner").html(output.data);
  124.                             }else{
  125.                                 $(".jbox_contentInner").html(output);
  126.                             }
  127.                             if (jQuery.isFunction(sets.callback)){
  128.                                                                
  129.                                 if($.browser.msie){ sets.callback(sets.gloVar); }
  130.                                 else{ sets.callback(); }
  131.                             }
  132.                            
  133.                         }
  134.                     });
  135.                 }
  136.                 else{
  137.                     // Creates the box if inline is set
  138.                     if(sets.inline == true){
  139.                         $(sets.selector).clone().appendTo(".jbox_contentInner");
  140.                         if(jQuery.isFunction( sets.callback ))
  141.                                 sets.callback();
  142.                     }
  143.                     else{
  144.                         // Happens when there are no ajax options
  145.                         $(".jbox_contentInner").load( $(this).attr('href') );
  146.                         if(jQuery.isFunction( sets.callback ))
  147.                                 sets.callback();
  148.                     }
  149.                    
  150.                 }
  151.             }
  152.            
  153.             // Displays the box when clicked.
  154.             $("#jbox_wrap").css({
  155.                 "display":"block"
  156.             });
  157.            
  158.             $('#jbox_content').removeClass();
  159.             $('#jbox_content').addClass(sets.classname);
  160.             $('#jbox_content').addClass('jbox_content_wrap');
  161.            
  162.             var close_detect = sets.close.split('.');
  163.             close_detect = close_detect[close_detect.length - 1];
  164.             close_detect.toLowerCase();
  165.                        
  166.             if(close_detect.indexOf('gif') || close_detect.indexOf('jpg') || close_detect.indexOf('png') )
  167.                 $('.jbox_close').html('<img src="' + sets.close + '" alt="Close" />');
  168.             else
  169.                 $('.jbox_close').html(sets.close);
  170.            
  171.             $('.jbox_close').click(function(){ $("#jbox_wrap").hide();});
  172.         }
  173.        
  174.         // Start the plugins main code
  175.         return this.each(function() {
  176.            
  177.             var jbox = $(this);
  178.            
  179.             // Plugin code can go here   
  180.             if (sets.flag == "click") {
  181.                 // alert(sets.href);
  182.                 jboxShow(sets);
  183.             }
  184.             else {
  185.                 jbox.click(function(){
  186.                     // Show the jBox based on params
  187.                     jboxShow(sets);
  188.                 });
  189.             }
  190.         });
  191.    
  192.   };
  193.  
  194. }( jQuery, this ) );