bPopup.js

What is bPopup? bPopup is a lightweight jQuery modal popup plugin (only 1.49KB gzipped). It doesn't create or style your popup but provides you with all the logic like centering, modal overlay, events and more. It gives you a lot of opportunities to customize so it will fit your needs. 
It requires jQuery 1.4.2+ and has been tested in Internet Explorer 6*-9, Firefox 2+, Opera 9+, Safari 4+ and Chrome 4+.

• denizli escort
• denizli escort
• didim escort
• düzce escort
• edirne escort
• edirne escort
• edremit escort

• 1. HELLO WORLD

  Pop it upExample 1, default: Simple jQuery modal popup with default settings (Hello World popup)

          $('element_to_pop_up').bPopup();
                  

• 2. CUSTOM SETTINGS

  Pop it upExample 2a, custom settings: Simple jQuery popup with custom settings (Lazy popup, not going anywhere)

          $('element_to_pop_up').bPopup({
              follow: [false, false], //x, y
              position: [150, 400] //x, y
          });
                  

• Pop it upExample 2b, custom settings: Simple jQuery popup with custom settings part 2 (Sticky popup)

          $('element_to_pop_up').bPopup({
              modalClose: false,
              opacity: 0.6,
              positionStyle: 'fixed' //'fixed' or 'absolute'
          });
                  

• Pop it upExample 2c, custom settings: Simple jQuery popup with custom settings part 3 (Jamaican popup, relax man)

          $('element_to_pop_up').bPopup({
              fadeSpeed: 'slow', //can be a string ('slow'/'fast') or int
              followSpeed: 1500, //can be a string ('slow'/'fast') or int
              modalColor: 'greenYellow'
          });
                  

• 3. TRANSITIONS

  Pop it upExample 3a, transitions: Simple jQuery popup with slide down transition and easing (Falling popup)

          $('element_to_pop_up').bPopup({
  	    easing: 'easeOutBack', //uses jQuery easing plugin
              speed: 450,
              transition: 'slideDown'
          });
                  

• Pop it upExample 3b, transitions: Simple jQuery popup with slide in transition (Formula one popup)

          $('element_to_pop_up').bPopup({
              speed: 650,
              transition: 'slideIn'
          });
                  

• 4. EVENTS

  Pop it upExample 4, events: Simple jQuery popup that illustrates the different events (Events popup)

          $('element_to_pop_up').bPopup({
              onOpen: function() { alert('onOpen fired'); }, 
              onClose: function() { alert('onClose fired'); }
          }, 
          function() {
              alert('Callback fired');
          });
                  

• 5. CONTENT

  Pop it upExample 5a, content: Simple jQuery popup that loads external html page with ajax. (Ajax popup)
  Be aware that due to browser security restrictions, most "Ajax" requests are subject to the same origin policy; the request can't successfully retrieve data from a different domain, subdomain, or protocol.

          $('element_to_pop_up').bPopup({
              contentContainer:'.content',
              loadUrl: 'test.html' //Uses jQuery.load()
          });
                  

• Pop it upExample 5b, content: Simple jQuery popup that loads an image (Image popup)

          $('element_to_pop_up').bPopup({
              content:'image', //'ajax', 'iframe' or 'image'
              contentContainer:'.content',
              loadUrl:'image.jpg'
          });
                  

• Pop it upExample 5c, content: Simple jQuery popup that loads a page inside an iframe (Iframe popup)

          $('element_to_pop_up').bPopup({
              content:'iframe', //'ajax', 'iframe' or 'image'
              contentContainer:'.content',
              loadUrl:'http://dinbror.dk/search' //Uses jQuery.load()
          });
                  

• Pop a videoPop an imagePop some textExample 5d, content: Simple jQuery popup that loads X content defined on the buttons data attribute (Content popup)

          var self = $(this) //button
          , content = $('.content'); 
          
          $('element_to_pop_up').bPopup({
              onOpen: function() {
                  content.html(self.data('bpopup') || '');
              },
              onClose: function() {
                  content.empty();
              }
          });
                  

• 6. MISC

  Pop it upExample 6a, misc: Multiple jQuery popups (Never ending popup, how many can you pop up?)

          $('element_to_pop_up_1').bPopup({
              closeClass:'close1',
              follow: [false, false] //x, y
          });
          $('element_to_pop_up_2').bPopup({
              closeClass:'close2',
              follow: [false, false] //x, y
          });
          
          ...
          
          $('element_to_pop_up_N').bPopup({
              closeClass:'closeN',
              follow: [false, false] //x, y
          });
                  

• Pop it upExample 6b, misc: Random jQuery popup (You never know what you get popup)

          $('element_to_pop_up').bPopup({
              ???
          });