Response title
This is preview!
Have been trying to perform a DIV hide show on a page of my website.
It was working fine with plain javascript but noticed it was not working when simulated on mobile devices..after bit of research I changed my code to the following, is there anything wrong in it ?
<script> $(document).ready(function () { var portfolioDiv = document.getElementById('portfolio'); var resultsDiv = document.getElementById('results'); $('#RenderPortfolio_Btn').on('click touchstart', function () { resultsDiv.setAttribute('class', 'col-md-9 hidden'); portfolioDiv.setAttribute('class', 'col-md-9 visible'); }); $('#RenderResults_Btn').on('click touchstart', function () { portfolioDiv.setAttribute('class', 'col-md-9 hidden'); resultsDiv.setAttribute('class', 'col-md-9 visible'); }); }); </script>
This is the element having the id
<div class="col-md-3 col-sm-12 col-xs-12"> <br /> <ul class="nav nav-stacked"> <li style="background-color: lightgreen ; color:black;font-weight:bold"><a href="#" id="RenderPortfolio_Btn">Introduction</a> </li> <li style="background-color: lightgreen; color:black;font-weight:bold"><a href="#" id="RenderResults_Btn">Key Achievements</a> </li> </ul> </div>
Yes mobile devices often don’t get click events
It was working fine with plain javascript
Which "simulated mobile device"? Sounds like your "simulated mobile device" isn't very realistic, or needs to be configured to send clicks. Most simulators have some options about how to handle your desktop/notebook keyboard (since most devices you run a simulator on wouldn't have an actual touchscreen.)it was not working when simulated on mobile devices
© 2013 jQuery Foundation
Sponsored by and others.