Learn Javascript Tutorials, CSS Tutorials, HTML Tutorials and jQuery Tutorials

Learn CSS, HTML, JavaScript, jQuery and Ajax step by step from beginning to advance with examples and references. Apart from that, beginners can learn tricks and tips.more>>

Monday, October 6, 2008

Swap Images by XML using XMLHTTP Request

Calling XML file into HTML Page using XMLHTTP Request or ActiveXOject
Here, we have used some features for calling xml file into html document with the help of ajax. In the example mentioned below, we called xml nodes by using
item(0).firstChild.nodeValue

Below find the javascript code as a Example, as a result it shows toggle images effects.

Javascript file Source:

<script type="text/javascript">
function make()
{
var req;

if (window.XMLHttpRequest)
{
req = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
req = new ActiveXObject("Microsoft.XMLHTTP");
}

req.open("GET", "image.xml", true);
//req.load("ajax-get.xml");


req.onreadystatechange = function()
{
if(req.readyState == 4)
{
//alert(imgsrc);

var doc = req.responseXML;
var cont=document.getElementById("data");
var imgsrc=document.getElementById("pic");
var thumb=document.getElementById("pic_s");
var clickhere=document.getElementById("alink");

//var test = doc.getElementsByTagName('thumb');
var smallpic = doc.getElementsByTagName('thumb');
var lnkxml = doc.getElementsByTagName('link');

imgsrc.src = doc.getElementsByTagName('image').item(0).firstChild.nodeValue;
imgsrc.alt = doc.getElementsByTagName('alt').item(0).firstChild.nodeValue;
thumb.src = smallpic.item(0).firstChild.nodeValue;
clickhere.href = lnkxml.item(0).firstChild.nodeValue;


var rot=document.getElementById("spn1");
rot.innerHTML= smallpic.item(0).firstChild.nodeValue;

thumb.onclick=function()
{

//if(thumb.src==smallpic.item(1).firstChild.nodeValue)
if(rot.innerHTML==smallpic.item(1).firstChild.nodeValue)
{
imgsrc.src = doc.getElementsByTagName('image').item(0).firstChild.nodeValue;
imgsrc.alt = doc.getElementsByTagName('alt').item(0).firstChild.nodeValue;
thumb.src = smallpic.item(0).firstChild.nodeValue;
clickhere.href = lnkxml.item(0).firstChild.nodeValue;

rot.innerHTML= smallpic.item(0).firstChild.nodeValue;
}
else
{
imgsrc.src = doc.getElementsByTagName('image').item(1).firstChild.nodeValue;
imgsrc.alt = doc.getElementsByTagName('alt').item(1).firstChild.nodeValue;
thumb.src = smallpic.item(1).firstChild.nodeValue;
clickhere.href = lnkxml.item(1).firstChild.nodeValue;

rot.innerHTML= smallpic.item(1).firstChild.nodeValue;
}
//alert(thumb.src);
};
}


};

/* else if(req.readyState<4)
{
shots.innerHTML="Loading...";
}*/
req.send(null);
}

</script>


XML file Source:

<?xml version="1.0"?>
<root>
<image>images/img-1.jpg</image>
<thumb>images/thumb-1.jpg</thumb>
<alt>XML</alt>
<link>http://javascript-guru.blogspot.com/search/label/ajax/</link>
<image>images/img-2.jpg</image>
<thumb>images/thumb-2.jpg</thumb>
<alt>Ajax</alt>
<link>http://javascript-guru.blogspot.com/</link>
</root>

Wednesday, September 3, 2008

Quick Tips & Tricks for Websites

Quick Tips for making Websites Sensible

1.Images & animations: Use the alt attribute to describe the function of each visual.

2.Image maps: Use the client-side map and text for hotspots.

3.Multimedia: Provide captioning and transcripts of audio, and descriptions of video.

4.Hypertext links: Use text that makes sense when read out of context. For example, avoid "click here."

5.Page organization: Use headings, lists, and consistent structure. Use CSS for layout and style where possible.

6.Graphs & charts: Summarize or use the longdesc attribute.

7.Scripts, applets, & plug-ins: Provide alternative content in case active features are inaccessible or unsupported.

8.Frames: Use the “noframes” element and meaningful titles.

9.Tables: Make line-by-line reading sensible. Summarize.

10.Check your work: Validate. Use tools, checklist, and guidelines at http://www.w3.org/TR/WCAG

Monday, September 1, 2008

Top 10 CSS image gallery tutorials

There are many tutorials out there on how to create your own image gallery. There are simple ones made from pure CSS, and there are complex ones using css and javascript. By the end of this article you will have the information necessary to start building your own photo gallery.

read more | digg story

CSS hover with JavaScript animation methods

The CSS rollover effects is commonly used in jQuery Frameworks, suppose hover animations that respond to a user's behavior in ways standards-based sites never could before.

read more | digg story

Wednesday, August 20, 2008

Introduction to Regular Expressions - RegExp( )

Regular Expressions are very useful and commonly used for creating pattern matches, pattern searches, etc. for Strings in JavaScript. There is another method called indexOf() method which works almost same like regular expressions but for advance and complex pattern searches, regular expressions are used.

For creating a regular expression as an object, we can simply write:

