jQuery Bubble popup example program

jQuery Bubble popup example program

jQuery Bubble popup program example:

Download the jQuery Bubble popup example program

 Step 1: Javadomain-jquery-bubble-popup.html

<title>jQuery Bubble Popup - Javadomain</title>
<link href="jquery-bubble-popup-v3.css" rel="stylesheet" type="text/css" />
<script src="jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="jquery-bubble-popup-v3.min.js" type="text/javascript"></script>

<script type="text/javascript">

innerHtml: 'Javadomain First Jquery Bubble popup!',innerHtmlStyle: {color:'#FFFFFF','text-align':'center'},themeName: 'all-black',themePath:'jquerybubblepopup-themes'});
<div class="page">
	<div class="header">

	  <h3 align="center">Javadomain jQuery Bubble Popup Example</h3>

	<div class="content">
<div class="button" align="center">come here!</div>


Step 2: Download the required below jar files,

1. jquery-1.7.2.min

2. jquery-bubble-popup-v3.min

3. jquery-bubble-popup-v3

Step 3: Put everything in the same location and open the Javadomain-jquery-bubble-popup.html 




Thanks for reading this post…………!!!

1,496 total views, 2 views today

4 thoughts on “jQuery Bubble popup example program

  1. If I uncomment $(‘.button’).click(function(){ then the popup gets stuck open once you click it. How do you fix that?


    1. This is my current code:


      $(‘#icon01, #icon02, #icon03, #icon04, #icon05, #icon06, #icon07, #icon08, #icon09, #icon10, #icon11, #icon12, #icon13, #icon14, #icon15, #icon16, #icon17, #icon18, #icon19, #icon20’).CreateBubblePopup({

      selectable: true,
      position : ‘top’,
      align : ‘center’,

      innerHtml: ‘Default Bubble’,

      innerHtmlStyle: {

      themeName: ‘grey’,
      themePath: ‘images/jquerybubblepopup-themes’


      ” +
      ‘Title’ +
      ” +
      ‘Text goes here.’ +




    2. < !DOCTYPE HTML>

      jQuery Bubble Popup – Javadomain

      jQuery Bubble Popup Example

      come here!

      1. Thank you so much! Here is my final code in case it can help someone else.

        var icon01 =
        \’\’ +
        \’Cupcake Ipsum\’ +
        \’Sweet jelly beans macaroon cheesecake cookie caramels chocolate cake gummi bears muffin.\’ +
        var icon02 =
        \’\’ +
        \’Sugar Coated\’ +
        \’Bonbon lollipop soufflé halvah chupa chups jelly beans.\’ +
        var icon03 =
        \’\’ +
        \’Lorem Ipsum\’ +
        \’Pastry bear claw wafer candy candy sweet roll chocolate bar chocolate cake.\’ +

        $(\’.icon\’).click(function() {
        var iconID = this.id;

        if ($(\’.icon\’).map(function() {
        if ($(this).HasBubblePopup())
        return true;
        })[0]) {
        alert(\’Please close current popup before opening another.\’);
        return false;

        var iconClick = $(this);
        var bubblePopupID = iconClick.GetBubblePopupID();
        position : \’top\’,
        align : \’center\’,
        innerHtml: eval(iconID),
        innerHtmlStyle: {
        themeName: \’grey\’,
        themePath: \’images/jquerybubblepopup-themes\’
        }, false);

        $(\’#\’ + bubblePopupID).click(function() {

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.