jQuery Plugin for Smooth and Performant CSS3 Transitions

"Smooth fade-in and fade-out transitions: Built-in opacity-based animations with customizable CSS classes. Customizable timing and duration: Full control over animation speed and easing functions. Chainable jQuery methods: Maintains jQuery's familiar API pattern for easy integration. RequestAnimationFrame optimization: Uses browser-native timing for smooth 60fps animations. CSS framework compatibility: Works perfectly with Tailwind CSS, Bootstrap, and custom CSS classes. Dropdown Menus: Add subtle transitions to dropdown menus as they open and close, preventing the jarring effect of elements instantly appearing on the screen."

"How to use it: 1. For projects using a build process, you can install and import it via npm: # NPM $ npm install @tamarak/jquery-transition # NPM $ npm install @tamarak/jquery-transition 2. For CDN or direct integration, include the main script after jQuery: <script src="/path/to/cdn/jquery.min.js"></script> <script src="/path/to/jquery.transition.js"></script> 3. Initialize the plugin on the element you want to animate. $('.element-to-animate').transition(); 4. Trigger the show/hide animations using the .transitionShow() and .transitionHide() methods."

jquery.transition.js is an ultra-light jQuery plugin that applies smooth CSS3 enter and leave transitions to any element. The plugin provides built-in opacity-based fade-in and fade-out animations with customizable CSS classes. Timing, duration, and easing functions are fully configurable. The API remains chainable to match jQuery conventions. Browser-native requestAnimationFrame drives animations for smoother 60fps performance. Compatibility includes Tailwind CSS, Bootstrap, and custom CSS classes. Common use cases include modal/dialog animations, dropdown menu transitions, dynamic content fading after AJAX loads, and animated alert/notification banners. Installation supports npm and CDN integration with simple initialization and .transitionShow()/.transitionHide() methods.

Read at jQuery Script