JavaScript link preview for touch devices
<p>I have some JavaScript on a website I'm currently making which causes selected links to show a preview when moused over which works fine, however for touch devices when the links are tapped it shows the preview then sends the user to the site, I'd like it to show just the preview on the first tap, then if they tap again to send them to the page.</p>

<p>How can I do this?</p>

<p>My Java Script that I've used:</p>

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

<p> </p>

<p>And the HTML:</p>

<pre><code>&lt;p id="p1" align="center"&gt;&lt;a href="http://link"&gt;link description&lt;/a&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;/p&gt;
&lt;p id="p2" align="center"&gt;&lt;a href="http://link"&gt;link description&lt;/a&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;/p&gt;
&lt;p id="p3" align="center"&gt;&lt;a href="http://link"&gt;link description&lt;/a&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;/p&gt;
</code></pre>