Skip to main content

Jquery Mobile - Customizing the search box

    Customizing the Jquery Mobile default styles is often required to match the design visuals provided by your designer and approved by your client. Such is the case with the Jquery Mobile search box as well. The designers often use customized icons for the default search box icons. In the example that follows, we will take a look at how this done and we will use custom icons for the search box in place of the default icons.



    As seen in the example above, in the CSS, we need to use the !important keyword to override the default styles of the Jquery Mobile class.

    Customizing the search box or any other element in Jquery mobile is pretty simple. Hope you have followed the post and followed how to customize the Jquery Mobile default styles for  the HTML5 search input box. Drop a comment in case you need to know more or need help with your Jquery Mobile application. I would be happy to help!

Labels:

Comments

Post a Comment

Please leave your comments here...

Recommended for You

Simple Map using Google Maps API v3

       Let us begin with our first example using Google Maps API v3. Even before a marker - the most basic element of a map, appears, the map should be seen on the screen. Let us have a look at the following javascript code first. We will then have a look at the elements in the code.             Ta-da a map in action! This map is centred at the Sansad Bhavan, New Delhi, India. In the above code the head of the document contains a critical script element. Its src attribute points to the location of the API on Google's server. In API v3 there is no need to obtain a key for the API. The remaining is simple Javascript.           Happy mapping!!!
2 comments
Read more

Playing with the markers and info window bubbles...

    In the last few posts, we have seen some marker examples and some information window examples. Now, lets do something interesting combining these two things. Just writing that "This is an info window" in the information bubble is not very interesting! And I know this...Have gone through the same phase!     So, today we will do something interesting! We will display the latitude- longitude co-ordinates of the point that the user clicks on the map! Doing this is not at all complex! Copy paste the following code and you will see for yourself a map coming to life!     The output of the above code looks as seen in the result section above! If you have any queries regarding the above code please comment on the blog post or feel free to contact me at my mail ID .
3 comments
Read more

100th Post...

            I’m so excited that I have finally reached this milestone. Well I am not completely certain that this is a big deal but anything that is ' 100 ' just seems big and grand. I have been blogging here for around 8 months now, and it gives me immense pleasure to say that now I have become an experienced blogger.:D             I never thought when I started this blog in November, 2010 that I would have much to offer compared to the hundreds of other GIS bloggers out there. But today with more than 21,000 page views, more than 100 comments, more than 100 followers and several Like and +1s the response to this blog has been nothing short of amazing. Now the next target for me would be to cross 50,000 views.             At the end, I would  like to thank all visitors and members for making this blo...
4 comments
Read more

Happy Holi...

Wishing all the readers of Spatial Unlimited a very happy and a colorful Holi. May this Holi bring lo ads of joy and colors to your life!!!    
Post a Comment
Read more

Google Street View Image API

    Street View is one of most used feature of the Google Maps and why not? You can actually see any part of the world as if you are visiting the place at that very moment. And now with the Google Street View Image API, you don't even need to carry a camera with you to the places you visit. You can take-in all the scenic beauty without even bothering about clicking a single picture. You can come back from your vacation and get a few images using the Google Street View Image API and show those images to your friends and relatives. Create an album of high definition images and go ahead and share it on Facebook for your friends to have a look.     Using the Google Street View Image API is very simple and anybody can make use of it without any programming knowledge required. I will walk you through the entire process of effectively using the Google Street View Image API. So if you are set, let's go on an amazing ride across the globe with the Google Street Views. ...
1 comment
Read more