WebAppers

/ best free open source web resources /

Graphic Resources

Open Source Drag & Drop File Uploads with Dropzone.js

Posted · Category: MIT License, Upload

Dropzone.js is an open source library that provides drag’n’drop file uploads by simply including a java-script file. It views previews of images and you can register to different events to control how and which files are uploaded.

It supports Chrome 7+, Firefox 4+, IE 10+, Opera 12+ and Safari 5+. For all the other browsers, dropzone provides an oldschool file input fallback. It is released under MIT License.

drop-zone

Requirements: jQuery Framework
Download Link: http://www.dropzonejs.com/
License: MIT License

A Fully Responsive & Lightweight jQuery Dateinput Picker

Posted · Category: Calendar, Forms, MIT License

Pickadate.js is a fully responsive and lightweight jQuery dateinput picker. It looks pretty neat and simple. It is easy to use. And alos, you can have different themes for it as well.

It has been tested on IE7+, Chrome, Firefox, Safari, Opera, iOS Safari, Android browser. The pickadate.js script supports all modern browsers and IE 9+. To support IE 7+ and other old browsers, include pickadate.legacy.js instead. It is released under MIT License.

pickadate-js

Requirements: jQuery Framework
Download Link: http://amsul.github.com/pickadate.js/
License: MIT License

A Dashboard Shows An Overview of Bugs in GitHub

Posted · Category: MIT License, Tools

GitHub Survivor is a simple bug dashboard that shows an overview of bugs in a GitHub-hosted repo. 99designs is using it at to keep an eye on the bug count and remind themselves to close bugs.

It’s easy to forget about bugs when you’re knee-deep in feature development. This dashboard is a good way to keep bugs on people’s minds, and to show at-a-glance information about the current bug situation. GitHub Survivor scrapes your bug data using the GitHub API and stores it in your local Mongo DB for subsequent querying.

A bug leaderboard occupies the bulk of the screen. It shows who’s closed the most bugs this sprint and who’s forgotten to spend some time fixing bugs. There are charts showing the number of bugs opened and closed in recent sprints, the open bug count over time, and a big indicator showing the current open bug count.

github-survivor

Requirements: Github
Download Link: https://github.com/99designs/githubsurvivor
License: MIT License

jQuery Plugin for Sprite Based Animations & Panning

Posted · Category: Framework, MIT License

Motio is a jQuery plugin for simple but powerful sprite based animations and panning. Motio is called on an element representing animation container, where animation is delivered as a CSS background image.

In sprite based animations, container should have the dimensions of one sprite frame. E.g, if you have 10 frames in a horizontal sprite that is 1000 x 100 pixels big, the container should be 100 x 100 pixels big. In panning, container size doesn’t play any role, just the background image should be seamless.

Integrated Motio on/off methods are using jQuery $.Callbacks API, which is in jQuery sice 1.7+. If you can’t use newer versions of jQuery, you can go for jQuery bind/unbind methods called on a frame element, with ‘motio:’ prefix on all event names.

motio

Requirements: jQuery Framework
Download Link: http://darsa.in/motio/
License: MIT License

A Force Directed Graph Layout Algorithm in JavaScript

Posted · Category: Charts, MIT License

Springy is a force directed graph layout algorithm. It means that springy uses some real world physics to try and figure out how to show a network graph in a way that looks good.

Springy.js is designed to be small and simple. It provides an abstraction for graph manipulation and for calculating the layout and not too much else. The details of drawing and interaction are mostly up to you. This means you can use canvas, SVG, WebGL, or even just plain old positioned HTML elements.

springy

Requirements: JavaScript Framework
Download Link: http://getspringy.com/
License: MIT License

Spectragram – An Easy jQuery Plugin for Instagram API

Posted · Category: MIT License, Tools

Spectragram is an easy jQuery plugin for Instagram API to fetch and display user, popular or tags photo feeds inside your web application or site. You can get get the most recent media published by a user, the most popular media at the moment, or recently tagged media from Instagram API.

You can display the results on list items or any other HTML tag you define, Define the size of the pictures (small, medium, big), and use your own Instagram application ClientID and AccessToken. It is licensed under MIT License.

instagram-api-jquery

Requirements: jQuery Framework
Download Link: http://lab.adrianquevedo.com/jquery-spectragram/
License: MIT License

Integrate Google Analytics Easily with Analytics.js

Posted · Category: MIT License, Stats

Every project needs analytics. But you shouldn’t have to litter your codebase with third-party-specific calls. Changing or adding new services should be a snap.

That’s where analytics.js comes in! Instead of adding hooks for every single analytics service you integrate, you add a single set of provider-agnostic hooks that then route to any analytics service you want! Analytics.js gives you a hassle-free way to integrate analytics into any web application.

google-analytics-js

Requirements: Google Analytics
Demo: http://segmentio.github.com/analytics.js/
License: MIT License

Shapeshift: Inspired by jQuery Masonry with Drag & Drop

Posted · Category: MIT License, Tools

Shapeshift is a plugin which will dynamically arrange a collection of elements into a grid in their parent container. Shapeshift is intended to be a very bare bones version of these grid systems, however the drag and drop is what sets it apart from the other similar plugins. Position any item within the grid by dragging and dropping them into place. Shapeshift will try to find a logical place for it and display that to you.

Resizing the grid to accommodate for more or less space is automatically turned on in Shapeshift, so if your parent container has a 100% grid resizing the window will shapeshift the child objects around to accommodate for the new layout. You can even set CSS3 media queries on your objects and watch as they get shapeshifted around their new size.

shapeshift

Requirements: jQuery Framework
Demo: http://mcpants.github.com/jquery.shapeshift/
License: MIT License

A/B Testing using Pure JavaScript & Google Analytics

Posted · Category: MIT License, Stats

ABalytics.js is a pure javascript library allows you to do simple A/B testing working only on your client-side code. All data is registered as custom variables in your website Google Analytics profile, so you don’t need to configure anything server side.

You simply mark the html elements you want to test on with a class, the substitution is automatic. There is no need to set anything up server side, the data is stored on Google Analytics. You can conduct multiple, independent experiments at the same time. Each experiment will use a custom variable slot. It is pure javascript, you just need to include GA.

a-b-testing-google-analytics

Requirements: JavaScript, Google Analytics
Demo: https://github.com/danmaz74/ABalytics
License: MIT License

A Beautiful CSS3 Image Gallery jQuery Plugin

Posted · Category: Gallery, MIT License

Photobox is a CSS3 Image Gallery JQuery Plugin. It is beautiful and posses a great look & feel. Both the script & CSS are only 7k each. It uses silky-smooth, hardware accelerated, CSS3 transitions and animations for better performance.

It works also on IE9 and above, but clearly not as nice as in normal browsers. Image can be zoomed in and out with mousewheel and navigated using mousemove to move around. The bottom row of thumbnails can be navigated by mouse movment. It supports keyboard keys for navigation and closing the gallery view.

photobox-css3

Requirements: CSS3
Demo: http://dropthebit.com/demos/photobox/
License: MIT License

Page 37 of 74...«333435363738394041»...
Supported By

Deals

Web Browsers Icon Set
Food Icon Set
Flat Icon Set

Flat Icon Set

100 icons