14 Useful jQuery Snippets — Alen Ibric — Technology Blog

Years back jQuery has become one of the must-have items for every developer jQuery is one of the most used libraries, making DOM manipulation easy and fast. The reason why jQuery is so popular is its simplicity. We can almost do whatever we want with this powerful library. In addition to all the open possibilities provided by jQuery, some snippets are often returned. Introducing 14 snipets that are useful for everyone from beginner to advanced developer.

1) BUTTONS TO BACK TO TOP

// Back to top $ ('a.top'). click (function () { $ (document.body) .animate ({scrollTop: 0}, 800); return false; }); // HTML link to the top <a class="top" href=[#"> Back to Top </a>

As you can see, using the animate and scrollTop features in jQuery, we don’t need a simple animation plugin to get back to the top of the page.
By changing the value of the scrollTop function we can determine where we want the page to stop, in this case we used the value 0 so we want it to go all the way to the top of the page, for example if you want to return to 100px from the top of the page, simply type instead of zero 100px in the function.
So what really happens with the application of this code is an animation of the document to go back to the top of the page in 800ms.

2) MAKING SURE THE PICTURES ARE LOADED

$('img').load(function() { console.log('image load successful'); });

Sometimes you want to make sure the images on the page are fully readable so you can continue with further scripts, with these three lines of jQurey you can easily check it.
You can also check one image individually by replacing the img tag with an ID or class.

More published at https://www.alenibric.com.tr

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store