Grow your CSS skills. Land your dream job.

CSS Menu Slider for Mobile Devices – Collaboration

  • # December 28, 2012 at 3:34 pm

    I would prefer to have a js fallback for the browsers which do not support transitions.

    # January 4, 2013 at 2:46 pm

    @ChrisP those are the same issues I’ve been struggling with for awhile. Fixed positioning and overflowing out of the window will definitely create some problems on different browsers, and will cause you to be sent right back to the top when the menu is collapsed.

    # January 4, 2013 at 2:56 pm

    @bkbillma I just got a chance to look at the site under 400px on both a laptop and my phone. I see what you’ve done, but there are obvious drawbacks.

    **Desktop:**

    • Menu is only visible when the mouse button is held down, as soon as it’s released, the menu disappears. This makes it impossible to use the mobile version of the menu on desktop.
    • Does not respect scrolling, will jump up to a little lower than the top when the menu button is clicked.

    **Mobile:**

    • Menu doesn’t pull out far enough, text is cut off.
    • Can still scroll when menu is extended.
    • Only way to collapse the menu is to click on one of the menu items.
    • Does not respect the user’s scrolling. Resets to top.

    A lot of these reasons are why I stayed away from the :target pseudo-class. Again, this is more of a proof of concept than something on which I would reliably base a business’s website.

    # January 4, 2013 at 3:08 pm

    @Koopa absolutely! IE is the bane of every web developer, but that’s what Modernizr is for. If the browser doesn’t support transitions, have it load some JS as a fallback to make it pretty.

    # January 7, 2013 at 11:37 am

    @paintba11er89, I think you could probably avoid the overflow horizontal scrollbar by inserting `html { overflow-x: hidden; }` and remove the fixed positioning from the content area..I tried it, but not in depth, I think it may handle the positioning of the content, and wouldn’t need to adjust the width either.

    # April 8, 2013 at 5:12 pm

    I’ve updated it a little bit. Little more cosmetically pleasing, and I added support for sub-menus. Still looking for some collaboration on this.

    # May 22, 2013 at 1:26 pm

    css & html for mobile plz :D

Viewing 7 posts - 16 through 22 (of 22 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".