Best jQuery Core Java Script Plugins & Tutorials with Demo

    Object Fit Images : JavaScript Polyfill for Object-fit & Object-position

    Object Fit Images : JavaScript Polyfill for Object-fit & Object-position

    Polyfill object-fit and object-position on images on IE9, IE10, IE11, Edge, Safari, etc.

    Features:

    • Fast and lightweight
    • No additional elements are created or necessary
    • Once set, position is taken care by the browser
    • srcset support
    • You can still access/change src and srcset properties and attributes: img.src = 'other-image.jpg'

    Little Fragments: Simple Image Poster Effect with CSS & JavaScript

    Little Fragments: Simple Image Poster Effect with CSS & JavaScript

    A tutorial on how to create a simple image effect with little image fragments inspired by some poster art and powered by clip-path.

    The inspiration comes from a poster of the Grand Canyon with a fun distortion-like effect: some pieces of the image are cut out and placed in a different position. The pieces are very small which creates an interesting and creative look. We’ll be showing you today how to create a similar effect with CSS and some JavaScript.

    Mirror Effect with CSS & JavaScript

    Mirror Effect with CSS & JavaScript

    Today we’d like to share a little effect with you that you might have already stumbled upon on the Web. It’s a kind of a mirror effect as seen on sites like Corentin Fardeau and Method.

    amCharts Data Loader with JSON or CSV Files

    amCharts Data Loader with JSON or CSV Files

    By default all amCharts libraries accept data in JSON format. It needs to be there when the web page loads, defined in-line or loaded via custom code.

    This plugin introduces are native wrapper that enables automatic loading of data from external data data sources in CSV and JSON formats.

    Demo 1 Demo 2 Demo 3

    Block Reveal Effects with CSS & JavaScript

    Block Reveal Effects with CSS & JavaScript

    Today we’d like to share a couple of ideas for a kind of block reveal effect that has been used in some designs recently. The main idea is to reveal content in a schematic box look. The effect first shows a decorative block element being drawn and when it starts to decrease its size, it uncovers some content underneath.

    Loud Links : JavaScript library for adding Interaction Sounds

    Loud Links : JavaScript library for adding Interaction Sounds

    A simple tiny Javascript library to add interaction sounds to your website.The library creates HTML5 audio element and uses it to play mp3/ogg audio files which is currently supported in all browsers.

    PulltoRefresh.js : Javascript Pull to refresh feature Library

    PulltoRefresh.js : Javascript Pull to refresh feature Library

    A small, but powerful Javascript library crafted to power your webapp’s pull to refresh feature. No markup needed, highly customizable and dependency-free!

    Siema : Lightweight and simple carousel in pure JavaScript

    Siema : Lightweight and simple carousel in pure JavaScript

    Siema is a lightweight (only 1kb gzipped) carousel plugin with no dependencies and no styling. As Brad Frost once said “do that shit yourself”. It is 100% open source and available on Github. It is free to use on personal and commercial projects. Use it with your favourite module bundler or by manually injecting the script into your project.

    Interactive Musical Instruments with JavaScript

    Interactive Musical Instruments with JavaScript

    Experimental ideas for playful musical interactions powered by MIDI.js and the Web Audio API. Play instruments or make sounds by interacting with content.

    Trial.js : Mouse Monitoring & Prediction Library

    Trial.js : Mouse Monitoring & Prediction Library

    Trial.js is a simple library could monitor mouse position and predict user input

    Features :

    • No dependency
    • Lightweight (~1kb gzipped)
    • Automatically extends jQuery and Zepto properties