JavaScript

This project is a sample of image zoom effect using the jquery plugin. This is an easy to use plugin. We can also customize the other effect like for example adding a tint and setting the color and opacity of the tint overlay. Hope you learn from this project.

This simple project will teach you how to enable submit button when a radio button which corresponds to a certain action is selected. This is commonly used in "Terms and Condition" agreement. In this example, the submit button is only enabled once a user selects "I agree with the terms and condition". Hope this helps you with your current works.

In this project, you will learn how to create overlay and transparent div background. By clicking the images, div overlay will appear with the original size of the image clicked and also it has a transparent background which looks like a new window but it's definitely not. It's just a div set to 100% width and height and opacity of .8 which covers the whole content of the page. Hope you learn from

This project will teach you how to add more form fields using javascript. I have example form inserting personal info including spouse, and children's name. In children's section, the user has an option to add another form field to filled up. By clicking the + button, it will automatically add form fields. Hope you learn from this.

In this project, you will learn how to use data table jquery plugin. Just add the data table plugin in your project and with a single javascript code, data tables can be initialized. This will enhance the accessibility of data in html tables. Hope you learn from this.

This is a simple color picker using jscolor plugin. Using the onchange event, background color of the page will change once the user chooses a color. The color code is also displayed which the user can copy. Hope you learn from this.

This project will teach you how to create a simple jquery tabs using jquery and css. I used fragment identifier this.hash for the href values in the navigation. this.hash is equivalent to #about, #faqs and #contact. By clicking each tab, the older vissible tab will be hidden and the new tab will show. Hope you learn from this.

This is a simple project on how to upload files using Ajax. This will upload the files without reloading the page. As you will see in the code, I created a new FormData object and append each file into it. This will pass the data as a request to the server. Hope this example will help you on your future projects.

This project is an example of WYSIWYG rich text html editor using Javascript. You will see in the code that I used textarea in the body field and replaced it with iframe which I enabled. This project has a capability to change font, font color, font size, font color, align text or images to left, center and right, has an option to make text bold, italic and underlined, create horizontal line

This project will teach you how to print a specific part of a document using Javascript. Each part is wrapped with a div and that we will use the div as the element. As we see in the screenshot, each div has a print button which can determine what part needs to be printed. You also have an option to print the whole page.