i (HTML4 & HTML5)

The details element represents a disclosure widget from which the user can obtain additional information or controls. However, the details element is not appropriate for footnotes.

Prompt box used for taking input from user. If you click on ok button then it return input value else it return null

When you begin to place more and more elements onto your web site, it will become necessary to make minor changes to the formatting of those elements.

JavaScript is a client side scripting language that can make your webpage intaractive and JavaScript can be embbeded into your static HTML webpage directly.

Using the css property we can get the simple CSS property value of an attribute.

In JavaScript there are functions that can be used to URL encode a string. In JavaScript you can use the encodeURI function

Think of a combination of an input text element and selection list. Typically used where there is the likelihood of a visitor entering a value of other (not one of the items in the list).

The contents are interpreted as text only; HTML markup is ignored. The user can type (theoretically) unlimited amounts of text into the textarea field. In reality the browser sets the limit.

By extending jQuery, you create reusable components that can be used on any web page. Your code is encapsulated and there is less risk that you will use the same function names elsewhere.

Unordered Lists, or <ul> .. </ul> tags, are ones that appear as a list of items with "bullets" or markers in the front. The bullet marks will depend on the particular version of your web browser.

In this example, four thumbnails are floating below heading. Try to resize the browser window to see how the float to the right.

jQuery is a very powerful tool which provides a variety of traversal methods to help us select elements in a document randomly as well as in sequential method. In other words, we can say that most of the traversing methods are used to find elements from the documents.

Images with title and borders

Javascript Events are the actions which are detected by the javascript when they are fired.

JavaScript setTimeout function provides the functionality to execute the specified function after the sepcified number of milliseconds. Using the JavaScript setTimeout function you can set the delay before function execution.

JavaScript clearTimeout function enables you to stop the timer event started by the JavaScript setTimeout function. When you apply the setTimeout function using a recursive loop over the JavaScript function by specifying the time delay then it calls the function continuously after equal intervals of time.

The switch statement is used to select one statement from the many blocks. This is used on place of nested if…else. If there are number of if..else statements then we should use switch.

jQuery AJAX life cycle demonstration. This is a demonstration of the methods ajaxStart, ajaxSend, ajaxComplete, ajaxStop, and ajaxSuccess that are triggered when load method is called.

JavaScript validation are client side scrips that is used to reduce the server load because all validation are check on client browser. This example has a required validation on the input box.

A function in Javascript is a group of statement that is executed when it's triggered. A function can be called from anywhere within the page. As it is the part of javascript it is defined under the <script> tag.

JavaScript if…else is a conditional statement that is used to check wether a condition is true or false to take a decision.

Javascripts loops are similar to other programming languages. Loops allows us to execute a block of statements to the specified number of times.

Drag and Drop magic with HTML5 using an image to drag back and forth between four <div> elements.

Not only can you include ordered lists within ordered lists, but you can also mix and match list types.

This HTML element indicates a media object to include in an HTML document. Usually, the object is a graphic image like the smiley :)

CSS3 transitions are effects that let an element gradually change from one style to another. To do this, you must specify the effect and the duration.

Triggers whenever you Select/Highlight some text within textbox or textarea.

The summary element represents a summary, caption, or legend for the rest of the contents of the summary element's parent details element, if any.

The HTML <keygen> tag is used for generating a key pair. When the control's form is submitted, the private key is stored in the local keystore, and the public key is packaged and sent to the server.

JavaScript clearInterval function enables you to stop the timer event started by the JavaScript setIntterval function. When you apply the setInterval function a JavaScript function by specifying the time interval then it calls the function continuously after equal intervals of time.

The height and width attributes are used to specify the height and width of an image and the attribute values are specified in pixels by default. Tip: It is a good practice to specify both the height and width attributes for an image.

jQuery allows to change the multiple CSS properties value at once.

Example form using <legend> and <fieldset> to make the form layout fancy.

This HTML element specifies an input control for a form. The type of input is set by the type attribute and can be a variety of different types. (See Advanced HTML for more information about the different input types)

jQuery events can be used to register behaviors to take effect when the user interacts with the browser, and to further manipulate those registered behaviors.

JavaScript validation are client side scrips that is used to reduce the server load because all validation are check on client browser. This example validates numeric characters on the input.

