...4,975,748,436 site thumbnails served and counting!
Recently Served...

websnapr - Preview Bubble Javascript v2.0

The websnapr Preview Bubble is a simple, unobtrusive script used to display an overlay bubble showing a hyperlink target thumbnail using websnapr. It's a snap to setup and works on (almost) all modern browsers.

This script has been proved to work in IE, Firefox, Opera and Safari. It might work on other browsers as well.


Preview bubbles on contiguous hyperlinks (mouse over them):

Yahoo Google Microsoft

Preview bubbles on hyperlinks inside an unordered list (mouse over them):

How To Use

  1. Get your free developer key here by filling out the form.

  2. Copy the contents of the previewbubble.zip file somewhere in your server. Edit previewbubble.js and point the bubbleImagePath variable to the correct location of the bg.png file. For example:

    var bubbleImagePath = '/images/bg.png';
  3. Include previewbubble.js in your header.

    <script type="text/javascript" src="previewbubble.js"></script>

    Also insert your developer key here:

    var developerKey = 'your developer key';
  4. Add class="previewlink" attribute to the links you wish to bind the preview event to. For example:

    <a class="previewlink" href="http://www.cnn.com">CNN</a>


The file previewbubble.zip contains all the necessary javascript and image files.