new RegExp("\/D\");

Regular expressions are clearly defined by example given below:


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>

<script language="JavaScript">
<!--
// created BY: rjs
function demoMatchClick()
{
var re =/[0-9]/g;
// For Numeric Value use /[0-9]/ or /\d/ and for non-numeric value use /\D/ or /[^0-9]/
// /[0-9a-zA-Z] for numeric as well as character(small/caps) for non-aplha --> use this /[^a-zA-Z]/.
// /[^a-zA-Z]/g here (g) for global search anywhere in the string even mix-up string.

// match(), search(), replace(), split()
// For Constructor -----> exec(), compile(), test()

var mat=document.demoMatch.subject.value.match(re);

if (mat)
{
alert(mat);
}
else
{
alert("No match");
}
}

</script>
</head>

<body>
<form id="demoMatch" NAME="demoMatch" METHOD="POST">
<P>Subject Number: <INPUT TYPE=TEXT NAME="subject"
VALUE="" SIZE=50></P>
<P><INPUT TYPE=SUBMIT VALUE="Test Match" ONCLICK="demoMatchClick()"></P>
</form>
</body>


Other Useful Resources:
Javascript Completed Reference - Regular Expressions
Basics of Regular Expressions

Saturday, August 9, 2008

How to Create a CSS Webpage from Scratch?

In this section, we will learn how to create a css webpage from scratch. This is the first lesson about Basics of CSS concepts using Tutorials. Hope you like it.

read more | digg story

Wednesday, August 6, 2008

Use of CSS Properties with Variables

Advanced CSS with Variables:
CSS Level 2 Recommendation effects the Web authors' community that has been requesting a way of defining variables in CSS.

Variables allow to define stylesheet-wide values identified by a token and usable in all CSS declarations.

If a value is often used in a stylesheet - a common example is the value of the color or background-color properties - it's then easy to update the whole stylesheet statically or dynamically modifying just one variable instead of modifying all style rules applying the property/value pair.

Example:


#
@variables {
#
CorporateLogoBGColor: #fe8d12;
#
}
#
#
div.logoContainer {
#
background-color: var(CorporateLogoBGColor);
#
}


The Same thing we can define in PHP also. For that thing firstly, you need to create php page for the content. Following example shows how:

Example:


<?php
header("Content-type: text/css");
$color = "green"; // <--- define the variable
echo <<<CSS
/* --- start of css --- */
h2
{
color: $color; /* <--- use the variable */
font-weight: bold;
font-size: 1.2em;
text-align: left;
}
/* --- end of css --- */
CSS;
?>


For more information regarding this, visit:
CSS Variables
How to create CSS Variables?

Tuesday, August 5, 2008

HTML, CSS, AJAX and Javascript Books

The Best e-books for HTML, CSS, Ajax and Javascript is available here. Anyone can download the given files from the torrent or can visit the site directly from where the refernce has taken.

HTML, CSS, AJAX and Javascript Books 2007

It contains the following files:

AJAX - Creating Web Pages With Asynchronous JavaScript And XML (2006).chm
AJAX And PHP - Building Responsive Web Applications (2006).pdf
Ajax Design Patterns (2006).chm
Ajax For Dummies (2006).pdf
Ajax For Web Application Developers (2006).chm
Ajax Hacks - Tips & Tools For Creating Responsive Websites (2006).chm
Ajax In Action (2006).pdf
Ajax On Rails (2006).chm
Ajax Patterns And Best Practices (2006).pdf
Beginning Ajax With ASP.NET (2006).pdf
Beginning Ajax With PHP - From Novice To Professional (2006).pdf
Beginning Google Maps Applications With PHP And Ajax - From Novice To Professional (2006).pdf
Beginning JavaScript With DOM Scripting And Ajax - From Novice To Professional (2006).pdf
Beginning XML With DOM And Ajax - From Novice To Professional (2006).pdf
CSS - The Definitive Guide, 3rd Edition (2006).chm
CSS - The Missing Manual (2006).chm
CSS Cookbook, 2nd Edition (2006).chm
CSS Hacks & Filters - Making Cascading Stylesheets Work (2005).pdf
CSS Instant Results (2006).chm
CSS Web Design for Dummies (2005).pdf
Creating Cool Web Sites With HTML, XHTML, And CSS (2004).pdf
Foundations Of Ajax (2006).pdf
Foundations Of Atlas - Rapid Ajax Development With ASP.NET 2.0 (2006).pdf
HTML & XHTML - The Definitive Guide, 6th Edition (2006).chm
HTML 4 For Dummies, 5th Edition (2005).pdf
HTML In 10 Simple Steps Or Less (2004).pdf
HTML Mastery - Semantics, Standards, And Styling (2006).pdf
HTML, XHTML, & CSS - Visual QuickStart Guide, 6th Edition (2006).chm
HTML, XHTML, & CSS Bible, 3rd Edition (2004).pdf
JavaScript & AJAX For The Web - Visual QuickStart Guide, 6th Edition (2006).chm
JavaScript Bible - Gold Edition (2001).pdf
JavaScript Bible, 5th Edition (2004).pdf
JavaScript In 10 Simple Steps Or Less (2004).pdf
JavaScript Phrasebook - Essential Code And Commands (2006).chm
JavaScript Programmer's Reference (2001).pdf
Learning JavaScript (2006).chm


Download Tutorial Books

8 Amazing Websites by Rafaël Rozendaal's

Usability and Accessibility means single serving sites with explosion, and it shows in his work's standout beauty and interactivity. His homepage documents years of acclaimed work, but in case you're unfamiliar (or just looking for a simplistic internet retreat), here are a few of our favorites to get you started.

read more | digg story

Sunday, August 3, 2008

Basics of DTD (Document Type Definition)

In this section, we have explained about the DTD XML file. Basically, DTD XML file uses for various applications like HTML, XHTML, WML (wireless markup language) and DOM. Below is the example of DTD file written in XML format for XHTML Transitional DTD for Web.

DTD XHTML Transitional Code:


<!--
Extensible HTML version 1.0 Transitional DTD



This is the same as HTML 4 Transitional except for
changes due to the differences between XML and SGML.



Namespace = http://www.w3.org/1999/xhtml



For further information, see: http://www.w3.org/TR/xhtml1



Copyright (c) 1998-2002 W3C (MIT, INRIA, Keio),
All Rights Reserved.



This DTD module is identified by the PUBLIC and SYSTEM identifiers:



PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
SYSTEM "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"



$Revision: 1.2 $
$Date: 2002/08/01 18:37:55 $



-->



<!--================ Character mnemonic entities =========================-->



<!ENTITY % HTMLlat1 PUBLIC
"-//W3C//ENTITIES Latin 1 for XHTML//EN"
"xhtml-lat1.ent">
%HTMLlat1;



<!ENTITY % HTMLsymbol PUBLIC
"-//W3C//ENTITIES Symbols for XHTML//EN"
"xhtml-symbol.ent">
%HTMLsymbol;



<!ENTITY % HTMLspecial PUBLIC
"-//W3C//ENTITIES Special for XHTML//EN"
"xhtml-special.ent">
%HTMLspecial;



<!--================== Imported Names ====================================-->



<!ENTITY % ContentType "CDATA">
<!-- media type, as per [RFC2045] -->



<!ENTITY % ContentTypes "CDATA">
<!-- comma-separated list of media types, as per [RFC2045] -->



<!ENTITY % Charset "CDATA">
<!-- a character encoding, as per [RFC2045] -->



<!ENTITY % Charsets "CDATA">
<!-- a space separated list of character encodings, as per [RFC2045] -->



<!ENTITY % LanguageCode "NMTOKEN">
<!-- a language code, as per [RFC3066] -->



<!ENTITY % Character "CDATA">
<!-- a single character, as per section 2.2 of [XML] -->



<!ENTITY % Number "CDATA">
<!-- one or more digits -->



<!ENTITY % LinkTypes "CDATA">
<!-- space-separated list of link types -->



<!ENTITY % MediaDesc "CDATA">
<!-- single or comma-separated list of media descriptors -->



<!ENTITY % URI "CDATA">
<!-- a Uniform Resource Identifier, see [RFC2396] -->



<!ENTITY % UriList "CDATA">
<!-- a space separated list of Uniform Resource Identifiers -->



<!ENTITY % Datetime "CDATA">
<!-- date and time information. ISO date format -->



<!ENTITY % Script "CDATA">
<!-- script expression -->



<!ENTITY % StyleSheet "CDATA">
<!-- style sheet data -->



<!ENTITY % Text "CDATA">
<!-- used for titles etc. -->



<!ENTITY % FrameTarget "NMTOKEN">
<!-- render in this frame -->



<!ENTITY % Length "CDATA">
<!-- nn for pixels or nn% for percentage length -->



<!ENTITY % MultiLength "CDATA">
<!-- pixel, percentage, or relative -->



<!ENTITY % Pixels "CDATA">
<!-- integer representing length in pixels -->



<!-- these are used for image maps -->



<!ENTITY % Shape "(rect|circle|poly|default)">



<!ENTITY % Coords "CDATA">
<!-- comma separated list of lengths -->



<!-- used for object, applet, img, input and iframe -->
<!ENTITY % ImgAlign "(top|middle|bottom|left|right)">



<!-- a color using sRGB: #RRGGBB as Hex values -->
<!ENTITY % Color "CDATA">



<!-- There are also 16 widely known color names with their sRGB values:



Black = #000000 Green = #008000
Silver = #C0C0C0 Lime = #00FF00
Gray = #808080 Olive = #808000
White = #FFFFFF Yellow = #FFFF00
Maroon = #800000 Navy = #000080
Red = #FF0000 Blue = #0000FF
Purple = #800080 Teal = #008080
Fuchsia= #FF00FF Aqua = #00FFFF
-->



<!--=================== Generic Attributes ===============================-->



<!-- core attributes common to most elements
id document-wide unique id
class space separated list of classes
style associated style info
title advisory title/amplification
-->

<!ENTITY % coreattrs
"id ID #IMPLIED
class CDATA #IMPLIED
style %StyleSheet; #IMPLIED
title %Text; #IMPLIED"
>



<!-- internationalization attributes
lang language code (backwards compatible)
xml:lang language code (as per XML 1.0 spec)
dir direction for weak/neutral text
-->

<!ENTITY % i18n
"lang %LanguageCode; #IMPLIED
xml:lang %LanguageCode; #IMPLIED
dir (ltr|rtl) #IMPLIED"
>



<!-- attributes for common UI events
onclick a pointer button was clicked
ondblclick a pointer button was double clicked
onmousedown a pointer button was pressed down
onmouseup a pointer button was released
onmousemove a pointer was moved onto the element
onmouseout a pointer was moved away from the element
onkeypress a key was pressed and released
onkeydown a key was pressed down
onkeyup a key was released
-->

<!ENTITY % events
"onclick %Script; #IMPLIED
ondblclick %Script; #IMPLIED
onmousedown %Script; #IMPLIED
onmouseup %Script; #IMPLIED
onmouseover %Script; #IMPLIED
onmousemove %Script; #IMPLIED
onmouseout %Script; #IMPLIED
onkeypress %Script; #IMPLIED
onkeydown %Script; #IMPLIED
onkeyup %Script; #IMPLIED"
>



<!-- attributes for elements that can get the focus
accesskey accessibility key character
tabindex position in tabbing order
onfocus the element got the focus
onblur the element lost the focus
-->

<!ENTITY % focus
"accesskey %Character; #IMPLIED
tabindex %Number; #IMPLIED
onfocus %Script; #IMPLIED
onblur %Script; #IMPLIED"
>



<!ENTITY % attrs "%coreattrs; %i18n; %events;">



<!-- text alignment for p, div, h1-h6. The default is
align="left" for ltr headings, "right" for rtl -->



<!ENTITY % TextAlign "align (left|center|right|justify) #IMPLIED">



<!--=================== Text Elements ====================================-->



<!ENTITY % special.extra
"object | applet | img | map | iframe">



<!ENTITY % special.basic
"br | span | bdo">



<!ENTITY % special
"%special.basic; | %special.extra;">



<!ENTITY % fontstyle.extra "big | small | font | basefont">



<!ENTITY % fontstyle.basic "tt | i | b | u | s | strike ">



<!ENTITY % fontstyle "%fontstyle.basic; | %fontstyle.extra;">



<!ENTITY % phrase.extra "sub | sup">
<!ENTITY % phrase.basic "em | strong | dfn | code | q |
samp | kbd | var | cite | abbr | acronym">



<!ENTITY % phrase "%phrase.basic; | %phrase.extra;">



<!ENTITY % inline.forms "input | select | textarea | label | button">



<!-- these can occur at block or inline level -->
<!ENTITY % misc.inline "ins | del | script">



<!-- these can only occur at block level -->
<!ENTITY % misc "noscript | %misc.inline;">



<!ENTITY % inline "a | %special; | %fontstyle; | %phrase; | %inline.forms;">



<!-- %Inline; covers inline or "text-level" elements -->
<!ENTITY % Inline "(#PCDATA | %inline; | %misc.inline;)*">



<!--================== Block level elements ==============================-->



<!ENTITY % heading "h1|h2|h3|h4|h5|h6">
<!ENTITY % lists "ul | ol | dl | menu | dir">
<!ENTITY % blocktext "pre | hr | blockquote | address | center | noframes">



<!ENTITY % block
"p | %heading; | div | %lists; | %blocktext; | isindex |fieldset | table">



<!-- %Flow; mixes block and inline and is used for list items etc. -->
<!ENTITY % Flow "(#PCDATA | %block; | form | %inline; | %misc;)*">



<!--================== Content models for exclusions =====================-->



<!-- a elements use %Inline; excluding a -->



<!ENTITY % a.content
"(#PCDATA | %special; | %fontstyle; | %phrase; | %inline.forms; | %misc.inline;)*">



<!-- pre uses %Inline excluding img, object, applet, big, small,
font, or basefont -->



<!ENTITY % pre.content
"(#PCDATA | a | %special.basic; | %fontstyle.basic; | %phrase.basic; |
%inline.forms; | %misc.inline;)*">



