Viewers Choice

0% Reload HTML5 introduced the progress bar element, which allows us to show the progress of certain tasks, like uploads or downloads, basically anything that is in progress Basic Usage The progress bar can be added with <progress> ; the progress value is determined with the value, min and max attributes, as follows. <progress value="40" max="100"></progress> Since this is a native progress bar, the presentation is vary dependent on the platform. Below is how a native progress bar looks in Windows and OSX. Now, let's try styling this progress bar, so it has a consistent or similar look across all platform. Styling Progress Bar In the stylesheet, we actually can use the element selector to target and add style rules to <progress> element. In this example, we change the background color, remove the border line, and make it rounded by adding a border radius at half of its height. progr...

How to design a website for mobile devices (smart phones). Next web world with smart phones so start working on mobile templates. In this post I want to explain very basic HTML design tip with adding a meta tag. Normal site Contains HTML code. CSS width style fixed with pixels. width : 900px <!DOCTYPE html> <html xmlns=" http://www.w3.org/1999/xhtml "> <head> <meta http-equiv=" Content-Type " content=" text/html; charset=iso-8859-1 " /> <title> Normal Website </title> <style> #container { width: 900 px; } </style> </head> <body> <div id=" container "> </div> </body> </html> Mobie site Contains HTML code. CSS width style with percentage. width : 100% . Take a look at META tag viewport. <html> <head> <title> Mobile Website </title> <meta content=" width=device-width; initial-scale=1.0; ...

AJAX = Asynchronous JavaScript and XML AJAX is not a new programming language, but a new technique for creating better, faster, and more interactive web applications. With AJAX, a JavaScript can communicate directly with the server, with the XMLHttpRequest object. With this object, a JavaScript can trade data with a web server, without reloading the page. AJAX uses asynchronous data transfer (HTTP requests) between the browser and the web server, allowing web pages to request small bits of information from the server instead of whole pages. The AJAX technique makes Internet applications smaller, faster and more user-friendly. AJAX is based on the following web standards: JavaScript XML HTML CSS   AJAX applications are browser- and platform-independent. AJAX uses the XMLHttpRequest object With AJAX, your JavaScript communicates directly with the server, through the JavaScript XMLHttpRequest object. By using the XMLHttpRequest object, a web developer can update a pa...

jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript. .slideUp( [ duration ], [ callback ] ) The .slideUp() method animates the height of the matched elements. This causes lower parts of the page to slide up, appearing to conceal the items. Once the height reaches 0, the display style property is set to none to ensure that the element no longer affects the layout of the page. Durations are given in milliseconds; higher values indicate slower animations, not faster ones. The strings 'fast' and 'slow' can be supplied to indicate durations of 200 and 600 milliseconds, respectively. If any other string is supplied, or if the duration parameter is omitted, the default duration of 400 milliseconds is used. .slideDown( [ duration ], [ callback ] ) The .slideDown() method animates the height of the mat...