2

When I run:

$(document).ready(function($) {
    $("#nav_lat").slicknav({ prependTo: "#mobile_menu" });
});

on a iPhone 6S or iPhone 6 it works. But when I run:

$(document).ready(function() {
    $("#nav_lat").slicknav({ prependTo: "#mobile_menu" });
});

it works on the iPhone 6S BUT NOT the iPhone 6.

Both phones are using iOS 9.2.1 and there are no other changes to the code. What would cause a $ conflict in one but not the other?

Tested this on two Iphone 6S and three Iphone 6. By not working I mean the hamburger doesn't appear. Interestingly, if I use:

 jQuery(document).ready(function($) {
    jQuery("#nav_lat").slicknav({ prependTo: "#mobile_menu" });
});

it doesn't work in the Iphone 6

Vadim Kotov
  • 8,084
  • 8
  • 48
  • 62
DCR
  • 14,737
  • 12
  • 52
  • 115
  • 3
    interesting. did you have the chance to test on different devices or is it limited to one specimen? compare the versions of Safari. Can you elaborate on "not working"? - does nothing, logs an error? is the rest of the page source identical? the additional `$` in the first line of the first code snippet is a typo? – Cee McSharpface Feb 23 '16 at 17:05
  • ok weird. observations seem to rule out things like reassignment or "overloading" of $... give us the version of jQuery and slicknav in use (also: jQuery mobile?). Might try to reproduce as I have a prototype in development with similar library setup. – Cee McSharpface Feb 23 '16 at 17:16
  • The easiest way to get all the files might be from where I'm hosting the web page. [halloween](http://www.cs401.netai.net/Halloween3/halloween.html) let me know if that works for you or I can try to set something up on jsfiddle – DCR Feb 23 '16 at 17:50
  • 1
    dlatikay, sorry it took so long but I had to figure out how to get eclipse to talk to github. I've uploaded the entire project to https://github.com/rss81/Iphone6.git this version should create the hamburger in the 6S but not the 6 if you edit the src/js/slicknav.js file and change function() to function($) it should work with both. Can't figure out why this is happening. Both Iphones are using ios 9.2.1 – DCR Feb 25 '16 at 15:40
  • thanks. I downloaded it and tried. could confirm your observations. – Cee McSharpface Feb 25 '16 at 19:25
  • sorry no definite answer yet. insights so far: both approaches, with $ and without $, are valid and subtly different. read http://www.sitepoint.com/types-document-ready for more information. actually, this page might contain the solution to your problem. I suspect a timing issue, a javascript loading sequence side-effect that manifests because of a slight difference in both iPhones' Safari code. Best bet would be a second js library that overloaded $, but I could not find it, it is not slicknav and it is not modernizr either. – Cee McSharpface Feb 25 '16 at 19:34

0 Answers0