JavaScript mobile and touch frameworks

JavaScript mobile and touch frameworks

JQuery Mobile: the version of jQuery on Mobile phones and tablets. JQuery Mobile not only brings jQuery core libraries to mainstream Mobile platforms, but also releases a complete and unified jQuery Mobile UI framework. Supports mainstream mobile platforms around the world. The jQuery Mobile development team said: we are very excited to develop this project. Mobile Web requires a cross-browser framework so that developers can develop real mobile Web websites. We will do our best to meet such requirements. Sources.

Zepto. jsZepto. js is a JavaScript framework that supports mobile WebKit browsers and has the jQuery-compatible syntax. 2-5 k Library, through a good API to handle the vast majority of basic work. Sources.

MicroJS: Microjs website applications list many lightweight Javascript class libraries and frameworks, which are small and mostly smaller than 5 kb. In this way, you do not need to load a JS framework because you only need a function.

PhoneGap: an open-source mobile application development platform that uses only HTML and JavaScript to create applications that can run on multiple mobile devices. Sources.

Sencha TouchSencha Touch is an HTML5 framework that supports multiple smartphone platforms (iPhone, Android, and BlackBerry. Sencha Touch can make your Web apps look like Native apps. The beautiful user interface components and rich data management are fully compatible with Android and Apple iOS devices based on the latest HTML5 and CSS3 WEB standards.

JQtouch is a jQuery plug-in. It is mainly used to implement some JavaScript libraries on Webkit browsers on mobile phones that include animations, list navigation, default application styles, and other common UI effects. Sources.

DHTMLX Touch is a JavaScript framework for mobile and Touch devices. DHTMLX Touch creates mobile web applications based on html5. It is not just a set of UI gadgets, but a complete framework that allows you to create cross-platform web applications for mobile and Touch devices. It is compatible with mainstream web browsers. Applications created with DHTMLX Touch can run smoothly on iPad, iPhone, and Android smartphones.

 

JQuery plugin

Waypoints is a jQuery plug-in used to capture various rolling events, such as page-less content browsing, or fixing an element to prevent scrolling. Supports mainstream browser versions.

The Lazy loader plug-in can implement delayed image loading. When a webpage is relatively long, only images in the user window will be loaded first, the image outside the window will not be loaded until you drag the scroll bar to the back, which effectively avoids the disadvantages of Loading slowly due to too many images.

TweenJS: A simple and powerful Javascript library for tweening/animation.

JQuery animation plug-in for Easings Css3

Spritely can be used to create animation effects like flash, for example, a flying bird or a dynamic scrolling background on the page.

File Upload, jQuery File Upload plug-in 4.4.1

Slideshow/Carousel plug-in. Sources.

Supersized-full screen background/slide plugin

Masonryi is a cool automatic typographical plug-in. This jQuery tool can automatically Arrange Horizontal and vertical elements based on the grid, surpassing the original css. Sources.

JQuery's simple Layout demonstration manages various sidebar Layout S.

Flexigrid-jQuery data table plug-in

Isotope is definitely an incredible jQuery plug-in that you can use to create dynamic and intelligent la S. You can hide, display, and filter projects, re-sort, sort, and even more.

The Super GesturesjQuery plug-in can implement the mouse gesture function.

MouseWheel is a jQuery plug-in developed by Brandon Aaron. It is used to add cross-browser support for mouse wheel.

The AutoSuggestjQuery plug-in allows you to add automatic functions.

QTip is a pretty jQuery tooltip plug-in, which has powerful functions.

JQueryCharts and graphic are used to create charts.

JQuery Tools-Themissing UI library

 

 

HTML5 Video Player

Popcorn. js is an HTML5 Video framework. It provides easy-to-use APIs to synchronize interactive content, making operations on the attributes, methods, and events of HTML5 Video elements easy to use. (From Mozilla)

The LeanBack PlayerHTML5 video player does not depend on any JavaScript framework. Supports full-screen playback and volume control to play multiple videos on the same page. (From Google)

Vid. ly provides the Conversion Function for your uploaded videos and creates a short URL for the converted videos. Through Vid. ly, so that your video can be played on 14 different browsers and devices. You don't need to worry about the devices that will be used by the people who want to browse the video, in order to avoid incompatibility between the competition of various software giants and bring huge troubles to users, the short website allows you to share videos through Twitter, Facebook, and other methods. Vid. ly can also be embedded into other webpages through html code. The free Vid. ly account space is 1 GB, and the free account has no playback or browsing restrictions.

 

JavaScript audio processing and Visualization

With HTML5 and Flash, SoundManager V2 only uses a single API to provide reliable, simple, and powerful cross-platform audio processing.

DSP, JavaScript voice Digital Signal Processing

The RadiolabHyper Audio Playerv1 brings you WNYC Radiolab, SoundCloud, and Mozilla Drumbeat

JPlayer, A jQuery HTML5 audio/video library with complete functions

 

JavaScript graphics and 3D

Processing. js is an open programming language that can be used to implement program images, animations, and interactions without using Flash or Java applets. It uses Web standards without any plug-ins.

Javascript 3D engine: ThreeJS is developed by Mr Doob. It is a lightweight 3D engine that can be used by dummies without any details. This engine can be used , And WebGL.

Shader Toy, an online coloring tool Editor (2D/3D) that uses WebGL ). the online application architecture allows you to get started without downloading any software. shader Toy contains a large number of practical pasters, such as light tracing, scene distance rendering, sphere, tunnel, deformation, and post-processing special effects.

