Best jQuery Core Java Script Plugins & Tutorials with Demo

    Interactive Room Display with JavaScript & CSS

    Interactive Room Display with JavaScript & CSS

    Today we’d like to share a little experiment based on a Dribbble shot by Bilal Mechairia’s, called “Spaces”. The idea is to show an interactive room with several items that all float in 3D space and move according to the position of the mouse. Once an item is clicked, more details pop up. Navigating between the room “slides” will rotate the different wall sections and add some interesting dynamic to the whole thing.

    Cohesive Colors Tool

    Cohesive Colors Tool

    A tool for creating more cohesive color schemes. Pick a bunch of random colors that you like and add a touch of magic.

    Ideal Image Slider

    Ideal Image Slider

    The aim behind the Ideal Image Slider is to create a slider which has just the right amount of features, with no bloat and be easy to extend so that more features can be added as “extensions”. Here are the ideals and core features I wanted to include:

    • HTML5 (SEO optimised)
    • CSS3 transitions (a few simple transitions like slide/fade)
    • Left/Right navigation (including touch/swipe support)
    • Responsive
    • HiDPI (retina) support
    • ARIA support
    • Extremely simple to setup (no dependencies)
    • Very extensible
    • Uses progressive enhancement

    diferente : Virtual DOM Diffing

    diferente : Virtual DOM Diffing

    diferente is a javascript library for user-friendly virtual DOM diffing.

    Allec AJAX Off-Screen Menu

    Allec AJAX Off-Screen Menu

    Allec Off-Screen Ajax Menu is a perfect solution for agency and portfolio websites to enhance modern design and futuristic feel because of palette grid and off-screen positioning.

    Fully ajax support maintains dynamic loading without a need to refresh the page. It is an extra advantage your users will highly appreciate as there won’t be waiting time anymore, only instant content appearance. Happy users equals successful business.

    • Pure JavaScript
    • Ajax Support
    • Palette Grid Modern Layout
    • Overlay Menu Effect
    • Mobile Optimized
    • Fast Performance
    • Light Weight Navigation
    • Custom Scrollbar
    • Smooth Animation
    • SVG Graphic
    • Retina Ready

    Animate Element Along SVG Path

    Animate Element Along SVG Path

    Today I’ll show you how to animate an SVG element along a predefined path using snapsvg javascript library.

    Horsey : Customizable Autocomplete Component

    Horsey : Customizable Autocomplete Component

    Horsey is a customizable, progressive autocomplete component. It even works in text fields (useful for things like @ mentions).

    The goal is to produce a framework-agnostic autocomplete that is easily integrated into your favorite MVC framework, that doesn’t translate into a significant addition to your codebase, and that’s enjoyable to work with.

    • Small and focused
    • Natural keyboard navigation
    • Progressively enhanced
    • Extensive browser support
    • Fuzzy searching
    • Supports <input> and <textarea> elements

    Mprogress.js : Progress linear Bar for Material Design

    Mprogress.js : Progress linear Bar for Material Design

    Material Progress —Google Material Design Progress linear bar. By using CSS3 and vanilla JavaScript.

    Chewing-Grid : CSS Grid ideal for Card Listing Design

    Chewing-Grid : CSS Grid ideal for Card Listing Design

    ChewingGrid is a CSS grid for card listing design, like videos, tiles, or article lists. It doesn’t require media queries, but it adjusts based on the maximum number of columns, and minimum and maximum card width.

    Smartcrop.js : Content Aware Image Cropping

    Smartcrop.js : Content Aware Image Cropping

    Smartcrop.js is a javascript library implementing content aware image cropping. Smartcrop.js implements an algorithm to find good crops for images.