Jquery
Jquery is a opensource javascript framework that allows to improve the functionality of client side scripting.
Introduction To Jquery Find Function
Jquery find function allows you to search for elements inside a given container. You can combine the powerfull functionality of jquery find with some other functions and do some amazing client side manipulations without connecting to the server side. Throughout this tutorial I’ll show you practical examples of using jquery find in real world web applications..
Tutorial Contents
- 1. Assign Background Colors To Table Rows Using Jquery Find
- 2. Search Table Values and Highlight On Specified Condition
- 3. Create Hovering Menu Form Unordered Lists
Introduction To Working With Google Web Fonts
Google web fonts directory provides hundreds of different styles of fonts to use in your projects. Highlighting important content with different fonts allow users and search engines to scan your content very quickly. Lets learn how we can simply use google fonts style our content using jquery plugins.
Tutorial Contents
- How To Inlcude Google Fonts
- Jquery Plugin with Inline CSS Styles for Google Fonts
- Jquery Plugin with Common CSS Styles for Google Fonts
Introduction To Form Validation with Jquery
My previous article “Mastering Jquery Form Validation Using Practical Examples” became the most popular tutorial on innovativephp. So I thought I could write a tutorial to improve the form validation and enable reuse of code using a jquery plugin. In this tutorial I’ll explain the advantage of using a validation pluign and how to create a plugin from scratch.
Tutorial Contents
- Define the Plugin Structure
- Define Validation Rule Passing Structure
- How To Display Validation Errors
- Initializing Form Validation
- Adding Reusable Validation Functions
- How To Use the Validation Plugin
Introduction To Element Resize With Jquery
Jquery UI Library provides a event called resizable which enables html elements to be resized within the document. Resizable can be considered as a sub event of dragging. You can hold the resize handlers and drag within the specified area to increase or decrease the size of the DOM element. This functionality is useful in providing some interactive and advanced user controlles which enhances the user interactivity.
Tutorial Contents
- Introduction To Element Resize With Jquery
- Enable and Disable Resize To Show More Content
- Displaying More Content On Resize
- Disable Resize After Displaying Full Content
- Remove Jquery Resizable Handlers On Complete
- Creating Resizable Value Sliders
Introduction To Form Validation Techniques
In this tutorial I am going to show you how to master the form validation techniques of web applications using jquery library. All the practical examples of form validation and form handling is explained in easily understandable method using practical demonstrations.
Tutorial Contents
- Types of Form Validation
- Submit and Validate Forms in Jquery
- Validating Form Input Controls
- Handling Error Messages on Form Submit
- Highlighting Form Fields
- Using Button as a Submit Button
- Using Image as a Submit Button
- Email Validation Using Jquery
- Textbox Length Validation
- Textarea Length Validation
Jquery Average Time On Page
Average time on a page is an important metric to track the top content where your users stays on for a long time. Increasing the time spent on landing pages will increase the chance of users buying your services or products. So in this tutorial I am going to show you how to simply calculate time on a page using jquery ready and unload functions.
Tutorial Contents
- What is average time on page
- Calculating the time on page
- Things to consider in using window unload function
Creating a Dynamic Back To Top Button with Fixed Position
When we get a web page or post which is very long due to the size of the content we need to use the scrollbar to see the content on the bottom. Once we read out the page in order to get to the top menu we need to scroll up again. In users perspective this is a very boring task. So if we can provide a method to go back to the top without scrolling , it will enhance the user’s experience in using the site. So I am going to create a simple button to achieve this task..
Tutorial Contents
- Why We Need a Back To Top Button
- Demo and Source Code Download
- Creating the Back To Top Button Using Jquery and CSS
- Code Explanations
Introduction To Word Cloud With Google Visualization API
Word Cloud is a technique where we analyze a string to find words inside the string and the number of appearances of the word. Word Cloud displays words in different styles according to the word density in the string. Common format is that words with most number of occurrences are displayed with a higher font size and words with least number of occurrences is displayed with small font size.
Tutorial Contents
- Introduction To Word Cloud
- Google Visualization API Word Cloud
- Extending Word Cloud Widget Using Jquery and PHP
Introduction To Jquery Page Content Slider
Page Content Sliders are a widely used component in modern web development. Basically a slider provides the functionality used in a presentation.The content is divided into slide components as in presentaions and the slider automatically changes the content using a sliding animation effect in specific time intervals. Also users can stop the automatic changing and manually switch through the slides using slider navigation bar.
Tutorial Contents
- Introduction To Jquery Page Content Slider
- Innovative Slider Switcher
- Planning the Slide Switcher
- Developing the Slide Switcher
How to Make a Div Invisible Using CSS and Jquery
Changing the visibility of elements is very usefull when you display large amount of content using tabs,accordians,sliders..etc. In this tutorial i am going to show you how to change the visibility of div element using css and jquery. You can apply these techniques to most of the html containers available.
Tutorial Contents
- How to Make a Div Invisible
- Creating a Invisible Div using Jquery
- Invisible Div Download
Follow Us On Facebook