After exploring all the standard listview types in the series of examples on listview, you must have observed that for a linked list, Jquery Mobile displays a standard "arrow-r" icon to the extreme right of the list. However, you don't want the standard "arrow-r" icon and you need some custom icon there.
Jquery Mobile provides a set of icons that can be used along with listviews in place of the standard "arrow-r" icon. To override the standard icon, set the data-icon attribute on the desired list item to the name of a standard icon. We will see a complete list of icons in the following example.
However, before proceeding to the example, let us also consider a case where we do not wish to have any icon on the list item. This too can be achieved by setting the value of data-icon attribute to false. We will also include this in our example that follows.
Hope you have followed this post. Do drop a line in case you find any errors with this post or need more information on this. We will take a look at how we can customize the listview by adding a third party custom icon to it in the next post. Stay tuned for a complete customization of the listview!
Jquery Mobile provides a set of icons that can be used along with listviews in place of the standard "arrow-r" icon. To override the standard icon, set the data-icon attribute on the desired list item to the name of a standard icon. We will see a complete list of icons in the following example.
However, before proceeding to the example, let us also consider a case where we do not wish to have any icon on the list item. This too can be achieved by setting the value of data-icon attribute to false. We will also include this in our example that follows.
Hope you have followed this post. Do drop a line in case you find any errors with this post or need more information on this. We will take a look at how we can customize the listview by adding a third party custom icon to it in the next post. Stay tuned for a complete customization of the listview!
Comments
Post a Comment
Please leave your comments here...