Sunday , 19 November 2017
Home » Coding » JavaScript » 18 Best Creative JavaScript Examples
Javascript Memory Game

18 Best Creative JavaScript Examples

JavaScript is an amazing interpreted programming language as it interprets or does something when client interacts with the browser or application. It went on to become one of the very popular languages ever made alongside other giant languages. Here you can see the real potential or say some of its strengths to do add great interaction on the client side at the front end.

Even though 3D rendered objects will slow down the system with minimal specifications it is still amazing to look at. User is also given the complete control whether to use JavaScript or not through their browsers. Take a look at these below scripts designed by individual talented developers and shared at codepen.io website.

Let me know if you liked this topic on JavaScript examples and do share your work with us.

JavaScript calculator

A pleasant and elegant looking calculator do math operations online. The animation flow very smoothly with this JavaScript web app.

Source

JavaScript Calculator

JavaScript Visualizer [V1]

Amazing Visualizer which can be used for sound movements based on the song we play.

Source

JavaScript Visualizer

JavaScript memory game

A superb memory game for your inspiration. Take time to play this amazing game which requires you to remember two elements to win the game.

Source

Javascript Memory Game

Draggable “Toss” Demo

Drag and throw elements and watch them continue naturally with momentum, respect bounds and optionally snap to a grid. This is the demo seen at

Source

Draggable "Toss" Demo

Random Maze Generator

Generating a maze with a simple algorithm
1. Find available directions 2. pick one at random 3. if no available directions, backtrack to last position loop step 1 to 3 until back at start location

Source

Random Maze Generator

Linking Particles

A beautiful set of ball linking with each other on near contact.

Source

linking particles

three.js practice

Source

renderer element

A Pen by White Wolf Wizard

Source

pen

Tearable Cloth

Javascript cloth simulation.

Source

Javascript cloth simulation

Space Puppy

An example of Famo.us exporting to WebGL. Expose sliders by pressing (+) and explore the power and performance of WebGL with the flexibility of the Famo.us rendering engine. Fork it and make it your own.

Source

space puppy

Hello World

A beautiful floating hello world notice.

Source hello world

Futuristic Neon Saving Thing

Could be used when doing ajax-saves on any kind of website with a futuristic feel :) —- Single Element, CSS Animations, jQuery Events.

Source

Futuristic Neon Saving Thing

30,000 Particles

A study creating performant particles with Canvas 2D.

Source

particles

Metro UI animations

Dont forget to check out the :active

Source

Metro UI animations

Vertical JS Loader

Source

javascript vertical loader

Simple JS Animation

Just threw this together. Thought about using it for a search bar or even a progress bar, but decided to leave it as this.

Source

Simple JS Animation

Mobile Sub Menu Concept

Different menu effect for mobile.

Source

Mobile Sub Menu Concept

CSS 3D Solar System

Source

CSS 3D Solar System

CSS3 Card Deck Drop Down

This is a UI concept i have seen before but i felt there was a few things that could be done different. Ao here is my version of a Card Deck style dropdown, using CSS3 transitions and jQuery.

Source

CSS3 Card Deck Drop Down

Responsive CSS3, JS Side Navigation Menu

Media Queries Transitions (resize the window slowly to see the transitions), nav items slide out on hover when it collapses on smaller screens.

Source

Responsive CSS3 Side Navigation Menu

About Allie Kingsley

Allie Kingsley is a social media manager for designscrazed. She is crazy about new gadgets and up to date with latest technology trends. Use comments to notify any issues you are facing.

Check Also

onepage-cart-plugin

19 Best Online Shopping Cart Plugins

Online stores have grown to a extreme level these last few years as we grow …

2 comments

  1. Nitin mohan

    thanks for info Allie Kingsley

  2. firuz

    Cool))

Leave a Reply

Your email address will not be published. Required fields are marked *