SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    Apr 2004
    Location
    New Hampshire
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    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
    Location
    Melbourne, AU
    Posts
    24,177
    Mentioned
    454 Post(s)
    Tagged
    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.


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
  •