Wednesday, September 27, 2023

jQuery Effects – Hide and Show

<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> $(document).ready(function(){ $("#options").click(function(){ $("#optional").toggle(); }); }); </script> </head> <body> <p id="options">Click here to show options</p> <div id="optional" style="display:none;"> Toggle between hiding and showing the options. </div> </body> </html>

Add a “Back To Top” floating button using jQuery

Add this to the bottom of the page.  <a href="#" class="back-to-top"><span class="glyphicon glyphicon-arrow-up" aria-hidden="true">     </span></a>         <style>      .back-to-top {        position: fixed;        bottom: 2em;        right: 0px;        text-decoration: none;        color: #000000;       …

jQuery : Error: $(document).ready is not a function

Sometimes firebug will throw the following error:    jQuery : Error: $(document).ready is not a functionThis error is because another framework is in conflict with jQuery.Use jQuery(document).ready(function() instead of $(document).ready(function() along with jQuery.noConflict(); For example:Use:<script>jQuery.noConflict();jQuery(document).ready(function(){});</script> instead of:<script>$(document).ready(function(){});</script>