Contact Us

Let us know to help you out quickly!

 Vikas     Feb,08 2017

Scroll to UI Element in jquery Mobile Framework

I am using jquery mobile framework for last couple of weeks.

Recently it was required to scroll a page to my listview item.

Jquery mobile has a method called $.mobile.silentScroll().

It requires a numeric argument for y position.

Example:

 //scroll to Y 100px $.mobile.silentScroll(100); 

Now, I need y position of the element.

Jquery has .offset() method. It gets current coordinates of the first matched element.

So my final call would be:

 $.mobile.silentScroll($("#idofelement").offset().top); 

My next challenge was to find li element with search text.

Again thanks to jquery, it has :contains() selector to search a string or text in HTML elements.

Examples:

 $("div:contains('Vikas')"); //Search a text in all div $("li:contains('Vikas')"); //Search a text in all list items 

Remember that contains() is a selector, it can return more than one elements. So you should check the number of elements by .size() method.

Instead of specifying element you can also use wildcard charaters.

Example:

 $('*:contains("Vikas")'); 

The selector above selects any element that contains the target string.