Suppose we have given an HTML document and the task is to hide an HTML element in mobile view with the help of jQuery.
- Initially, we are required to detect whether our system is ‘Mobile’ or not, for that window.navigator.userAgent property is used. It returns a string containing information about the name, version, and platform of the browser. So, using this string we can detect our system.
- In order to hide HTML elements hide() method is used.
- Here, in our code, we are going to hide a column of a table in the mobile view. In the desktop view of the table, we have four different columns with table headings as GFG UserHandle, Practice Problems, Coding Score, and GFG Articles.
- In the mobile view, we are going to hide the Practice Problems column by getting elements using their class names.
Mobile view: In the mobile view, the practice problems column is successfully now.
- How to define additional details that the user can view or hide?
- How to place the image above the slider in mobile view in bootstrap?
- How to hide div element after few seconds in jQuery ?
- Introduction to Model View View Model (MVVM)
- How to hide a div when the user clicks outside of it using jQuery?
- How to Display/Hide functions using aria-hidden attribute in jQuery ?
- jQuery | Hide/Show, Toggle and Fading methods with Examples
- jQuery | hide() with Examples
- How to hide an element when printing a web page using CSS?
- How to detect a mobile device in jQuery?
- Hide or show elements in HTML using display property
- How to hide element on small devices in Twitter Bootstrap ?
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to firstname.lastname@example.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.