DHTML image manipulation onmouseover

A way to control the size and location of three images on a webpage... when another image is hovered over. and a form to generate the code to input into the page. ## Deliverables A very simple bit of coding needed... but I want it in DHTML / javascript. I don't want to run any activex. I want to change the attributes of 3 images on my page when a user hovers over a 4th image. This is how it will work.... The trigger image (the one with the mouseover command) will be a transparent image that automatically positions itself at the top of the browser for the full width of the window. It should be 6px high. This image should not affect the look of the website at all... so it will need to be positioned on a higher layer or as absolute and not move any of the other text etc on the website. this is only to be used as a trigger for a onmouseover command. If this can be done with checking mouse location without any browser conflicts then that's ok.. it's just the simplest way I know to do it! The other three images will be set to 1x1 pixel and positioned in the bottom right of the screen. When the trigger image is rolled over, the other three images resize and move into position. All of the images must be clickable links and they must appear over the webpage that is displayed underneath... so they appear to be floating over the website like a pop-up window (but not a window... just clickable images.) The images will be one main image, and two small ones. The main image should position itself in the centre of the browser window the other two images need to be positions in relation to the main image. So I want this set like this... main image position = var imgpos so I can set the other images to x=imgpos-20 y=imgpos+50 etc... at whatever values I need. (these values will depend on the main image size and design, so this will change depending on the image the user decides to use as the main image) I will adjust the position values of teh other 2 images so I just want the ability to change the value to a + or - based on the main image. I want to have a HTML page with a form that asks for the following information... then a 'generate code' button will produce the code that I need to paste into the website. The form will ask for the url of one of the images and the url for the link when that image is clicked. (This is the main image) The other 2 images will have the data preset to what I specify, so the user that is using the form on my website can not change these. Of the 3 images that change, one is the one defined by the user in the form, this one can have it's location, it's size and it's link url defined by the user. A second will be used as a 'close window X' and clicking it will rest everything so the images go back to their original settings. This image url is set to what I specify and the user can not change it.. the location of this image will depend on the first image... so that the 'x' appears just to the top right of the main image. The other image will require the user to enter their affiliate Id only, and it will insert this data into the link for that image. This image will appear below the main image and is used as an affiliate link back to my site. When the user enters the information and clicks on generate, the form should create the code in a text area box. If code is needed for the head tag and the body tag, these must appear in separate boxes. The code that is generated should not be plain HTML coding, a user should not be able to understand the code from the text box. but the browser should be able to understand it ok. This needs to works across ALL browsers without any 'blocked script' pop ups from IE This is the reason I want to do this this way. I was using activex to achieve the same effect but it is not compatible with every broswer. Another reason I want to do this this way is because I would be able to get my head around the script so that I can edit it proficiently... if it's too complicated I will not be able to edit it... I know it's probably a very crude way of creating this effect... if you have a very simple alternative that does not use any scripting that would be blocked by IE on standard installation settings then please suggest something. Finally... I am using lots of different images for the main image... some of these will ahve transparent background, so I will want these to show up correctly with the website showing through in the transparent areas. Plus... when the images are in place... I want to blanket over the website underneath with 60% fill. Thanks! Steve