my problem start here when i'm using object letral . something w'll not works pretty fine . take a look at the bottom code.
$(document).ready(function(){
(function($){
$.fn.blackbox = function(opt){
settings = $.extend($.fn.blackbox.defaults,opt);
var features = {
init:function(){
$(window).load(features.create_element());
//features.create_element();
features.$login_panel = $(settings.wrapper)
.css("display","block")
.css("z-index",'1002')
.delay(200)
.animate({opacity:"1"},300,'expoout');
$(window).resize(features.change_location);
},
change_location : function(){
var left2 = $(document).width()/2 - $(settings.wrapper).width()/2
$(settings.wrapper).css("left",left2);
},
create_element:function(){
//get the real height of the window
height = $(document).height();
if($("#"+settings.container).length == 0){
console.log("hello world");
// create blackbox and give an attr and couple css property
features.$container = $('<div></div>').css({
"height":height,
"opacity":settings.page_opacity})
.appendTo("body")
.attr('id',settings.container)
// create close btn and give some css property
features.$closebtn = $("<div></div>")
.text('✕')
.appendTo("body")
.attr('id','closebtn')
// create click event handler for the close btn
features.$closebtn.click(features.close_blackbox);
} else {
features.$closebtn.css('display','block').css("opacity","1");
features.$container.css("display","block").css("opacity",".7");
}
},
close_blackbox:function(){
features.$container.animate({opacity:"0"},300,'expoout',function(){$(this).css("display","none")});
features.$closebtn.animate({opacity:"0"},300,'expoout',function(){$(this).css("display","none")});
features.$login_panel.animate({opacity:"0"},300,'expoout').addClass("hide_show_blackbox");
}
}
features.init();
}
//
//Get the defaults
$.fn.blackbox.defaults={
container:"#blackbox",
closebtn:"#closebtn",
page_opacity:".7",
wrapper:"#wrapper",
}
})($);
});
but for the second time it'll show me an error about that my element has not been created yet .