Wednesday, June 29, 2016

.::: Display Image Link Preview on Hover :::.

Preview web
Image Undangan

<p id="p1"><a href="http://ratna-dan-teguh.blogspot.co.id/">Web Undangan</a></p>
<p id="p2"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4CG1cpDkGzaNLWn5SEa2p4YnJCMPPoc5n5PDB35FjSuykKtXa0Dyu9CAR7MI5PxFZpksvLIKcKGMQnB_rkiX-T6fMEHIj7zREkAUjaWjvgNNIzvyRS9Ny_d_oXcVA4E5WVOYXOzBB8Fr4/s1600/UNDANGAN_RATNA_TEGUH.jpg">Image Undangan</a></p>
<p id="p3"><a href="http://teguhth.blogspot.co.id/">Learning Centre</a></p>


<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
  <link href="http://codegena.com/assets/css/image-preview-for-link.css" rel="stylesheet">     
  <script type="text/javascript">
    $(function() {
                $('#p1 a').miniPreview({ prefetch: 'pageload' });
                $('#p2 a').miniPreview({ prefetch: 'parenthover' });
                $('#p3 a').miniPreview({ prefetch: 'none' });
            });
  </script> <script src="http://codegena.com/assets/js/image-preview-for-link.js"></script>


id="p1" - Fetch image preview on page load.
id="p2" - Fetch preview on hover.
id="p3" - Fetch preview image each time you hover.

Popular Posts