This tutorial will take you through the step by step development of building a ToDo App entirely powered by Web SQL. You will learn about getting started with Web SQL, understanding transactions, following best practices and how to write re-usable functions.
Best jQuery Web Plugins & Tutorials with Demo
Prism : Lightweight, robust, elegant syntax highlighting
Prism is a new lightweight, extensible syntax highlighter, built with modern web standards in mind. It’s a spin-off from Dabblet and is tested there daily by thousands.
Features:
- Each language definition adds roughly 300-500 bytes.
- Prism forces you to use the correct element for marking up code:
<code>. On its own for inline code, or inside a <pre> for blocks of code. In addition, the language is defined through the way recommended in the HTML5 draft: through a language-xxxx class. - upports parallelism with Web Workers, if available.
- Very easy to extend without modifying the code, due to Prism’s plugin architecture.
- Very easy to define new languages. Only thing you need is a good understanding of regular expressions
- All styling is done through CSS, with sensible class names rather than ugly namespaced abbreviated nonsense.
- Wide browser support: IE9+, Firefox, Chrome, Safari, Opera, most Mobile browsers
- Highlights embedded languages (e.g. CSS inside HTML, JavaScript inside HTML)
- Highlights nested languages (CSS in HTML, JavaScript in HTML)
“Scroll To Top Then Fixed” Effect With jQuery
Of late there has been a UI trend of page elements (usually navigation items) that scroll with the rest of the page until they reach the top of the browser window. At this point those elements stop moving, while the rest of the page’s content continues to scroll up behind them. This trick – referred to variously as “scroll to top then fixed” or “fixed floating elements” can’t be achieved with CSS alone, at least at this stage; we must integrate some JavaScript (for this example, in the form of JQuery) to pull the effect off.
jCouch : A jQuery Plugin for Distraction Free Page View
jCouch is a very lightweight jQuery plugin that provides you the feature of viewing a web page in distraction free mode. If your website is text oriented and the visitors on your site prefer reading your site content then this plugin will allow the users to read your web pages in the most convenient way without being distracted by other less useful content on the site. The plugin allows you to combine the selective parts of the web page in a single view.
Features
- Light weight
- Easily customizable
- Zoom text feature
- Full jQuery Selectors Support
- Disable on pressing ‘Esc’
Twitter like Real Time Wall Update Using Pusher API and jQuery
If you have ever dreamt of showing real time data on your website then this tutorial is for you. In this tutorial I will show you how to show real time updates and data on you web pages. Here I will use Pusher API to create a two way communication between the client and server. The Pusher API uses websockets for the two way communication and its free for starting your development.
Here I have created a Twitter/Facebook style real time updating wall script that will display the status updates of the users in real time.
Hazaar : jQuery PDF Viewer Plugin
At the moment this is a plugin for jQuery to render a PDF. It uses the PDF.js library from Mozilla to render the PDF completely inside the browser. Requires no extra software to be installed on the client computer, such as Adobe Acrobat Reader.
Features:
- View PDFs in the browser without extra software. PDFs are rendered in JavaScript!
- Skip to any page immediately, or by next/prev.
- Zoom in/out
- Download the source PDF directly!
- Loading status progress indicator!
Sticky : A super simple jQuery notification system
Let’s face it, your users need sweet little notifications to keep them all warm and fuzzy inside. Sticky allows you to send such messages with ease, and class. Quickly notify a user of software updates, process completions, or annoy them with registration reminders.We can also use Sticky to display data we’ve grabbed via AJAX. This could make for a very powerful message queue system for your users.
