JAVA的自定义弹窗_自定义弹窗
.popup{position:fixed;z-index:2;top:60px;left:50%;width:460px;height:270px;background:#fff;-moz-box-shadow:4px 4px 30px #130507;-webkit-box-shadow:4px 4px 30px #130507;box-shadow:4px 4px 30px #130507;-moz-transition:top 800ms;-o-transition:top 800ms;-webkit-transition:top 800ms;transition:top 800ms;
}.p_close{float:right;width:15px;height:14px;margin:11px 10px 0 0;
/*background:url(../img/popup_close.png);*/
}.p_body{background:#000;left:0;top:0;position:fixed;width:100%;height:100%;opacity:0.7;-moz-transition:opacity 800ms;-o-transition:opacity 800ms;-webkit-transition:opacity 800ms;transition:opacity 800ms;
}.js__slide_top{height:0;overflow:hidden;top:0;
}.js__fadeout{height:0;overflow:hidden;opacity:0;
}
(function($) {
$.fn.simplePopup= function() {varsimplePopup={
initialize:function(self) {varpopup=$(".js__popup");varbody=$(".js__p_body");varclose=$(".js__p_close");varhash= "#popup";varstring=self[0].className;varname=string.replace("js__p_","");if(!(name=== "start")) {
name=name.replace("_start","_popup");
popup=$(".js__" +name);
name=name.replace("_","-");
hash= "#" +name;
};
self.on("click",function() {
simplePopup.show(popup, body, hash);return false;
});
$(window).on("load",function() {
simplePopup.hash(popup, body, hash);
});
body.on("click",function() {
simplePopup.hide(popup, body);
});
close.on("click",function() {
simplePopup.hide(popup, body);return false;
});
$(window).keyup(function(e) {if(e.keyCode=== 27) {
simplePopup.hide(popup, body);
}
});
},
centering:function(self) {varmarginLeft= -self.width()/ 2;returnself.css("margin-left", marginLeft);
},
show:function(popup, body, hash) {
simplePopup.centering(popup);
body.removeClass("js__fadeout");
popup.removeClass("js__slide_top");
window.location.hash=hash;
},
hide:function(popup, body) {
popup.addClass("js__slide_top");
body.addClass("js__fadeout");
window.location.hash= "#";
},
hash:function(popup, body, hash) {if(window.location.hash===hash) {
simplePopup.show(popup, body, hash);
}
}
};return this.each(function() {varself=$(this);
simplePopup.initialize(self);
});
};
})(jQuery);//初始化
$(function() {
$(".js__p_start, .js__p_another_start").simplePopup();
});
自定义弹窗自定义弹窗
点击弹窗