Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 6 of 6
  1. #1
    Member sopiaz57's Avatar
    Join Date
    Sep 2003
    Posts
    41
    Member #
    3058
    Hey guys, i have an easy one here.

    2 divs, one visible one hidden. the ID for one div is "div1", the ID for the other div is "div2"


    here's my function......to be executed on roll over..


    function div_swap()
    {
    document.div1.visibility="hidden";
    document.div2.visibility="visible"
    }

    whats missing, i know im close.
    thanks
    "It's very important not to embellish on your order. No extraneous comments. No questions. No compliments."
    - Jerry, in "The Soup Nazi"

  2.  

  3. #2
    JR
    JR is offline
    Senior Member JR's Avatar
    Join Date
    Nov 2002
    Location
    UK
    Posts
    4,354
    Member #
    257
    Firstly, make sure that it is actually an id and not a name attribute in the div tags.

    Then use this...
    Code:
    function div_swap()
    {
    document.getElementById('div1').style.visibility = "hidden";
    document.getElementById('div2').style.visibility = "visible";
    }
    However, that is not cross-browser compatible so use...
    Code:
    function div_swap()
    {
    document.getElementById('div1').style.top = "-2000px";
    document.getElementById('div1').style.left = "-2000px";
    document.getElementById('div2').style.top = "0px";
    document.getElementById('div2').style.left = "0px";
    }
    Change the px values depending on where the div is positioned. I think you must also use css positioning as a style for the JavaScript to work, IIRC.
    JR

  4. #3
    Member sopiaz57's Avatar
    Join Date
    Sep 2003
    Posts
    41
    Member #
    3058
    thanks, i had something to that degree but yours woked.

    Here's the problem now, The one div when i mousover is below the hidden div, can i get around this by using a z-index? or do i have to use positioning??
    "It's very important not to embellish on your order. No extraneous comments. No questions. No compliments."
    - Jerry, in "The Soup Nazi"

  5. #4
    JR
    JR is offline
    Senior Member JR's Avatar
    Join Date
    Nov 2002
    Location
    UK
    Posts
    4,354
    Member #
    257
    You will have to use positioning. What are the divs for?
    JR

  6. #5
    Member sopiaz57's Avatar
    Join Date
    Sep 2003
    Posts
    41
    Member #
    3058
    the one div holds a flash movie, the other is a pic, then are being swapped and should reside in the same location.

    I cant get css positioning to work at all, it's pretty wierd.

    heres my <style>

    #div1
    {

    visibility:visible;
    left:388px;
    top:355px;

    }


    #div2
    {

    visibility:hidden;
    left:388px;
    top:355px;

    }
    "It's very important not to embellish on your order. No extraneous comments. No questions. No compliments."
    - Jerry, in "The Soup Nazi"

  7. #6
    JR
    JR is offline
    Senior Member JR's Avatar
    Join Date
    Nov 2002
    Location
    UK
    Posts
    4,354
    Member #
    257
    You will need "position: absolute;" and have one of them placed off the page.

    so...

    Code:
    #div1
    {
    
    position: absolute;
    left:388px;
    top:355px;
    
    }
    
    
    #div2
    {
    
    position: absolute;
    left:-2000px;
    top:-2000px;
    
    }
    JR


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 12:27 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2020 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com