SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Addict
    Join Date
    Feb 2013
    Posts
    278
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Help me change this show/hide menu when screen size < 767px

    So i have this menu now, thats working fine:

    http://jsfiddle.net/Ymu8T/51/

    It shows/hides exactly as i want i to.

    But when screen size is below 767px i want it to collapse down so only the "M", the trigger, is shown. And when u click the trigger i want the menu to slide in downwards instead of from the right.

    Here is how the it looks when i make take the float: left from the <li>.

    http://jsfiddle.net/Njbb6/3/

    Can u add media queries to the jquery code or how would u do this?

    thanks in advance.

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,705
    Mentioned
    102 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by ReGGaeBOSS View Post
    Can u add media queries to the jquery code or how would u do this?
    Here's a good piece about how to do it, using window.matchMedia
    http://www.sitepoint.com/javascript-media-queries/
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Addict
    Join Date
    Feb 2013
    Posts
    278
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by paul_wilkins View Post
    Here's a good piece about how to do it, using window.matchMedia
    http://www.sitepoint.com/javascript-media-queries/
    Thanks! Goin to check it out!


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
  •