PhiloGL of PhiloGL and Sencha is one of the first WebGL development tools. It provides high-level functions to build WebGL applications. Sencha created several demos to describe the framework's interactive 3D virtualization capabilities, such as 3D view of global temperature changes.

WebGL Inspector is the same as Web debugging tools such as Firebug. This is a debugging tool for WebGL.

A list of WebGL frameworks collected by Khronos Group.

EaselJS, a JavaScript library using html5 canvas. Sources.

JavaScript Game Frameworks provides a free list of JS Game Frameworks. For more information, see the JS game framework list.

Rapha? L is a small JavaScript library used to simplify the work of displaying vector graphs on pages. You can use it to draw various charts on the page and cut and rotate images. See Javascript vector map Lib-Rapha? L

The jQuery SVG plug-in allows you to interact with SVG canvas.

Google chart tools-see the use of Google APIs on this site for statistical charts

Arbor. js is a JavaScript framework for visualized data graphics created using webworkers and jQuery. It provides an efficient and force-directed Layout Algorithm for graphic organization and screen refresh processing.

 

JavaScript Browser Interface (HTML5)

Modernizr-a function detection class library designed for HTML5 and CSS3. It can provide more convenient front-end optimization solutions based on the browser's support for HTML5 and CSS3. sources. A useful list of cross-browser Polyfills

HTML5Shiv: This project aims to enable IE to recognize HTML5 elements.

Polyfills: This project collects some code snippets using Javascript to support special features of different browsers, and some code requires Flash.

YepNopeJS: An asynchronous conditional loader. Sources.

JQueryCSS3 Finalise: Are you tired of prefixing the CSS3 attribute of Each browser?

Amplify. js: a set of jQuery Component Libraries for web Application Data Management and Application Communication. Provides easy-to-use APIs. Amplify aims to simplify data processing in various formats by providing a unified program interface for various data sources. The storage components of Amplify use the localStorage and sessionStorage standards to process the storage information of the client, which may cause problems for some old browsers. Amplify 'adds some additional features to jQuery's ajax Method request. Sources.

History. js beautifully supports HTML5 History/State APIs

Socket. IOWeb socket programming.

 

JavaScript tools

{Mustaches} Small JavaScript template engine.

Json: select (), CSS-type JSON Selector

HeadJS, Asynchronous JavaScript loading. Its biggest feature is that it can not only execute in order, but also concurrently load js.

JsDoc Toolkit is a helper tool. You only need to add corresponding annotations to JavaScript code according to the Conventions, and then it can automatically generate API documents based on these annotations. Responsive image, a pilot project used to process responsive layouts images.

UglifyJS is a node. js-based Javascript parsing, compression, and formatting tool. It supports any Javascript platform of the CommonJS module system.

Dhteumeuleu, interactive DOM scripts, and DHTML open-source demos.

Backbone is a front-end JS Code MVC Framework, which is used by the famous 37 signals to build their mobile clients. It cannot replace Jquery and the existing Template library. Instead, they work together to build complex web front-end interactive applications. If the project involves a large amount of javascript code and implements many complex front-end interaction functions, you will first think of separating data from presentation. Jquery selector and callback can be used to easily achieve this. However, it is necessary for the structured organization of a large number of code for rich client WEB applications. Backbone provides the javascript code Organization function. Backbone mainly includes models, collections, views, events, and controller.

 

Client and Simulator

BrowserShot: checks the compatibility of browsers and tests cross-browser flags.

Test everything... Enter a URL you want to test ......

Android browser Simulator

IPhone browser Simulator

Opera browser Simulator

Firebug is integrated with Firefox to view and debug your Web pages.

 

CSS3 and Font Library

CSS3 MakerCCS3 generator is easy to create

CSS3 animations. Sencha Animator is a desktop application that can create CSS3 animations for WebKit browsers and touch mobile devices.

CSSwarp-CSS text distortion generator

Gradient Editor is a powerful Photoshop-style CSS Gradient compiler. From ColorZilla

Google Web Fonts allows you to browse all Fonts through the Google Web Fonts API @ font-face Kit Generator to convert Fonts for the Web

Typetester: Compare the font.

Media Queries. A set of responsive web designs.

Pattern TAP, UI component.

 

Website (FULL) template

HTML5 Boilerplate is an HTML5/CSS/js template. It is the best practice for cross-browser normalization, performance optimization, and stable optional functions such as cross-origin Ajax and Flash. Project developers call it a collection of skills to meet your needs for developing a cross-browser and future-oriented website. Sources.

HTML5 starter pack is a clean and organized directory structure, which is suitable for many projects, some commonly used files, and simple Photoshop design templates.

Initializr is an HTML5 template builder that helps you create an HTML5 project within 15 seconds.

Animated Portfolio Gallery (Tutorial) Slick MobileApp Website if you create a mobile app Website through jQuery and CSS.

If you use jQuery Mobile to create an RSS Reader

Single Page Applications friends who use jQuery (Backbone, Underscore ,...) Create a single page.