SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Enthusiast
    Join Date
    Apr 2012
    Location
    Battle Ground, Washington, United States
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question My Mobile navigation isn't sending me to the pages it's supposed to...

    I'm trying to use this method of navigation for my responsive website: http://css-tricks.com/convert-menu-to-dropdown/

    The problem I'm having is my navigation for mobile isn't working. I can select the items but it doesn't send me to any page when I select a item from the list. Here is the website: http://css-tricks.com/convert-menu-to-dropdown/

    Anyone have any idea why it's not functioning how it should?

    Thanks,

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,471
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    We'd need to see the site in question or at least your own html and css to debug further.

  3. #3
    SitePoint Enthusiast
    Join Date
    Apr 2012
    Location
    Battle Ground, Washington, United States
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    http://test.koolcollar4dogs.com/ woopsy. I accidentally posted the same link twice.

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,471
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    Where's the main jquery file that this js needs:
    Code:
    $("nav select").change(function() {
      window.location = $(this).find("option:selected").val();
    });

  5. #5
    SitePoint Enthusiast
    Join Date
    Apr 2012
    Location
    Battle Ground, Washington, United States
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Is this what is missing?

    Code:
    // Create the dropdown base
    $("<select />").appendTo("nav");
    
    // Create default option "Go to..."
    $("<option />", {
       "selected": "selected",
       "value"   : "",
       "text"    : "Go to..."
    }).appendTo("nav select");
    
    // Populate dropdown with menu items
    $("nav a").each(function() {
     var el = $(this);
     $("<option />", {
         "value"   : el.attr("href"),
         "text"    : el.text()
     }).appendTo("nav select");
    });
    I tried putting that in but it didn't seem to do anything either. I'll try it again.

  6. #6
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,471
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by ajrdesign View Post
    Is this what is missing?

    Code:
    // Create the dropdown base
    $("<select />").appendTo("nav");
    
    // Create default option "Go to..."
    $("<option />", {
       "selected": "selected",
       "value"   : "",
       "text"    : "Go to..."
    }).appendTo("nav select");
    
    // Populate dropdown with menu items
    $("nav a").each(function() {
     var el = $(this);
     $("<option />", {
         "value"   : el.attr("href"),
         "text"    : el.text()
     }).appendTo("nav select");
    });
    I tried putting that in but it didn't seem to do anything either. I'll try it again.
    No, you don't have the jquery library added which is what the script is using.

    e.g. This if you want to link directly:

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>

    It should go above all other scripts.

  7. #7
    SitePoint Enthusiast
    Join Date
    Apr 2012
    Location
    Battle Ground, Washington, United States
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ahh ok, that makes sense. I've added it yet it's still not working. I'm really not familiar with java or jquery so I'm at a loss to what's happening in this code. Perhaps there is a line or two that I need to tweak?

  8. #8
    SitePoint Enthusiast
    Join Date
    Apr 2012
    Location
    Battle Ground, Washington, United States
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Oh figured it out. Had to add <nav> tags to the navigation in the HTML. Thanks for your help Paul!


Tags for this Thread

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
  •