How to create a Menu popup using jQuery Mobile ? Last Updated : 14 Dec, 2020 Comments Improve Suggest changes Like Article Like Report jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets and desktops. In this article, we will be creating menu popup button using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=”stylesheet” href=”http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css” /> <script src=”http://code.jquery.com/jquery-1.11.1.min.js”></script> <script src=”http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js”></script> Example: We will create a menu popup by adding a listview inside a popup. HTML <!DOCTYPE html> <html> <head> <link rel="stylesheet" href= "http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" /> <script src= "http://code.jquery.com/jquery-1.11.1.min.js"> </script> <script src= "http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"> </script> </head> <body> <center> <h1>GeeksforGeeks</h1> <h4> Menu popup using jQuery Mobile </h4> <a href="#GFGMenu" data-rel="popup" data-transition="slideup" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-icon-gear ui-btn-icon-left ui-btn-a" title="Click Here!">GeeksforGeeks Menu </a> <div data-role="popup" id="GFGMenu" data-theme="b"> <ul data-role="listview" data-inset="true" style="min-width:210px;"> <li data-role="list-divider">Choose an Option</li> <li><a href="#">Data Structure</a></li> <li><a href="#">Algorithm</a></li> <li><a href="#">HTML</a></li> <li><a href="#">CSS</a></li> <li><a href="#">JavaScript</a></li> </ul> </div> </center> </body> </html> Output: Comment More infoAdvertise with us Next Article How to create a Menu popup using jQuery Mobile ? P ppatelkap Follow Improve Article Tags : Web Technologies JQuery jQuery-Misc jQuery-Mobile Similar Reads How to create a Form Popup using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets and desktops. In this article, we will be creating a form popup using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=â€stylesheet†href=â€h 2 min read How to create a Dialog Popup using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets and desktops. In this article, we will be creating a Dialog popup button using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=â€stylesheet 1 min read How to create a Padded Popup using jQuery Mobile ? jQuery Mobile is a web-based technology used to make responsive content that can be accessed on all smartphones, tablets, and desktops. In this article, we will be creating a padded popup using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=â€stylesheet†href 1 min read How to create a Tooltip popup using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets and desktops. In this article, we will be creating a Tooltip popup using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=â€stylesheet†href 1 min read How to create a Closing Popup using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets, and desktops. In this article, we will be creating a closing popup using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=â€stylesheet†hre 2 min read How to create a Position popup using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets, and desktops. In this article, we will be creating a position popup using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=â€stylesheet†hr 2 min read How to create a Transitions popup using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets, and desktops. In this article, we will be creating a transition popup button using jQuery Mobile. Approach: Add jQuery mobile scripts needed for your project. <link rel=â€style 2 min read How to create a basic popup button using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets and desktops. In this article, we will be creating a basic popup button using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=â€stylesheet†1 min read How to create a Photo lightbox popup using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets and desktops. In this article, we will be creating a Photo lightbox popup using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=â€styleshee 1 min read How to create Mini collapsibles using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets and desktops. In this article, we will be making a Mini collapsibles using jQuery Mobile. Approach: First, add jQuery Mobile scripts needed for your project. <link rel="stylesh 1 min read Like