JQuery UI & Widgets. JQuery Basic Page Layout. Ketchup Plugin. Ketchup is a small (3.4KB minified & gzipped) jQuery Plugin that helps you to validate your forms. Out of the box it has 18 basic validations and a bubble like style. But truly this Plugin wants to be hacked to fit your needs. Easily write your own validations and overwrite/extend the default behaviour. Bubbles are not for everyone... Default Behavior If you like the style of the bubbles and all validations you need are already included you can get this Plugin up and running like so: Your HTML Header Include the default stylesheet (located in . <!
Your HTML By default Ketchup checks the data-validate attribute of form fields if it can find matching validations. Your Javascript Just call ketchup() on your form, voilà. $('#default-behavior').ketchup(); Declare fields to validate in the call In last version Ketchup checked the class attribute for validations... which was not everyones taste because class should be used for defining CSS classes. Validate on different events Included Validations. jQuery for Designers - Tutorials and screencasts. jQuery Function Builder - a quick jQuery syntax function generat. MicroTut: Getting And Setting Cookies With jQuery & PHP – Tutori. Martin Angelov HTTP is a stateless protocol, which means that every request you make to a website is standalone and therefore cannot keep data by itself. But this simplicity is also one of the reasons for its widespread adoption in the early ears of the web.
There is, however, a way to keep information between requests in the form of cookies. This way you can have effective session managemet and persistent data. There are two ways to work with cookies – server side (PHP, ASP etc) and client side (JavaScript). Cookies and PHP Setting cookies To create a cookie in PHP, you need to use the setcookie function. Setcookie( 'pageVisits', $visited, time()+7*24*60*60, '/', 'demo.tutorialzine.com' ); If you pass 0 as an expiration time (which is the default behavior) the cookie will be lost on browse restart. There are two additional parameters that you could pass to the function, which are not given here.
For most practical purposes, you would only need the first four parameters, omitting the rest. Colorful Sliders With jQuery & CSS3 – Tutorialzine. Martin Angelov In this tutorial we are using jQuery and the new transformation features brought by CSS3 to create a three dimensional dynamic slider effect. The techniques presented here – for creating sliders, and CSS dynamic resizable bars, can be used together or in part for powering all sorts of jQuery goodness. Also, be sure to go ahead and download the PSD, so you can create your own colors and shapes.
Step 1 – XHTML We start off with the XHTML part of the tutorial. Demo.html In the code above, you can see that we basically have only two structures, which are duplicated three times, once for every color. Inside the slider is the slide-handle div, which is converted to a draggable jQuery UI control, the movements of which are later translated to changes in the size of the bars.
The second group is the one of the colorful bars. Lastly, we have the .perspective div. Dynamic jQuery & CSS Bars Step 2 – CSS styles.css – Part 1 The Colorful Bars styles.css – Part 2 The CSS3 Transformations. Interactive Image Vamp up with jQuery, CSS3 and PHP. Today we will show you how to create an online application for giving some funny touches to an image. We will be using jQuery and jQuery UI for dragging and resizing little bling elements like mustaches and glasses. With PHP the image and the bling elements will get merged and the end […] View demoDownload source Today we will show you how to create an online application for giving some funny touches to an image. We will be using jQuery and jQuery UI for dragging and resizing little bling elements like mustaches and glasses. With PHP the image and the bling elements will get merged and the end result can be viewed. Ok, let’s get started! The Markup The markup is pretty simple: we have a main container with the objects sidebar, the main image and the tools area: The objects sidebar contains all the draggable elements and the tools area will show a list of all the used elements.
The CSS Let’s start with the styling of the content and the image container: The JavaScript The PHP And that’s it! 35 Fresh JavaScript/jQuery Tools and Resources. Mar 24 2010 It’s time for more JavaScript and jQuery goodies here on Noupe. Today we are featuring fresh JavaScript Development Frameworks, code optimization and minimization tools, reference tables, compatibility issues, common coding errors, image manipulation techniques and graph solutions. Please feel free to submit further resources in the comments to this post! JavaScript Development Frameworks php.js php.js is an open source project that brings high-level PHP functions to low-level JavaScript platforms such as webbrowsers, AIR, V8 and rhino. jai – javascript audio interface J.A.I. or “Javascript Audio Interface” is the world’s first javascript interface for web <audio>.
jQuery.sheet – Visual Interop Development jQuery.sheet gives you all sorts of possibilities when it comes to giving your web application a spreadsheet style interface with MS Excel style calculations. SproutCore JavaScript HTML 5 Application Framework. JavaScript Code Optimization and Minimization Tools Graphs.