Jquery.smartpopover by mofukuma

これは何？

常に画面外にはみ出さない吹き出しを出すjQueryプラグインですクマ

Sample1

$("#sakana").on("mousedown touchstart", function(e){
  $(this).smartPopover(
    "<div class=bigfont>Drag me!</div>"
  );
});

Sample2

$("#sakana2").on("mousedown touchstart", function(e){
  $(this).smartPopover(
    "<div class=midfont >MetroUI style</div>",
     {
      "background-color":"#48b1f2",
      "border-radius": 0
     }
  );
});

Sample3

$("#sakana3").on("mousedown touchstart", function(e){
  $(this).smartPopover(
    "<div class=whitefont >Black and Narrow arrow</div>",
     {
      "background-color":"#333",
      "arrowsize": 30,
      "arrowwidth": 7
     }
  );
});

Usage

Requires jQuery 1.8+.

<script src='jquery-1.8.1.js'></script>
<script src='jquery.smartpopover.js'></script>

Creates new popover.

$("#target").smartPopover("<div>Hi!!</div>");

To delete popover, click outside of the popover or call "destroy".

$("#target").smartPopover("destroy");

Acknowledgements

Website http://kumaden.grrr.jp
Twitter @mofukuma