 |
 |
|
|
||
Here's something fun, something to Wow! your visitors with. Imagine your logo, an image of the moon, or a product photo floating from the edge of the browser window to its proper place on your page. You can do it. First, make a web page with the image you'll be floating into place. Put the image where you would want it to be at the end of its float. Now, grab the JavaScript code from the demo page at http://willmaster.com/a/7/pl.pl?78a and put it into the HEAD area of your page. Note that the image floater utilizes CSS to position the image. IE 4.5 for Macintosh doesn't render CSS position instructions like it should. I have heard that other versions of IE/Macintosh have related bugs. Therefore, the JavaScript code was written to ignore image moves when requested by IE/Macintosh browsers. You'll need to customize the JavaScript code a bit. Instructions are included. The code needs to know the URL of your image, and its height and width. It will also need to know where you want to start and end the float. Just type in four numbers and the JavaScript calculates the float path. It's easy to try different coordinates to find your preference. To start or end the float at the top or the left side of the browser window, specify -2. For the bottom or right side, specify -1. And for the center of the window, specify 0. You can also specify exact pixel coordinates. Both the column (left to right or vice versa) and the row (top to bottom or vice versa) need to be specified. This allows you do float your image at a diagonal, if you want. When you specify 0, -1, or -2, the image automatically coordinates its float path relative to your visitor's browser window size. But if you specify exact pixel coordinates, an absolute float path is calculated for the exact coordinates you specify. The next number you type in is how many steps the float path should contain. The more steps you specify, the smoother (and slower) the float. Try different numbers until you find what works best for you. You also type in a number specifying the number of milliseconds to pause between steps. This may be 0 or any positive number. The last step is to generate the HTML code to put into your web page where your image will appear. You do this by specifying 'yes' for the special DisplayCode variable. When you load the page, a popup window will appear with the correct HTML code. Once you have copied the HTML code from the popup window and put it into your web page, replacing the image <img... tag you had there before, then you specify 'no' for the DisplayCode variable. Once the DisplayCode variable is 'no', everything is ready. You can now change the coordinates, the number of float path steps, and the pause length between steps until you are satisfied with the results. When done, upload the page to your server. Happy floating! Copyright 2001 William Bontrager
| ||