html ll events, framesets and xhtml. onclick captures the click event can be used with most tags ...
Post on 22-Dec-2015
222 views
TRANSCRIPT
onclick
Captures the click event Can be used with most tags Examples
onclick=“javascript:alert(‘Thank you for subscribing!’)”
onclick=“checkfield(form1)”
ondoubleclick
Captures the double click event Used on most tags Example
ondblclick = “javascript:document.getElementById(‘txtName’).value = this.value”
onmouseover/onmouseout
Captures the movement of the mouse
Used with most tags Example:
onMouseOver="javascript:this.src=‘world.jpg'"
onmouseout="javascript:this.src='web.gif'"
onfocus/onblur
Captures event when you set focus on an element or lose focus.
Used with <a>, <area>, <input>,<label>, <body>, <textarea>,<button>,<frameset>,<select>
Example: onfocus=“javascript:alert(‘This field is
required’)” onblur=“javascript:if (this.value) == “”)
{alert(‘You must enter a value in this field’)}”
Frameset
Breaks your page into rows and columns. Each frame is essentially it’s own document.
Attributes: rows or cols – you must define one or
the other Border, frameborder, framespacing or
border color
Frame Content
Defines each frame within the frameset Attributes:
Src = defines the URL that will be displayed in the frame
Name or id – used to uniquely identify the frame
Noresize – keeps the user from resizing the frame
Scrolling – allows vertical or horizontal scrolling Frameborder and bordercolor – determines if
there is a border and it’s color
noframes
This replaces the body and is read by browsers that do not support frames
It is best to include this especially if you are unsure of what browser your audience will be using
Frames Example
<frameset cols=“150, *”><frame src=“navbar.htm” name=“frame1”><frame src=“content.htm” name=“frame2”>
</frameset><noframes>
We apologize, but this page must be viewed in a frame-capable browser.
</noframe>
Inline frames
Allows you use frames inside a traditional document
Attributes Name – identifies the frame Src – the url of what is to be in the
frame when the page loads Height and width – needs to be set or
defaults will apply (width is 300px, height is 100px)
Disadvantages of using frames
1. Search Engines Will Have Difficulty Indexing Your Website. Search engines have great difficulty indexing websites which use frames. In most cases, this means that only the home page is indexed. However, it might also mean that the internal frames may be indexed outside of the frameset. This results in visitors being directed to a page which lacks a navigation or footer.
Disadvantages of using Frames
1. There Are Better Alternatives. If the main reason that you want to use frames is to avoid having duplicate content on each page, such as a navigational menu, there are other methods to make this happen. These include Server Side Includes, Dynamic Coding (such as PHP or ASP), and CGI.
Disadvantages of using Frames
1. Visitors Will Have Trouble Bookmarking Pages. When visitors browse your website, they might find some interesting content and want to bookmark it. However, frames will not allow them to do this properly. Because the user is always within the frameset element, they will be able to bookmark the frameset, but not the individual page that they want.
Disadvantages of using Frames
1. Internet Connection Speeds Are Faster. While using frames might have reduced load time in the past, internet connection speeds are now faster. In addition, there are now more efficient ways to code websites that further minimize the sizes of web pages and what your visitors actually need to download.
External .js files
Can be linked so javascript functions can be reused on different pages.
<script language=“javascript” src =“openwindow.js” type=“text/javascript”></script>
XHTML
Like HTML but uses DTD to define XML elements
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
XHTML
Nested Tags Same as current HTML <b>This statement is <i>itallic</i></b>
End Tags are required <p></p> <br /> <input type = “text” name=“txtName” />
XHTML
Case sensitive All html tags need to be lower case
Attributes in Quotes All attribute values must be in double
quotes <table name=“tblTableOne” cols=“3”
rows=“5” width=“500”>
XHTML
Explicit Attribute values All attributes must have a value <option “IA” selected=“selected”> <input type=“radio” name=“rdoMF”
value=“M” checked=“checked”> Special Characters
Put javascript in external files <img src=“saltandpepper.jpg” alt=“Salt
& Pepper”> See appendix F for character definitions