Scroll page back to the top

JavaScript Tutorials

Html form field hint with jQuery and Css

Html form field hint with jQuery and Css

Today we will have a look at a useful feature, that can improve the usability of our online form. We will create a 'field hint', which politely prompts user to enter valid information to the the form field. To create it we will use a few jQuery methods, some javascript and Css.

Time: 18:72 min

Sebastian Sulinski on 30th Apr 2013

DemoWatch now!
Copy field content with checkbox

Copy field content with checkbox

In this tutorial I'm explaining how to create a simple functionality for the online form where by selecting the checkbox, content of the fields from one section is copied to the other section of the form.

This functionality is particularly useful in the situations where the visitor uses the same billing and shipping address during the checkout process.

We'll create all this using some javascript and a few jQuery methods.

Time: 21:18 min

Sebastian Sulinski on 28th Apr 2013

DemoWatch now!
Sliding Side Navigation with jQuery

Sliding Side Navigation with jQuery

In this tutorial we will create a sliding, side navigation using jQuery. The navigation created in this tutorial can be used as a bookmark or a 'quick access' navigation section of any website, which keeps at the same position when you scroll the page up or down.

Sebastian Sulinski on 24th Feb 2013

DemoRead now!
Responsive search with jQuery and PHP

Responsive search with jQuery and PHP

This course shows how to create a responsive search field with jQuery and PHP in order to filter Ajax loaded results while typing the search criteria.

We will learn how to fetch records from the database and display them on the page using Ajax. How to create a filter input field where user can enter their keyword / phrase as well as how to dynamically update the pagination and display the right page and number of records.

Time: 104:03 min

Sebastian Sulinski on 1st Jan 2013

DemoWatch now!
Place content in the div with the on-click event

Place content in the div with the on-click event

In this tutorial I'm explaining how to place the content inside of the div with the on-click event. The content is assigned to the one of the attributes of the trigger element.

Sebastian Sulinski on 3rd Nov 2012

DemoRead now!
Preload, Slide in and Change Opacity of the Image with jQuery

Preload, Slide in and Change Opacity of the Image with jQuery

This tutorial explains how to pre-load a number of images, slide each one from a different side into its display container and how to change opacity on hover event using jQuery.

Time: 24:17 min

Sebastian Sulinski on 19th Jul 2012

DemoWatch now!
Highlight content by tag with jQuery

Highlight content by tag with jQuery

In this short series we will learn how to highlight the sections of the content on page based on what html tag they are wrapped within.

Time: 11:04 min

Sebastian Sulinski on 8th Jul 2012

DemoWatch now!
Cookie Consent Dialog with JavaScript

Cookie Consent Dialog with JavaScript

The new EU "Cookie Law" says that all website owners have to gain the consent of their website visitors before they can use certain web cookies, which in simple terms means saving a small text file on the visitors computers, usually used to gather some statistics or to improve functionality etc. It's worth mentioning that not all cookies are considered to be "Bad" - there is a lot of material online where you can read about the issue, an example would be ICO : Guidance on changes to the EU cookie law.

This tutorial explains how to easily create a user friendly dialog, that prompts for a consent and if accepted, loads the code, which generates cookies.

The code is created using JavaScript and some jQuery - so it is platform independent and can be applied to any website.

Time: 25:08 min

Sebastian Sulinski on 6th Jul 2012

DemoWatch now!
Simple, on-page link extractor with jQuery

Simple, on-page link extractor with jQuery

This short series explains how to easily create an on-page link extractor using some JavaScript and jQuery. The completed code will be able to identify all links within the content of the page and append them to the designated container.

Time: 11:74 min

Sebastian Sulinski on 3rd Jul 2012

DemoWatch now!
Show more with jQuery

Show more with jQuery

In this short series we will find out how to display a limited number of characters of each record in the loop and how to add 'show more' link to reveal the remaining content using jQuery, PHP and MySQL.

Time: 11:44 min

Sebastian Sulinski on 7th Jun 2012

DemoWatch now!
Page 1 of 6