Databases
StackOverflow2013
Postsdbo
POTouch screen reacts on hidden links
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POTouch screen reacts on hidden links
    text
    copied!<p>I have a html page with some links. When you click on a link, some jQuery code hides the div container, and shows another div. The originals links, in the first div, are no longer visible.</p> <p>From the browser (webkit on android) point of view, everything works perfectly.</p> <p>But if I touch the screen, the hidden links react as if they were visible. If I touch the screen, where the hidden links would be, I see an orange rectangle. The browser does nothing it is only showing the link as clicked.</p> <p>How is it possible to synchronize touch screen and jquery hide/show functions?</p> <p>My test is on webkit, android, and sony ericson xperia phone.</p> <p>I've realised a test page with the phenomen. See it <a href="http://www.diaam.com/stacko/stacktest.html" rel="nofollow noreferrer">here</a> or with this qr code:</p> <p><img src="https://i.stack.imgur.com/jWlz6.png" alt="alt text"></p> <p>When you touch the link, you go to a div without any links, but, on my phone, if I touch the first line I see an effect on the non visible link.</p> <p>Here is the html :</p> <pre><code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;Test for Stackoverflow&lt;/title&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt; &lt;script type="text/javascript" src="jquery-1.4.2.min.js"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; $(document).ready(function () { $("#with-link a").click(function() { $("#with-link").hide("slow"); $("#after-touch").show("slow"); return false; }); }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div id="with-link"&gt; Oh... &lt;a href="http://stackoverflow.com"&gt;It's a link !&lt;/a&gt; &lt;/div&gt; &lt;div id="after-touch"style="display:none"&gt; But it's not go to stackoverflow :-)&lt;br&gt; To Touch Or Not To Touch that is the question. &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload