Menu
Ok, what im trying to do is slide a div down when the user clicks a list item.
Problem is I am using Selectric https://github.com/lcdsantos/jQuery-Selectric which converts a Select box to an unordered list. So when the user clicks a which the source outputs as a list item I want a div to slide down.
On mobile safari (iOS7) the selectbox UI is the same as the standard selectbox UI.
What is the best practice when it comes to onClick for mobile devices?
Basic jquery:
$(window).load(function() { $('.List li').click(function() { $('.Div').slideDown('500'); }); }); You can see a working example HERE (Advanced search on the side bar)
Thanks.
719
onclick works fine on touchscreens; I've used it several times and have never had any problem. You could consider using onmousedown instead of onclick .
Yes it will work.
An element receives a click event when a pointing device button (such as a mouse's primary mouse button) is both pressed and released while the pointer is located inside the element.
You would use onMouseDown if you want to preventDefault as soon as the user clicks on a button. This is preferred in a texteditor where you want to keep the focus on the input while clicking on buttons that change the styles of the text.
better to use touchstart event with .on() jQuery method:
$(window).load(function() { // better to use $(document).ready(function(){ $('.List li').on('click touchstart', function() { $('.Div').slideDown('500'); }); }); And i don't understand why you are using $(window).load() method because it waits for everything on a page to be loaded, this tend to be slow, while you can use $(document).ready() method which does not wait for each element on the page to be loaded first.
60
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
