Images on hover-lib

Posted 4 years ago
by Russell to gift of code

We built hover-lib at LinkPeek because we needed a way to add on-hover images to select links. Images are loaded just-in-time to reduce bandwidth usage.

Update: We wrote a really neat example of what hover-lib does: Website Screenshot of every two-letter domain

The hover-lib library may be downloaded here: hover-lib.

How to use hover-lib

include hover-lib.css in the head:

  <!--   include the hover-lib stylesheet  -->
  <link rel="stylesheet" href="hover-lib.css">

include jquery.js and hover-lib.js after the body:

  <!--   after the closing body tag import jquery.js   -->
  <script type="text/javascript" src="jquery.js"></script>
  <!--   after the closing body tag import hover-lib.js   -->
  <script type="text/javascript" src="hover-lib.js"></script>

and now you are ready to use hover-lib on your links!

<a href="" class="hover-lib" id="">hover this link!</a>
causes the link to become a hover-lib link.
is the src URI location of the image which you want to appear on-hover

There is a complete example in the download listed above.

Browse the blog archives or subscribe to the full-text feed

Let us capture, store, and update webpage screenshots for you.

See Plans and Pricing
No Risks, Pay-as-you-go