Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    Sep 2010
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Position of Onmouseover Images

    Hi,

    I am currently working on an intranet page for my place of work. The page consists of divs that pop up as an image when the mouse rolls over a certain item.

    This is the code:

    Code:
    <a href="#" onmouseover="pop4.style.display='block';" onMouseMove="pop4.style.left=(event.clientX)-200; pop4.style.top=(event.clientY)-450;" onMouseOut="pop4.style.display='none';"><img src="pics/de_commission.gif" border="0" align="center" valign="top"></a>
    Div:

    Code:
    <div id="pop4" style="position:absolute; z-index:100; border:2px solid #000000; padding:20px; display:none;background:white">
    
    <table style='border:1px; font-size:15px; font-family:Arial;'>
    
    <tr><td style='font-size:20px'><b>Commission Charges</b></td></tr>
    <tr></tr><tr></tr><tr></tr>
    
    <tr><td><img src="pics/de_charges3.png" border="0" align="center"></img></a>
    
    </td></tr>
    
    </table>
    </font>
    </div>
    Every time I add a new item to the page I have to edit the co-ordinates for every item (there's about 100 of them).

    I would like for all the images that pop up to be shown in the centre of the page, no matter how far it is scrolled down. Can you help?

    Regards

  • #2
    Senior Coder
    Join Date
    Aug 2010
    Location
    High Point, NC
    Posts
    3,338
    Thanks
    5
    Thanked 363 Times in 360 Posts
    position: fixed will "fix" an element to a specific portion of the page no matter how far you scroll.

    You should also create an external style sheet. Makes styling much easier and manageable.

  • #3
    New Coder
    Join Date
    Sep 2010
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Sorry i wasnt very clear.

    What I want is the divs to pop up wherever i am looking on the page so if I am at the bottom of the page the dive will pop up there etc....

    Unfortunately due to restrictions on out work intranet we cannot use external CSS!

  • #4
    Regular Coder Donkey's Avatar
    Join Date
    Sep 2003
    Location
    Blackfield UK
    Posts
    312
    Thanks
    1
    Thanked 36 Times in 36 Posts
    position: fixed will "fix" an element to a specific portion of the page no matter how far you scroll
    That is misleading, it will fix the element in relation to the browser window not the page. So as far as I can see that is just what you need. It won't work in IE6 but there are various work rounds. Just Google "Position Fixed IE6"
    Last edited by Donkey; 09-09-2010 at 01:27 PM. Reason: typo
    " 90% of everything is crud" - Theodore Sturgeon
    Filthy Beast - a 60's Rock Band

  • #5
    Senior Coder
    Join Date
    Aug 2010
    Location
    High Point, NC
    Posts
    3,338
    Thanks
    5
    Thanked 363 Times in 360 Posts
    An external style sheet is also on your local intranet server. You are restricted in such a way that you cant add a .css to your own server?

  • #6
    New Coder
    Join Date
    Sep 2010
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    All I can do is edit the body of a html document through an 'intranet manager'. I dont have access to the server files.

    I have tried changing it to position:fixed however all this does is make the div show up at the bottom of the page, the div disappears on mouse out so it's no good!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •