How to expand a div upwards??

Discussion in 'CSS' started by 123GoToAndPlay, Jun 8, 2007.

0
  1. #1
    Hi all,

    I am trying to create a expandable banner with css/js/flash. At the moment i am able to create a dropdown expandable banner, but I want it to go upwards.
    http://www.bldd.nl/bannerTest/

    So onrollover the div will expand upwards, how can i do this?

    regards
     
    123GoToAndPlay, Jun 8, 2007 IP
  2. 123GoToAndPlay

    123GoToAndPlay Peon

    Messages:
    669
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #2
    123GoToAndPlay, Jun 8, 2007 IP
  3. briansol

    briansol Well-Known Member

    Messages:
    221
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    110
    #3
    doesn't do a thing in firefox....



    you probably want to use negative margins.

    .off {
    width: 500px; height: 50px; }

    .on {
    margin-top: -200px; height: 250px; }


    you may need to add some positioning element (relative or absolute) along with possible z-index issues.
     
    briansol, Jun 8, 2007 IP
  4. PaulYoung

    PaulYoung Guest

    Messages:
    11
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    the clip property doesn't work unless the element has been positioned absolutely.

    but dont use the clip property, go like this:

    #Element
    {
    width: 400px;
    height: 50px;
    display: block;
    }

    #Element:hover
    {
    height: 100px;
    position: relative;
    top: -25px;
    }

    make sure #Element is an A element, or else the :hover won't work in IE6
     
    PaulYoung, Jun 8, 2007 IP