![Close [x]](http://dw1.s81c.com/i/c.gif){kind=small}
Before you start
This tutorial is for Web developers who want to create objects, such as images and menus, that hold their place (or float) in the browser window even when the user scrolls or resizes the window.
The first floating objects seen on the Web were likely watermarks placed in a top or bottom corner of the browser to identify a Web community such as Geocities. These were semi-transparent and meant to be unobtrusive, but were nevertheless fascinating to users who had never seen an object that didn't move when they scrolled the page.
Today, you can achieve the same effect using JavaScript in the browser -- creating content, placing it, and controlling its location as the user scrolls or resizes the page. This tutorial discusses the process necessary for creating these floaters in such a way that they are available to users of both Netscape (4.x and 6.x) and Microsoft Internet Explorer (5.x and 6.x) browsers.
In addition, this tutorial demonstrates how to allow Internet Explorer users to reposition the floater in such a way that it holds its new position even when the page is scrolled or resized.
You should be generally familiar with HTML and JavaScript. An understanding of both dynamic positioning and objects is helpful, but not required; the basics are covered in this tutorial. (Find more information on these subjects in the Resources section at the end of this tutorial.)
Example code snippets are provided throughout the tutorial to underscore the concepts discussed. To work through the examples, you need:
- A text editor: HTML pages and the JavaScript sections within them are simply text. To create and read them, a text editor is all you need.
- Any browser capable of exploiting dynamic positioning using JavaScript: This includes Netscape Navigator 4.7x and 6.1, and Microsoft Internet Explorer 5.5. Note that while this tutorial discusses creating floaters that work in all three of the above browsers, the floater can only be repositioned in IE 5.5.
Table of contents
Local resources
Tags
Use the slider bar to see more or fewer tags.
Popular tags shows the top tags for this particular content zone (for example, Java technology, Linux, WebSphere).
My tags shows your tags for this particular content zone (for example, Java technology, Linux, WebSphere).
Popular tutorial tags |
My tutorial tagsSkip to tags list
Popular tutorial tags |
My tutorial tags
