Category Archives: Html
Drag and drop from scratch using JavaScript
An example code to implement drag-ability in to an HTML element from scratch without using JavaScript library. JavaScript functions to provide drag-ability: function DDElement(ele, event) { addEvent(ele, “mousedown”, downHandler, true); addEvent(document, “mouseup”, upHandler, true); if (event.stopPropagation) event.stopPropagation(); else event.cancelBubble = true; if (event.preventDefault) event.preventDefault(); else event.returnValue = false; function upHandler(e) { e = e ||…
Cross browser event listener
Sometimes, we need to attach or detach an action with an element for specific event where listener function depends on browser. By using following code snippet anyone can do that in all browsers: function addEvent(obj, evType, fn, useCapture) { useCapture = (useCapture === undefined ? false : useCapture); if (obj.addEventListener) { obj.addEventListener(evType, fn, useCapture); }…
Form validation using jQuery
I have written a simple form validation script using jQuery for one of my projects though it have improvement opportunity. Anyone can use it easily by following four simple steps below: STEP 1: Add jQuery plugin to your application STEP 2: Copy following codes in to a JavaScript file and add the file after jQuery…
HTML coding guidelines
This is my third article about coding guidelines. In this article I wanted to give you some general guidelines for HTML coding that will help to improve readability, maintainability and code reuse. It will reduce browser related problem. Following are some guidelines: Must be use doctype in your web page. Everyone should be write well-formed…
Specify rendering engine of IE
Internet Explorer 8 supports different document compatibility to ensure that your web pages have a consistent appearance in future versions. If you are having trouble on a site in different IE, you can use specific rendering mode to display your web pages by using simple META tag. Below is the META tag to use IE7…
Implementation of fly-out flash message in your application
Now a days usability is one of the major issues for web application. Many web applications with good functionality did not get enough popularity because lack of usability. Flash message is one of the most important things of any application which may improve usability of an application. Here, I have explain steps for implementing fly-out…
How to print a hidden block of an HTML page?
One of my previous blog I have written “How to prevent printing a block of an HTML page?” then some of my blog readers wanted to know how he/she can print a hidden block? That’s why I have written this one. Anyone can do it by using simple css which is described below: First, Have…
Disable right click to prevent page content
Some web developers and client want to disable the right click to prevent the theft their web content specially image. It can do by using a simple line of html code below though it can bypass in many ways. <body oncontextmenu=”return false;”> Update: I have got a best reference below: No Right Click Script
How to prevent print a block of an HTML page?
Sometimes you may need to prevent printing a block of an html page. You can do it easily. Create a CSS class by following way and add it to your header section: <style type=”text/css” media = “print”>.noprint{display: none;}</style> Note that the media of the css script will be print. Now simply add the css class…
Background color or image problem of an iFrame in IE
Few days ago I have faced background image problem for iFrame in IE and search in web for the solution but i did not get any help. Then I have tried to solve it and finally I have solved this by using following two attributes background: transparent; and background-color: transparent; Below is the source HTML…