CodeKicks.com
Focus on Microsoft Technologies - Tutorials, Articles, Code Samples.

Monday, March 17, 2008

Top 10 Internet Explorer 8 features

Microsoft came up with IE8 promising the users with the best web experience ever.

The beta release is available to everyone, but is primarily for Web developers and designers to test the new tools, layout engine, and programming enhancements.

IE 8 beta will run on both 64-bit and 32-bit versions of Windows Vista and Windows Vista SP1 as well as Windows XP Service Pack 2 and Windows Server 2003 and 2008. Download IE 8 beta.

Overview of IE 8 new features

Controlling ActiveX installations: Many controls are not secure and could be misused by malicious Web sites. This can be eliminated by running ActiveX controls on site-by-site basis.

Activities: This is a right-click menu feature of IE 8. Right click a selected item to find list of activities that can be done like blogging, defining, searching, translating and many more.

clip_image002[4]

WebSlices: This enables users to subscribe to marked content on a Web page. This is something similar to subscribing to an RSS feed. When the content changes, the user receives a notification on the Favorites Bar. A WebSlice can be previewed without an additional navigation since it is provided as a dropdown on the browser Favorites bar. When you click on WebSlice drops down you can preview the content. You can click through to go to the Web page that houses the slice, or simply view it in the drop-down.

clip_image004[4]

AJAX Enhancements: IE8 extends it’s control and support to Asynchronous JavaScript and XML (AJAX). XMLHttpRequest object is a data transport object that is the core of AJAX. With timeout property of this object and concurrent connections developers can prevent delays in AJAX applications.

Using timeout property and timeout event handler

var xhr;

xhr = new XMLHttpRequest();

xhr.open("GET", "http://myurl.php", true);

xhr.timeout = 10000;

//timeoutRaised variable is set when ontimeout handler is raised.

xmlHttpRequest.ontimeout = timeoutRaised;

Developer Tools: These tools expose the way IE interprets the web page. Hence we can view individual attributes of an element in a web page and many more.

To open the Developer Tools, press SHIFT+F12 or click the Developer Tools button on the Internet Explorer toolbar.

clip_image005[4]

The Developer Tools window appears in front of the Internet Explorer window. To close the Developer Tools, press SHIFT+F12, click the Developer Tools button in the Internet Explorer toolbar, or click the Close button on the Developer Tools window. The Close button appears in the upper-right corner of the Developer Tools window.

Document Compatibility Mode: Each major release of IE adds new features. Because of this old websites may not display properly. Hence IE6 has introduced compatibility mode switch. IE 8 introduces the concept of document compatibility, which will eventually supersede the Internet Explorer 6 compatibility mode switch. This tells IE8 how to render the website pages. We can add a meta tag to the page in this manner.

<html>

<head>

<!-- Use IE7 mode -->

<meta http-equiv="X-UA-Compatible" content="IE=7" />

<title>My Web Page</title>

</head>

<body>

<p>Content goes here.</p>

</body>

</html>

The content attribute specifies the mode for the page. Specify IE=5, IE=7, or IE=8 to select one of those compatibility modes. Specify IE=edge to tell Internet Explorer 8 to use the highest mode available.

DOM Storage: Introduces SessionStorage and GlobalStorage to store client-side data in a secure manner. Developers can store client specific name/value pairs on the client. It offers more disk space than cookies. It provides roughly 10 megabytes (MB) for each storage area as opposed to 4kb for a cookie.

Following are the DOM scripting objects available

  • window.sessionStorage
  • window.globalStorage
  • The Storage Object

Selectors API: Selector API use Cascading Style Sheets (CSS) selectors to select objects with JavaScript. This section illustrates how to query all the “divs” in the document with class attribute “detail”.

var oAllPs = document.querySelectorAll("div.detail");

var sFound = ( oAllPs == null ) ? "No matches found" : allPs.length;

alert( "Results: " + sFound );

//specifying multiple items

var oAllPs = document.querySelectorAll("div, span");

New Favorites bar: The Links bar has been replaced with new Favorites bar. The new favorites bar can have links to documents on the hard disk, webslices and RSS feeds

Crash recovery:

clip_image006[4]


Finally, the much awaited feature crash recovery similar to Firefox is implemented in IE. Hence after a browser or individual tab crash in IE8, we will have the option of restoring it.

Post a Comment