Skip to content
Browse files

added message_popup plugin

  • Loading branch information...
1 parent 167cfa9 commit bee21f9e24f08638cc7a3ccc5118bf4085731e80 matt committed May 6, 2012
Showing with 66 additions and 0 deletions.
  1. +66 −0 app/assets/javascripts/ricco/jquery.message_popup.js
View
66 app/assets/javascripts/ricco/jquery.message_popup.js
@@ -0,0 +1,66 @@
+(function($){
+
+ $.fn.message_popup = function(options) {
+ // Default parameters
+ $.fn.message_popup.defaults = {
+ height : "250",
+ width : "500",
+ title:"JQuery Message Box",
+ content: "Example of how to create a modal box.",
+ top: "20%",
+ left: "30%",
+ div_id: "#message-box",
+ status: "pop-out",
+ mouseEnterOn: "true",
+ mouseLeaveOn: "true"
+ };
+ options = $.extend({}, $.fn.message_popup.defaults, options);
+
+ return this.each(function() {
+ $(this)
+ .click( function () {
+ if (!$(this).hasClass(options.status)) {
+ show_box();
+ }
+ })
+ .bind('mouseenter', function() {
+ if (options.mouseEnterOn === "true") {
+ if (!$(this).hasClass(options.status)) {
+ show_box();
+ }
+ }
+ })
+ .bind('mouseleave', function() {
+ if (options.mouseLeaveOn === "true") {
+ $(options.div_id).fadeOut(150);
+ }
+ });
+ });
+
+ function show_box(){
+ add_popup_box();
+ add_styles();
+ $(options.div_id).fadeIn(150);
+ }
+
+ function add_styles(){
+ //$("#message-box").css({
+ $(options.div_id).css({
+ 'z-index': '500000',
+ 'position': 'absolute',
+ 'left': options.left,
+ 'top': options.top,
+ 'display': 'none'
+ //'width': options.width
+ });
+ }
+
+ function add_popup_box(){
+ $(options.div_id).html( options.content );
+ $(options.div_id).click(function(){
+ $(this).fadeOut();
+ });
+ }
+ };
+
+})(jQuery);

0 comments on commit bee21f9

Please sign in to comment.
Something went wrong with that request. Please try again.