<!-- form uses %Flow; excluding form -->


<!ENTITY % form.content "(#PCDATA | %block; | %inline; | %misc;)*">



<!-- button uses %Flow; but excludes a, form, form controls, iframe -->



<!ENTITY % button.content
"(#PCDATA | p | %heading; | div | %lists; | %blocktext; |
table | br | span | bdo | object | applet | img | map |
%fontstyle; | %phrase; | %misc;)*">



<!--================ Document Structure ==================================-->



<!-- the namespace URI designates the document profile -->



<!ELEMENT html (head, body)>
<!ATTLIST html
%i18n;
id ID #IMPLIED
xmlns %URI; #FIXED 'http://www.w3.org/1999/xhtml'
>



<!--================ Document Head =======================================-->



<!ENTITY % head.misc "(script|style|meta|link|object|isindex)*">



<!-- content model is %head.misc; combined with a single
title and an optional base element in any order -->



<!ELEMENT head (%head.misc;,
((title, %head.misc;, (base, %head.misc;)?) |
(base, %head.misc;, (title, %head.misc;))))>



<!ATTLIST head
%i18n;
id ID #IMPLIED
profile %URI; #IMPLIED
>



<!-- The title element is not considered part of the flow of text.
It should be displayed, for example as the page header or
window title. Exactly one title is required per document.
-->


