SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    Apr 2004
    New Hampshire
    0 Post(s)
    0 Thread(s)

    Need some help building a horizontal slider/menu component

    I am looking for some help building an HTML/CSS component that would:

    1) Feature a small set of icons that would be placed on the right-side of a div
    2) If someone clicked on one of the icons, the component would slide out towards the right, featuring various UI elements (i.e. descriptive text and form elements). The component slides out to match the width of the content (not fixed width)
    3) The slider slides back if the user clicks on the "X" in top right corner or moves their mouse/clicks outside the slider area.
    4) A nice to have would be if the component is towards the right side of the screen, the component slides out left (so it does not go outside the screen area or show a horizontal slider on the bottom of the screen window).

    A visual of what I am trying to accomplish can be found in the attached file.
    Attached Images Attached Images

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Melbourne, AU
    448 Post(s)
    8 Thread(s)
    This kind of behavior normally required JavaScript, so this thread has been moved there.

    If you Google somthing like "jQuery slide out menus" or "jQuery popup boxes" or similar you may find some ready-to-go scripts. Then you can look at the styling later.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."


Posting Permissions

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