A nice commit migrating away from AMD Modules to ECMAScript modules recently landed in the jQuery repo. Once published as a new release, you’ll be able to actually import $ using the modern ES module syntax: import $ from "jquery"; $('#message').text('Hi from jQuery!'); Handy if you’re modernizing a legacy project that still uses jQuery. 💡 […]
Tag Archives: jquery
Ship legacy JavaScript and CSS files in a Webpack Project with webpack-merge-and-include-globally
One of the projects that I’m working on is quite reliant on jQuery and Bootstrap. As we’re introducing new features (such as a few React-based components, and Stylus for CSS) in said project, we’ve also introduced Webpack into it. Now, we don’t want to run jQuery nor Bootstrap through Babel (using Webpack), but we want […]
Tilt.js – A tiny parallax tilt effect for jQuery
A tiny requestAnimationFrame powered 60+fps lightweight parallax hover tilt effect for jQuery. Might come in handy for a quick project. Also love the fact that it’s highly customizable: maxTilt: 20, perspective: 1000, // Transform perspective, the lower the more extreme the tilt gets. easing: “cubic-bezier(.03,.98,.52,.99)”, // Easing on enter/exit. scale: 1, // 2 = 200%, […]
Full page transitions with jquery.smoothState.js
jquery.smoothState.js lets you add transitions to eliminate the hard cuts and white flashes of page loads that deface the beauty of the user experience. Works by hijacking links, requesting the target URL over XHR, and then replacing the content of a specified element on the current page with the contents of that same element from […]
Apple TV Poster Parallax Effect in CSS3 & jQuery
In this tutorial, I will guide you in building something similar to Apple TV parallax effect using CSS, HTML, and jQuery. Apple TV Poster Parallax Effect in CSS3 & jQuery →
You Don’t Need jQuery!
A series of posts in line with the aforementioned You might not need jQuery, From jQuery to Javascript, a reference, and I know jQuery, now what?. Essentially nothing new, yet linking to because it has all handy snippets collected in one place. One thing I do find missing from it is Element#classList. You Don’t Need […]
Chosen
Chosen is a library for making long, unwieldy select boxes more user friendly. Also supports changing a multiple select list into a tag-style list, and doesn’t break keyboard functionality. Chosen →
ScrollMe – A jQuery plugin for adding simple scrolling effects to web pages
<div class="scrollme"> <div class="animateme" data-when="enter" data-from="0.5" data-to="0" data-opacity="0" data-translatex="-200" data-rotatez="90" > Yup, that’s all. </div> </div> ScrollMe is a jQuery plugin for adding simple scrolling effects to web pages. As you scroll down the page ScrollMe can scale, rotate, translate and change the opacity of elements on the page. It’s easy to set up and […]
jQuery.aim
jQuery plugin which anticipates on which element the user is going to hover/click Cool idea! Experimental/buggy though. A UX Idea: I know where you are aiming! →jQuery.aim source (GitHub) → jQuery.aim examples →
perfect-scrollbar — Tiny but perfect jQuery scrollbar plugin.
$(‘#demo’).perfectScrollbar(); perfect-scrollbar is very tiny but perfect jQuery scrollbar plugin. Looks great: highly configurable, respects the mouse, respects the keyboard, etc. perfect-scrollbar demo → perfect-scrollbar source (github) →