Showing posts with label HTML. Show all posts
Showing posts with label HTML. Show all posts

Tuesday, December 11, 2007

Using iframe in web pages causes the browser back button not to function correctly

Introduction

Being able to embed a web page in another web page can be really handy. Also source page of iframe can be modified which means that programmers can update the embedded page content.

Issue

The problem with iframe tag is that when users click on the browsers back button, the embedded page goes one page back instead of the main page if the source URL of the iframe has been dynamically changed. This behavior is not acceptable in some situations.

Resolution

Use the follow JavaScript code in order to change the iframe source URL:

top.frames['Iframe Name'].location.replace("New URL");

Iframe Name is the name of iframe tag. Please note that it is not the iframe Id.
New URL is a placeholder for the URL name.

It works in both IE and FireFox.

Thursday, November 1, 2007

Removing special characters from query string values using javascript

Query string parameters can not include specific characters. One of the easiest ways of removing these characters, is through using JavaScript encodeURI function.

var encodedString=encodeURI("URI String");

To get the original string use the following function:

var decodedString=decodeURI("URI%20String"));

Saturday, October 6, 2007

XHTML quick reference

  • XHTML elements should be nested correctly.
  • Always close tags.
  • Elements should be in lower case.
  • Tags <html>, <head> and <body> are mandatory in XHTML.
  • Enclose all attributes values in quotes.
  • Do not use minimization (not only in HTML but in all programming languages).
  • Utilize id attribute for naming elements instead of name attribute.
  • All XHTML documents should have a DOCTYPE declaration.

There are three kinds of DOCTYPE as follows:

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
  3. <!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

Making parts of images clickable in HTML

<img src="MyImageURL" usemap="#MyMap" />
<map id="MyMap">
<area shape="rect" coords="0,0,100,100" alt="" onclick="alert('Clicked');"/>
</map>


Note: Shape can get these values: Rect, Circle and Polygon

Tuesday, September 25, 2007

How to center your page contents

Have you ever wondered how the contents of all standard web sites stay in the middle of the screen regardless of the width of user's screen. One example of this feature can be found at http://www.msn.com/. You will notice if you change the width of the page there is always an equal amount of margin available in both sides of the page contents. As a result of this feature, the web site can support all different kinds of screen widths.

In order to achieve this functionality simply assign attribute align="center" to the main table of your page, the one that contains all other elements.