Share 10 useful gadgets for developers and designers, and 10 useful gadgets for developers and designers

ArticleDirectory

• 1. Gaget: a free Google Analytics (analysis) tool for Mac OS X
• 2. Javascript implements the map drag function sprymap
• 3. Literally canvas-open-source HTML5 drawing component
• 4. Sharenice: A small tool shared by open-source Society
• 6. Like it? Tweet it? : Website recommendation gadgets
• 7. Meteora: cross-browser plug-ins and controls
• 8. Icarousel: javascript tools for creating slides, sliding doors, and other special effects
• 9. Socialcount: lightweight mobile-friendly social network gadgets
• 10. Percentageloader

A component (or control) is an element that displays a variable information graphical user interface (GUI) in a user, such as a window or text box. In web development, we often need to build user-friendly components, such as the drag and drop of Baidu Google maps, the display times of social sharing tools, and beautiful UI buttons. These are applications built by widgets.ProgramThe module then presents the basic visual page to the user.

I will share with you today 10 useful gadgets, I believe this will suit the needs of most developers,These gadgetsInIn terms of availability, speed, and stabilityDevelopers provide more options. If you are developing such a project, these gadgets are good choices.

Articles you may be interested in

Free design tools that web developers should know to simplify workflows
10 excellent online image compression and optimization tools that web developers should know
Share 10 excellent UI box tool 1. Gaget: a free Google Analytics (analysis) tool for Mac OS X

Gaget is an important component of Google Analytics statistics for Mac OS X..It displaysNumber of visits,New visitor.This toolNot limited to a singleWebsite,EasySwitch between configuration files(Multiple instances canUse). Demo
 

 

2. Javascript implements the map drag function sprymap

Sprymap is an independent and lightweight JavaScript class library that does not depend on any other JS framework. Using it, you can easily achieve drag effects similar to those of Google and Baidu maps. sprymap is a good choice for displaying large charts. Sprymap is highly customizable. You can set the starting position and CSS style of the image through parameters. In addition, you can also set whether to use a smooth drag effect. Demo

Usage

First, load the sprymap script file in the head.

 

 
<SCRIPT type = "text/JavaScript" src = "spryMap-min2.js"> </SCRIPT>
 

 

Add the image to be displayed on the page, for example, setting the IMG Tag ID to worldmap.

 

 
<IMGID= "Worldmap"SRC= "Map.jpg"/>
 

 

Last initialized during page loading

1 VaR map = new sprymap ({ID: "worldmap ",2 Height: 400,3 Width: 800,4 Startx: 200,5 Starty: 200,6Cssclass: "mappy "});
 

 

 

 

 

3. Literally canvas-open-source HTML5 drawing component

Literally canvasIs an open-source HTML5 component that can be integrated into any page so that users can draw images online. It comes with a set of simple tools including drawing, erasure, color selector, undo, redo, pan and zoom,

This plug-in is developed using jquery + underscore. js and has an API for background color, tool, and size. In addition, you can export the drawn result to an image.

 

 

4. Sharenice: A small tool shared by open-source Society

Sharenice is an open-source social sharing tool similar to addthis. It is easy to add this sharing feature to any website. It focuses on user privacy and does not share any cookies or any information with a third party. The new one has built-in support for the most popular social networking sites (Twitter, Facebook, etc.), and considers providing source code that can be added (or deleted ). Demo
 

 

5. Ninja UI: One set Pretty Gadgets Code

This jquery plug-in helps you create a super beautiful Web UI. Supports HTML 5 browsers with buttons, auto-completion, images, dialogs, canvases, labels, and slider .. Demo
 

 

6. Like it? Tweet it? : Website recommendation gadgets

Like it? Tweet it! Is a jquery Twitter tool that allows the public to tweet your first chic box to appear in the corner of your web page. It includes the website address of your website. You can enter anything other than yourself. Demo
 

 

7. Meteora: cross-browser plug-ins and controls

Meteora is a set of cross-browser components and controls that allow you to quickly write rich And customizable Web applications without wasting time reading the entire page of documents or debugging JavaScript programming for each browser.
Meteora is an open source project based on the mootools framework. Demo
 

 

8. Icarousel: javascript tools for creating slides, sliding doors, and other special effects

A web developer is usually faced with displaying product images with continuously rotating content. Icarousel is a javascript tool used to create slides, sliding doors, and other special effects. For example, you can use it to create a product demo that displays multiple images or product widgets in a fixed space, or create a tab switch effect. Demo
 

 

9. Socialcount: lightweight mobile-friendly social network gadgets

Socialcount is a lightweight (2.93kb) and easy-to-use jquery plug-in that supports progressive enhancement, delayed loading, and mobile-friendly social network components. Currently, it supports Facebook, Twitter, and Google +. Demo
 

 

10. Percentageloader

Jquery. percentageloader: The jquery plug-in can display progress in an attractive, intuitive, and eye-catching manner. It uses HTML 5 canvas to generate a progress image. This plug-in is more cool than the general progress bar application. The graphic results are similar to the jquery knob plug-in we introduced earlier. This plug-in is fast and simple, and can be well applied to modern browsers. Demo

 

Link to this article: 10 useful gadgets for developers and designers

1234