SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Jun 2007
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Help with showing/hiding content with sliding effect

    okay...so, currently i'm trying to create an animation for some content based on the navigation link the end-user selects.

    When the page loads, basically just my header, navigation and footer will be displayed. When a visitor clicks the About link, I want the div that holds that content to display in a sliding motion, pushing down the footer.

    Then when a user clicks on the portfolio link, i want the "About" content div to slide up, and hide itself, and then have the "Portfolio" content div to slide down.

    I've been toying with it but am having no luck. I have the slide-in functionality, but the clicking of the links doesn't do what i want them to do.

    Here's a very simple version of what i've done so far:
    http://www.corydorning.net/sandbox/index.html

    My JavaScript ability is basically that of a "cut and paste'r" but any help, ideas, suggestions, etc. is greatly appreciated. As a side note, i know i could use flash for this, but what's the fun in that. Also, i'd like to see if it can be accomplished without it.

    Thanks guys!

  2. #2
    SitePoint Evangelist Jhorra's Avatar
    Join Date
    Sep 2004
    Location
    Phoenix, Az
    Posts
    551
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You could use scriptaculous, it has those effects built into it.

  3. #3
    SitePoint Member
    Join Date
    Jun 2007
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thx for the info. i actually put it to pretty good use. right now i'm using the divSwap function. However, it does the slide up and slide down effects.

    the one i really like is the switchOff effect. However, there is no "switchOn" effect to match it. Anybody have any ideas on how to pull this off by somehow reversing it?

    Thanks again.


Bookmarks

Posting Permissions

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