JQuery Help

Discussion in 'Web Design and Development' started by Aperture, Aug 10, 2009.

  1. Aperture macrumors 68000

    Aperture

    Joined:
    Mar 19, 2006
    Location:
    PA
    #1
    I'm trying to accomplish a certain effect that I've seen done on other websites a bunch of times. Whenever the page loads, I'd like to have Div 2 physically (and animated) slide down the page, revealing a hidden menu of sorts, hidden behind it. Here is a diagram to help explain...

    Do I need to help clarify? Does anyone have any suggestions?

    [​IMG]
     
  2. Cerebrus' Maw macrumors 6502

    Joined:
    Mar 9, 2008
    Location:
    Brisbane, Australia
    #2
    Initial CSS:
    Code:
    #mydiv2 {
    display:hidden;
    width:100px; /*whatever you want*/
    height:100px; /*Again whatever you want*/
    }
    
    Jquery:
    Code:
    $(function() { 
        $("#mydiv2").slideDown("slow");
      });
    

    HTML
    Code:
    <div id="mydiv2">
         Put your content here
    </div>
    
    You could also use show, which give a more slideDown/slide Accross function. Or use it in conjunction with setTimeout, where you could make it slide down, say 1 second, after the page loads.

    Jquery rocks.
     

Share This Page