<!ELEMENT title (#PCDATA)>
<!ATTLIST title
%i18n;
id ID #IMPLIED
>



<!-- document base URI -->



<!ELEMENT base EMPTY>
<!ATTLIST base
id ID #IMPLIED
href %URI; #IMPLIED
target %FrameTarget; #IMPLIED
>



<!-- generic metainformation -->
<!ELEMENT meta EMPTY>
<!ATTLIST meta
%i18n;
id ID #IMPLIED
http-equiv CDATA #IMPLIED
name CDATA #IMPLIED
content CDATA #REQUIRED
scheme CDATA #IMPLIED
>



<!--
Relationship values can be used in principle:

a) for document specific toolbars/menus when used
with the link element in document head e.g.
start, contents, previous, next, index, end, help
b) to link to a separate style sheet (rel="stylesheet")
c) to make a link to a script (rel="script")
d) by stylesheets to control how collections of
html nodes are rendered into printed documents
e) to make a link to a printable version of this document
e.g. a PostScript or PDF version (rel="alternate" media="print")
-->



<!ELEMENT link EMPTY>
<!ATTLIST link
%attrs;
charset %Charset; #IMPLIED
href %URI; #IMPLIED
hreflang %LanguageCode; #IMPLIED
type %ContentType; #IMPLIED
rel %LinkTypes; #IMPLIED
rev %LinkTypes; #IMPLIED
media %MediaDesc; #IMPLIED
target %FrameTarget; #IMPLIED
>