This event are fired when a key is pressed. IE 8 and earlier use event.keyCode to retrieve the key that was pressed down, while Firefox/Chrome/Safari/Opera use event.which.

Javascript Try…catch statement to check if there is errors in a block of code.

Here in a text box the timer is display on "start count" button click and stop on "start count " click

Form containing two radio buttons and two checkboxes. Note: The name attribute is used to group the radio buttons and checkboxes into groups.

Unordered or ordered lists can be arranged in two, three, or more columns using nothing more than css. We force the list to break at the right point. If We want two columns, you need to float the list items left and set them at 50% width and for three columns would require a width of 33% and floated left, four would be 25% and so on.

JavaScript validation are client side scrips that is used to reduce the server load because all validation are check on client browser. This example validates the input matches a valid e-mail address with a regular expression.

If you want to make an image work as a link, the method is exactly the same as with texts. You simply place the <a href> and the </a> tags on each side of the image.

Perform a calculation and show the result in an <output> element

JavaScript validation are client side scrips that is used to reduce the server load because all validation are check on client browser. This example validates alphabetic characters on the input

Create a new window and move new browser window.

CSS pseudo-classes are used to add special effects to some selectors.

The jQuery fade methods gradually change the opacity for selected elements.

jQuery Animate can function supports animation in different directions

The switch statement is used to select one statement from the many blocks. This is used on place of nested if…else. If there are number of if..else statements then we should use switch.

CSS Transforms offers you the possibility to scale, rotate, reposition and skew an element through CSS. We can now combine this with CSS Transitions to create a nice example that will both scale and rotate an element when hovered

This example uses "z-index:100" to place an image above the text. Try to change z-index to -1 and see the image fall behind the text.

Ordered Lists and Unordered lists can have different levels; each will be indented appropriately by your web browser. Note how the bullet marks change for different levels of the list.

Password Field <input type="password" /> defines a password field:

JavaScript event that triggers when object gets focus.

A function can take arguments whenever it is called. When arguments are passed on calling of function, the fuction is called 'function with arguments'. When a funtion does not take any argument function is called 'function without argument'. A function can return a value using the keyword 'return'.

The Frame and Iframe represents html frame and iframe respectively.This DOM object has all the properties that a HTML element has. We can change these properties using javascript.

The CSS inline-block for the display property it’s a way to make elements inline, but preserving their block capabilities such as setting width and height, top and bottom margins and paddings.

These are used to apply the properties on the elements that are either enable or disable.

Ordered lists are ones where the browser numbers each successive list item starting with "1." Note that the only difference is changing the ul tag to ol tag.

Opens a dialog window for printing the current web page.

This statement allows us to select one statement among many statements.It is also called nested if….else.

Javascript provides us the facility to break a loop in middle and also to continue the loop without executing the whole body of the loop.There are two keywords that provides these facilities: 1) break 2) continue

jQuery contains powerful methods (functions) for changing and manipulating HTML elements and attributes. Click on the button to see jQuery hiding the paragraphs.

This selects elements based on a simple provided algebraic expression (e.g. "2n" or "4n-1"). Has the ability to do things like select even/odd elements, "every third", "the first five", and things like that. CSS :odd is the same as :nth-child(odd) or :nth-child(2n+1)

This selects elements based on a simple provided algebraic expression (e.g. "2n" or "4n-1"). Has the ability to do things like select even/odd elements, "every third", "the first five", and things like that. CSS :even is the same as :nth-child(even) or :nth-child(2n)

This event is fired when the form is submitted. This is only works with the form element of the HTML.

Most of the JQuery Traversal Methods do not modify the jQuery object and they are used to filter out elements from a document based on given conditions. The filter( selector ) method can be used to filter out all elements from the set of matched elements that do not match the specified selector(s).

The vertical-align property sets the vertical alignment of an element.

jQuery also allows us the set the property value of the CSS.

Do…While loop is the varient of the while loop. The difference between while and do…while is that while loop only executes if the condition is true while do….while loop executes atleast once even the codition is false.

We are here using Core DOM setAttribute method we set the value of input type text to button.

The bdi element represents a span of text that is to be isolated from its surroundings for the purposes of bidirectional text formatting.