<!-- style info, which may include CDATA sections -->
<!ELEMENT style (#PCDATA)>
<!ATTLIST style
%i18n;
id ID #IMPLIED
type %ContentType; #REQUIRED
media %MediaDesc; #IMPLIED
title %Text; #IMPLIED
xml:space (preserve) #FIXED 'preserve'
>



<!-- script statements, which may include CDATA sections -->
<!ELEMENT script (#PCDATA)>
<!ATTLIST script
id ID #IMPLIED
charset %Charset; #IMPLIED
type %ContentType; #REQUIRED
language CDATA #IMPLIED
src %URI; #IMPLIED
defer (defer) #IMPLIED
xml:space (preserve) #FIXED 'preserve'
>



<!-- alternate content container for non script-based rendering -->

<!ELEMENT noscript %Flow;>
<!ATTLIST noscript
%attrs;
>



<!--======================= Frames =======================================-->



<!-- inline subwindow -->



<!ELEMENT iframe %Flow;>
<!ATTLIST iframe
%coreattrs;
longdesc %URI; #IMPLIED
name NMTOKEN #IMPLIED
src %URI; #IMPLIED
frameborder (1|0) "1"
marginwidth %Pixels; #IMPLIED
marginheight %Pixels; #IMPLIED
scrolling (yes|no|auto) "auto"
align %ImgAlign; #IMPLIED
height %Length; #IMPLIED
width %Length; #IMPLIED
>



<!-- alternate content container for non frame-based rendering -->



<!ELEMENT noframes %Flow;>
<!ATTLIST noframes
%attrs;
>



<!--=================== Document Body ====================================-->



<!ELEMENT body %Flow;>
<!ATTLIST body
%attrs;
onload %Script; #IMPLIED
onunload %Script; #IMPLIED
background %URI; #IMPLIED
bgcolor %Color; #IMPLIED
text %Color; #IMPLIED
link %Color; #IMPLIED
vlink %Color; #IMPLIED
alink %Color; #IMPLIED
>



<!ELEMENT div %Flow;> <!-- generic language/style container -->
<!ATTLIST div
%attrs;
%TextAlign;
>



<!--=================== Paragraphs =======================================-->



<!ELEMENT p %Inline;>
<!ATTLIST p
%attrs;
%TextAlign;
>



<!--=================== Headings =========================================-->



<!--
There are six levels of headings from h1 (the most important)
to h6 (the least important).
-->



<!ELEMENT h1 %Inline;>
<!ATTLIST h1
%attrs;
%TextAlign;
>



<!ELEMENT h2 %Inline;>
<!ATTLIST h2
%attrs;
%TextAlign;
>



<!ELEMENT h3 %Inline;>
<!ATTLIST h3
%attrs;
%TextAlign;
>



<!ELEMENT h4 %Inline;>
<!ATTLIST h4
%attrs;
%TextAlign;
>



<!ELEMENT h5 %Inline;>
<!ATTLIST h5
%attrs;
%TextAlign;
>



<!ELEMENT h6 %Inline;>
<!ATTLIST h6
%attrs;
%TextAlign;
>



<!--=================== Lists ============================================-->



<!-- Unordered list bullet styles -->



<!ENTITY % ULStyle "(disc|square|circle)">



<!-- Unordered list -->



<!ELEMENT ul (li)+>
<!ATTLIST ul
%attrs;
type %ULStyle; #IMPLIED
compact (compact) #IMPLIED
>



<!-- Ordered list numbering style



1 arabic numbers 1, 2, 3, ...
a lower alpha a, b, c, ...
A upper alpha A, B, C, ...
i lower roman i, ii, iii, ...
I upper roman I, II, III, ...



The style is applied to the sequence number which by default
is reset to 1 for the first list item in an ordered list.
-->


<!ENTITY % OLStyle "CDATA">



<!-- Ordered (numbered) list -->



<!ELEMENT ol (li)+>
<!ATTLIST ol
%attrs;
type %OLStyle; #IMPLIED
compact (compact) #IMPLIED
start %Number; #IMPLIED
>



<!-- single column list (DEPRECATED) -->
<!ELEMENT menu (li)+>
<!ATTLIST menu
%attrs;
compact (compact) #IMPLIED
>



<!-- multiple column list (DEPRECATED) -->
<!ELEMENT dir (li)+>
<!ATTLIST dir
%attrs;
compact (compact) #IMPLIED
>



<!-- LIStyle is constrained to: "(%ULStyle;|%OLStyle;)" -->
<!ENTITY % LIStyle "CDATA">



<!-- list item -->



<!ELEMENT li %Flow;>
<!ATTLIST li
%attrs;
type %LIStyle; #IMPLIED
value %Number; #IMPLIED
>



<!-- definition lists - dt for term, dd for its definition -->



<!ELEMENT dl (dt|dd)+>
<!ATTLIST dl
%attrs;
compact (compact) #IMPLIED
>



<!ELEMENT dt %Inline;>
<!ATTLIST dt
%attrs;
>



<!ELEMENT dd %Flow;>
<!ATTLIST dd
%attrs;
>



<!--=================== Address ==========================================-->



<!-- information on author -->



<!ELEMENT address (#PCDATA | %inline; | %misc.inline; | p)*>
<!ATTLIST address
%attrs;
>



<!--=================== Horizontal Rule ==================================-->



<!ELEMENT hr EMPTY>
<!ATTLIST hr
%attrs;
align (left|center|right) #IMPLIED
noshade (noshade) #IMPLIED
size %Pixels; #IMPLIED
width %Length; #IMPLIED
>



<!--=================== Preformatted Text ================================-->



<!-- content is %Inline; excluding
"img|object|applet|big|small|sub|sup|font|basefont" -->



<!ELEMENT pre %pre.content;>
<!ATTLIST pre
%attrs;
width %Number; #IMPLIED
xml:space (preserve) #FIXED 'preserve'
>



<!--=================== Block-like Quotes ================================-->



<!ELEMENT blockquote %Flow;>
<!ATTLIST blockquote
%attrs;
cite %URI; #IMPLIED
>



<!--=================== Text alignment ===================================-->



<!-- center content -->
<!ELEMENT center %Flow;>
<!ATTLIST center
%attrs;
>



<!--=================== Inserted/Deleted Text ============================-->



<!--
ins/del are allowed in block and inline content, but its
inappropriate to include block content within an ins element
occurring in inline content.
-->


<!ELEMENT ins %Flow;>
<!ATTLIST ins
%attrs;
cite %URI; #IMPLIED
datetime %Datetime; #IMPLIED
>



<!ELEMENT del %Flow;>
<!ATTLIST del
%attrs;
cite %URI; #IMPLIED
datetime %Datetime; #IMPLIED
>



<!--================== The Anchor Element ================================-->



<!-- content is %Inline; except that anchors shouldn't be nested -->



<!ELEMENT a %a.content;>
<!ATTLIST a
%attrs;
%focus;
charset %Charset; #IMPLIED
type %ContentType; #IMPLIED
name NMTOKEN #IMPLIED
href %URI; #IMPLIED
hreflang %LanguageCode; #IMPLIED
rel %LinkTypes; #IMPLIED
rev %LinkTypes; #IMPLIED
shape %Shape; "rect"
coords %Coords; #IMPLIED
target %FrameTarget; #IMPLIED
>



<!--===================== Inline Elements ================================-->



<!ELEMENT span %Inline;> <!-- generic language/style container -->
<!ATTLIST span
%attrs;
>



<!ELEMENT bdo %Inline;> <!-- I18N BiDi over-ride -->
<!ATTLIST bdo
%coreattrs;
%events;
lang %LanguageCode; #IMPLIED
xml:lang %LanguageCode; #IMPLIED
dir (ltr|rtl) #REQUIRED
>



<!ELEMENT br EMPTY> <!-- forced line break -->
<!ATTLIST br
%coreattrs;
clear (left|all|right|none) "none"
>



<!ELEMENT em %Inline;> <!-- emphasis -->
<!ATTLIST em %attrs;>



<!ELEMENT strong %Inline;> <!-- strong emphasis -->
<!ATTLIST strong %attrs;>



<!ELEMENT dfn %Inline;> <!-- definitional -->
<!ATTLIST dfn %attrs;>



<!ELEMENT code %Inline;> <!-- program code -->
<!ATTLIST code %attrs;>



<!ELEMENT samp %Inline;> <!-- sample -->
<!ATTLIST samp %attrs;>



<!ELEMENT kbd %Inline;> <!-- something user would type -->
<!ATTLIST kbd %attrs;>



<!ELEMENT var %Inline;> <!-- variable -->
<!ATTLIST var %attrs;>



<!ELEMENT cite %Inline;> <!-- citation -->
<!ATTLIST cite %attrs;>



<!ELEMENT abbr %Inline;> <!-- abbreviation -->
<!ATTLIST abbr %attrs;>



<!ELEMENT acronym %Inline;> <!-- acronym -->
<!ATTLIST acronym %attrs;>



<!ELEMENT q %Inline;> <!-- inlined quote -->
<!ATTLIST q
%attrs;
cite %URI; #IMPLIED
>



<!ELEMENT sub %Inline;> <!-- subscript -->
<!ATTLIST sub %attrs;>



<!ELEMENT sup %Inline;> <!-- superscript -->
<!ATTLIST sup %attrs;>



<!ELEMENT tt %Inline;> <!-- fixed pitch font -->
<!ATTLIST tt %attrs;>



<!ELEMENT i %Inline;> <!-- italic font -->
<!ATTLIST i %attrs;>



<!ELEMENT b %Inline;> <!-- bold font -->
<!ATTLIST b %attrs;>



<!ELEMENT big %Inline;> <!-- bigger font -->
<!ATTLIST big %attrs;>



<!ELEMENT small %Inline;> <!-- smaller font -->
<!ATTLIST small %attrs;>



<!ELEMENT u %Inline;> <!-- underline -->
<!ATTLIST u %attrs;>



<!ELEMENT s %Inline;> <!-- strike-through -->
<!ATTLIST s %attrs;>



<!ELEMENT strike %Inline;> <!-- strike-through -->
<!ATTLIST strike %attrs;>



<!ELEMENT basefont EMPTY> <!-- base font size -->
<!ATTLIST basefont
id ID #IMPLIED
size CDATA #REQUIRED
color %Color; #IMPLIED
face CDATA #IMPLIED
>



<!ELEMENT font %Inline;> <!-- local change to font -->
<!ATTLIST font
%coreattrs;
%i18n;
size CDATA #IMPLIED
color %Color; #IMPLIED
face CDATA #IMPLIED
>



<!--==================== Object ======================================-->
<!--
object is used to embed objects as part of HTML pages.
param elements should precede other content. Parameters
can also be expressed as attribute/value pairs on the
object element itself when brevity is desired.
-->



<!ELEMENT object (#PCDATA | param | %block; | form | %inline; | %misc;)*>
<!ATTLIST object
%attrs;
declare (declare) #IMPLIED
classid %URI; #IMPLIED
codebase %URI; #IMPLIED
data %URI; #IMPLIED
type %ContentType; #IMPLIED
codetype %ContentType; #IMPLIED
archive %UriList; #IMPLIED
standby %Text; #IMPLIED
height %Length; #IMPLIED
width %Length; #IMPLIED
usemap %URI; #IMPLIED
name NMTOKEN #IMPLIED
tabindex %Number; #IMPLIED
align %ImgAlign; #IMPLIED
border %Pixels; #IMPLIED
hspace %Pixels; #IMPLIED
vspace %Pixels; #IMPLIED
>



<!--
param is used to supply a named property value.
In XML it would seem natural to follow RDF and support an
abbreviated syntax where the param elements are replaced
by attribute value pairs on the object start tag.
-->
<!ELEMENT param EMPTY>
<!ATTLIST param
id ID #IMPLIED
name CDATA #REQUIRED
value CDATA #IMPLIED
valuetype (data|ref|object) "data"
type %ContentType; #IMPLIED
>



<!--=================== Java applet ==================================-->
<!--
One of code or object attributes must be present.
Place param elements before other content.
-->
<!ELEMENT applet (#PCDATA | param | %block; | form | %inline; | %misc;)*>
<!ATTLIST applet
%coreattrs;
codebase %URI; #IMPLIED
archive CDATA #IMPLIED
code CDATA #IMPLIED
object CDATA #IMPLIED
alt %Text; #IMPLIED
name NMTOKEN #IMPLIED
width %Length; #REQUIRED
height %Length; #REQUIRED
align %ImgAlign; #IMPLIED
hspace %Pixels; #IMPLIED
vspace %Pixels; #IMPLIED
>



<!--=================== Images ===========================================-->



<!--
To avoid accessibility problems for people who aren't
able to see the image, you should provide a text
description using the alt and longdesc attributes.
In addition, avoid the use of server-side image maps.
-->



<!ELEMENT img EMPTY>
<!ATTLIST img
%attrs;
src %URI; #REQUIRED
alt %Text; #REQUIRED
name NMTOKEN #IMPLIED
longdesc %URI; #IMPLIED
height %Length; #IMPLIED
width %Length; #IMPLIED
usemap %URI; #IMPLIED
ismap (ismap) #IMPLIED
align %ImgAlign; #IMPLIED
border %Length; #IMPLIED
hspace %Pixels; #IMPLIED
vspace %Pixels; #IMPLIED
>



<!-- usemap points to a map element which may be in this document
or an external document, although the latter is not widely supported -->



<!--================== Client-side image maps ============================-->



<!-- These can be placed in the same document or grouped in a
separate document although this isn't yet widely supported -->



<!ELEMENT map ((%block; | form | %misc;)+ | area+)>
<!ATTLIST map


%i18n;
%events;
id ID #REQUIRED
class CDATA #IMPLIED
style %StyleSheet; #IMPLIED
title %Text; #IMPLIED
name CDATA #IMPLIED
>



<!ELEMENT area EMPTY>


<!ATTLIST area


%attrs;
%focus;
shape %Shape; "rect"
coords %Coords; #IMPLIED
href %URI; #IMPLIED
nohref (nohref) #IMPLIED
alt %Text; #REQUIRED
target %FrameTarget; #IMPLIED
>



<!--================ Forms ===============================================-->



<!ELEMENT form %form.content;> <!-- forms shouldn't be nested -->



<!ATTLIST form
%attrs;
action %URI; #REQUIRED
method (get|post) "get"
name NMTOKEN #IMPLIED
enctype %ContentType; "application/x-www-form-urlencoded"
onsubmit %Script; #IMPLIED
onreset %Script; #IMPLIED
accept %ContentTypes; #IMPLIED
accept-charset %Charsets; #IMPLIED
target %FrameTarget; #IMPLIED
>



<!--
Each label must not contain more than ONE field
Label elements shouldn't be nested.
-->


<!ELEMENT label %Inline;>


<!ATTLIST label
%attrs;
for IDREF #IMPLIED
accesskey %Character; #IMPLIED
onfocus %Script; #IMPLIED
onblur %Script; #IMPLIED
>



<!ENTITY % InputType
"(text | password | checkbox |
radio | submit | reset |
file | hidden | image | button)"
>



<!-- the name attribute is required for all but submit & reset -->



<!ELEMENT input EMPTY>

<!-- form control -->
<!ATTLIST input


%attrs;
%focus;
type %InputType; "text"
name CDATA #IMPLIED
value CDATA #IMPLIED
checked (checked) #IMPLIED
disabled (disabled) #IMPLIED
readonly (readonly) #IMPLIED
size CDATA #IMPLIED
maxlength %Number; #IMPLIED
src %URI; #IMPLIED
alt CDATA #IMPLIED
usemap %URI; #IMPLIED
onselect %Script; #IMPLIED
onchange %Script; #IMPLIED
accept %ContentTypes; #IMPLIED
align %ImgAlign; #IMPLIED
>



<!ELEMENT select (optgroup|option)+> <!-- option selector -->
<!ATTLIST select
%attrs;
name CDATA #IMPLIED
size %Number; #IMPLIED
multiple (multiple) #IMPLIED
disabled (disabled) #IMPLIED
tabindex %Number; #IMPLIED
onfocus %Script; #IMPLIED
onblur %Script; #IMPLIED
onchange %Script; #IMPLIED
>



<!ELEMENT optgroup (option)+> <!-- option group -->
<!ATTLIST optgroup
%attrs;
disabled (disabled) #IMPLIED
label %Text; #REQUIRED
>



<!ELEMENT option (#PCDATA)> <!-- selectable choice -->
<!ATTLIST option


%attrs;
selected (selected) #IMPLIED
disabled (disabled) #IMPLIED
label %Text; #IMPLIED
value CDATA #IMPLIED
>



<!ELEMENT textarea (#PCDATA)> <!-- multi-line text field -->
<!ATTLIST textarea
%attrs;
%focus;
name CDATA #IMPLIED
rows %Number; #REQUIRED
cols %Number; #REQUIRED
disabled (disabled) #IMPLIED
readonly (readonly) #IMPLIED
onselect %Script; #IMPLIED
onchange %Script; #IMPLIED
>



<!--


The fieldset element is used to group form fields.
Only one legend element should occur in the content
and if present should only be preceded by whitespace.
-->


<!ELEMENT fieldset (#PCDATA | legend | %block; | form | %inline; | %misc;)*>
<!ATTLIST fieldset
%attrs;
>



<!ENTITY % LAlign "(top|bottom|left|right)">



<!ELEMENT legend %Inline;> <!-- fieldset label -->
<!ATTLIST legend
%attrs;
accesskey %Character; #IMPLIED
align %LAlign; #IMPLIED
>



<!--


Content is %Flow; excluding a, form, form controls, iframe
-->
<!ELEMENT button %button.content;> <!-- push button -->
<!ATTLIST button
%attrs;
%focus;
name CDATA #IMPLIED
value CDATA #IMPLIED
type (button|submit|reset) "submit"
disabled (disabled) #IMPLIED
>



<!-- single-line text input control (DEPRECATED) -->
<!ELEMENT isindex EMPTY>
<!ATTLIST isindex
%coreattrs;
%i18n;
prompt %Text; #IMPLIED
>



<!--======================= Tables =======================================-->



<!-- Derived from IETF HTML table standard, see [RFC1942] -->



<!--
The border attribute sets the thickness of the frame around the
table. The default units are screen pixels.



The frame attribute specifies which parts of the frame around
the table should be rendered. The values are not the same as
CALS to avoid a name clash with the valign attribute.
-->


<!ENTITY % TFrame "(void|above|below|hsides|lhs|rhs|vsides|box|border)">



<!--


The rules attribute defines which rules to draw between cells:



If rules is absent then assume:
"none" if border is absent or border="0" otherwise "all"
-->



<!ENTITY % TRules "(none | groups | rows | cols | all)">



<!-- horizontal placement of table relative to document -->
<!ENTITY % TAlign "(left|center|right)">



<!-- horizontal alignment attributes for cell contents



char alignment char, e.g. char=':'
charoff offset for alignment char


-->


<!ENTITY % cellhalign
"align (left|center|right|justify|char) #IMPLIED
char %Character; #IMPLIED
charoff %Length; #IMPLIED"
>



<!-- vertical alignment attributes for cell contents -->
<!ENTITY % cellvalign
"valign (top|middle|bottom|baseline) #IMPLIED"
>



<!ELEMENT table


(caption?, (col*|colgroup*), thead?, tfoot?, (tbody+|tr+))>
<!ELEMENT caption %Inline;>
<!ELEMENT thead (tr)+>
<!ELEMENT tfoot (tr)+>
<!ELEMENT tbody (tr)+>
<!ELEMENT colgroup (col)*>
<!ELEMENT col EMPTY>
<!ELEMENT tr (th|td)+>
<!ELEMENT th %Flow;>
<!ELEMENT td %Flow;>



<!ATTLIST table


%attrs;
summary %Text; #IMPLIED
width %Length; #IMPLIED
border %Pixels; #IMPLIED
frame %TFrame; #IMPLIED
rules %TRules; #IMPLIED
cellspacing %Length; #IMPLIED
cellpadding %Length; #IMPLIED
align %TAlign; #IMPLIED
bgcolor %Color; #IMPLIED
>



<!ENTITY % CAlign "(top|bottom|left|right)">



<!ATTLIST caption
%attrs;
align %CAlign; #IMPLIED
>



<!--


colgroup groups a set of col elements. It allows you to group
several semantically related columns together.
-->


<!ATTLIST colgroup
%attrs;
span %Number; "1"
width %MultiLength; #IMPLIED
%cellhalign;
%cellvalign;
>



<!--


col elements define the alignment properties for cells in
one or more columns.



The width attribute specifies the width of the columns, e.g.



width=64 width in screen pixels
width=0.5* relative width of 0.5



The span attribute causes the attributes of one
col element to apply to more than one column.
-->
<!ATTLIST col
%attrs;
span %Number; "1"
width %MultiLength; #IMPLIED
%cellhalign;
%cellvalign;
>



<!--
Use thead to duplicate headers when breaking table
across page boundaries, or for static headers when
tbody sections are rendered in scrolling panel.



Use tfoot to duplicate footers when breaking table
across page boundaries, or for static footers when
tbody sections are rendered in scrolling panel.



Use multiple tbody sections when rules are needed
between groups of table rows.
-->
<!ATTLIST thead
%attrs;
%cellhalign;
%cellvalign;
>



<!ATTLIST tfoot
%attrs;
%cellhalign;
%cellvalign;
>



<!ATTLIST tbody
%attrs;
%cellhalign;
%cellvalign;
>



<!ATTLIST tr
%attrs;
%cellhalign;
%cellvalign;
bgcolor %Color; #IMPLIED
>



<!-- Scope is simpler than headers attribute for common tables -->
<!ENTITY % Scope "(row|col|rowgroup|colgroup)">



<!-- th is for headers, td for data and for cells acting as both -->



<!ATTLIST th
%attrs;
abbr %Text; #IMPLIED
axis CDATA #IMPLIED
headers IDREFS #IMPLIED
scope %Scope; #IMPLIED
rowspan %Number; "1"
colspan %Number; "1"
%cellhalign;
%cellvalign;
nowrap (nowrap) #IMPLIED
bgcolor %Color; #IMPLIED
width %Length; #IMPLIED
height %Length; #IMPLIED
>



<!ATTLIST td


%attrs;
abbr %Text; #IMPLIED
axis CDATA #IMPLIED
headers IDREFS #IMPLIED
scope %Scope; #IMPLIED
rowspan %Number; "1"
colspan %Number; "1"
%cellhalign;
%cellvalign;
nowrap (nowrap) #IMPLIED
bgcolor %Color; #IMPLIED
width %Length; #IMPLIED
height %Length; #IMPLIED
>


Generally, we use
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
for creating a transitional page dtd for validation, but if you want to use your custom transitional DTD then you can use

<!DOCTYPE html SYSTEM ...>
, SYSTEM is used to create you own dtd with customized format using XML. It is not accessible by other users.

For more details, you can directly visit the sites:

Basics of DTD
Introduction of DTD's

Friday, July 11, 2008

Object-Oriented JavaScript: Using the `Prototype` Property

# Object-Oriented JavaScript: Using the `Prototype` Property# Prototyping objects: looking at the “prototype” property# Object interaction in JavaScript: applying Inheritance through the “prototype” property# Traversing object properties: using the “for in” loop structure

read more | digg story

Thursday, July 10, 2008

Drag Div with Cursor using JavaScript

Event Handling
For this context, we generally use window.event method for creating drag functionality with the help of javascript.

First of all, we need take the position of mouse or cursor within the document with the help of clientX for X position of mouse, clientY for Y position of the cursor.

Example:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Drag Div</title>
<script language="JavaScript" type="text/javascript">

function abc()
{
<!--
var IE = document.all;

var tempX = 0;
var tempY = 0;

var element=document.getElementById("x");

//element.onclick=see();

document.onmousemove=function getMouseXY(abc) {
if (IE) { // grab the x-y pos.s if browser is IE
tempX = event.clientX;
tempY = event.clientY;
} else { // grab the x-y pos.s if browser is NS
tempX = abc.pageX;
tempY = abc.pageY;
}
// catch possible negative values in NS4
// if (tempX < 0){tempX = 0}
// if (tempY < 0){tempY = 0}
// in the text fields named MouseX and MouseY
//document.Show.MouseX.value = tempX;
//document.Show.MouseY.value = tempY;

element.style.marginLeft = tempX + "px";
element.style.marginTop = tempY + "px";
}

}
//-->
</script>

</head>

<body onload="abc();">
<div id="x" style="background:#FFCC33; padding:10px; width:150px;">This is Testing!!</div>
</body>
</html>

See other useful Events

Tuesday, July 8, 2008

Complete Tutorial Reference:- HTML, CSS & JavaScript

This is the place, where u can find the good JavaScript Tutorials ever. It includes DOM, Advanced JavaScript, HTML Reference Tutorial (for Beginner, Intermediate and Advanced Learners), Css Advanced Reference Tutorials for Web, Javascript Quick Tutorial with Examples and AJAX.

read more | digg story

Monday, July 7, 2008

Ajax : Basic to Advance

Ajax stands for Asynchronous JavaScript and XML, it is a method of creating/developing interactive web based applications so that user requests immediately. Ajax includes major web tools like JavaScript, Document Object Model (DOM), Dynamic HTML (DHTML), Extensible Markup Language (XML), XSLT, Cascading Style Sheets (CSS), HTML (Hype-Text Markup Language), ActiveXObjects and XMLHttpRequest.

In short, AJAX is a method for retriving dynamic data very Easily with lots of data.

The Major role of Ajax is to handle responseText and responseXML parsing.

The responseXML method is very handy to use, for this context developer has to create the XML for that further it requires data parsing. The first thing developer will have to do is target the root node of the XML response:

" var client = data.get.responseXML.documentElement; "

For more help, simply you can visit the site: www.w3schools.com/ajax/default.asp

Friday, July 4, 2008

25 Excellent Ajax Techniques and Examples

If you’re interested in expanding your understanding of Ajax techniques and practices, check out these 25 hand-picked Ajax articles and tutorials that outline various methods and concepts involved in the development of Ajax-based applications.

read more | digg story

Top 5 javascript and Ajax frameworks

A list of the top 5 javascript frameworks and features. These are the best and mostly used frameworks which have integrated technologies related to Ajax, XML, DTD, etc.

read more | digg story

Tuesday, July 1, 2008

Best Ajax and Javascript Solutions

Mocha UI
Mocha is a rich web Based applications UI Library built on the MooRD Tools javascript and ajax frameworks. The Mocha Core UI components are made with advanced canvas tag graphics.

This is the best use of ajax frameworks, is developed by Moo RD Tools and for advanced learners anyone can visit Moo Tools.net (its a completely javascript frameworks source).

Javascript and Ajax guide

Facebook Ajax Search
The autocomplete functionality of adding multiple users to messages used on Facebook. “I’d seen it in Facebook before, generally based on core Ajax and Javascript Tool search which has a really decent implementation of this concept is a modern programming principles”.

These days there are lots of APIs available for this kind of functionality. Which have unique features for using XML file into that Frameworks.

Facebook Ajax based Search


Javascript tools and frameworks with Extjs

In this context, there is a UI control that replaces a standard HTML textarea. The Rich Text Editor’s Toolbar is extensible via a plugin architecture so that advanced implementations can achieve a high degree of customization. The tool is based upon Yahoo UI Library.

Friday, June 27, 2008

CSS Science: CSS Frameworks and Code Reusability

No one has to write the duplicate CSS Code or XHTML-Markup over and over again. At some point you have to define classes and IDs throughout the web-projects. To avoid unnecessary mistakes or codes you might have to start not from a dummy file, but from an almost standard format. The latter might contain some basic definitions you’d write in your code anyway. However, once you’ve decided to create such a standard format then you need to make sure it is really bulletproof — besides, if the CSS Stylesheet also sets up optimal typographic rules and basic form styling, that would be the best.

And this is how, CSS Frameworks and CSS Reusability of Code are becoming important.Get CSS Frameworks and CSS Reusability

Using them, you can get yourself a perfect CSS stylesheet and markup master, save your time and ensure the best quality of your code from the very beginning to advanced level. But what are CSS Frameworks? And why do you need the Reset for?

so the answer is here....

u can simply download the advanced css book Download CSS Book

Best Book for HTML & CSS Tutorial

The highly used web browsers like — Firefox 3, Opera 9.5 and Internet Explorer 7 — provides a lot of features which seems to save and secure lots of work time for web-developers in future.

In that Reference, the Best Tutorial e-Book over HTML & CSS can be found here.

Download Now!

Sunday, June 22, 2008

Reference Tutorials in Technorati.com

All user those who are interested and are used to Web, AJAX, CSS, Javascript Tutorials for thei Rich Web Application can found here.

Users can see my profile over Technorati.com mentioned below or can directly visit Technorati.com

Technorati Profile

Monday, March 24, 2008

Hottest Online Gaming!!

This section covers the best online games over the website which includes action games, puzzling games, arcade games, etc., named Games Flame.

About Games Flame

Recently created site with major online games for all kind of users.more...

or you can visit the complete details of the site by reading this blog Learn More About GamesFlame.com