Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialNijad Kifayeh
6,092 PointsNav not toggling
Having some issues getting the nag to toggle.
Here's my code from functions.php:
<?php
function wpt_theme_styles() {
wp_register_style( 'normalize_css', get_template_directory_uri() . '/css/normalize.css' ) ;
wp_enqueue_style( 'normalize_css', get_template_directory_uri() . '/css/normalize.css' ) ;
wp_register_style( 'googleFonts', ' http://fonts.googleapis.com/css?family=Asap:400,700,400italic,700italic' ) ;
wp_enqueue_style( 'googleFonts', ' http://fonts.googleapis.com/css?family=Asap:400,700,400italic,700italic' ) ;
wp_register_style( 'foundation_css', get_template_directory_uri() . '/css/foundation.css' ) ;
wp_enqueue_style( 'foundation_css', get_template_directory_uri() . '/css/foundations.css' ) ;
wp_register_style( 'main_css', get_template_directory_uri() . '/style.css' ) ;
wp_enqueue_style( 'main_css', get_template_directory_uri() . '/style.css' ) ;
}
add_action( 'wp_enqueue_scripts', 'wpt_theme_styles' );
function wpt_theme_scripts() {
wp_register_script( 'modernizer_js', get_template_directory_uri() . '/js/modernizr.js', '', '', false ) ;
wp_enqueue_script( 'modernizer_js', get_template_directory_uri() . '/js/modernizr.js', '', '', false ) ;
wp_register_script( 'foundation_js', get_template_directory_uri() . '/js/foundation.min.js', array('jquery'), '', true ) ;
wp_enqueue_script( 'foundation_js', get_template_directory_uri() . '/js/foundation.min.js', array('jquery'), '', true ) ;
wp_register_script( 'main_js', get_template_directory_uri() . '/js/app.js', array('jquery', 'foundation_js'), '', true ) ;
wp_enqueue_script( 'main_js', get_template_directory_uri() . '/js/app.js', array('jquery', 'foundation_js'), '', true ) ;
}
add_action( 'wp_enqueue_scripts', 'wpt_theme_scripts' );
?>
Here's my app.js code:
$( ".nav-toggle" ).click(function() {
$(this).toggleClass("open");
$("nav").fadeToggle(100);
return false;
});
Also, these errors appeared in the console:
[Error] Failed to load resource: the server responded with a status of 404 (Not Found) (css, line 0)
[Error] TypeError: undefined is not a function (evaluating '$( ".nav-toggle" )')
global code (app.js, line 1)
[Error] Failed to load resource: bad URL (jquery.min.map, line 0)
Devinee Fitzgerald
2,709 PointsJordan Cox Did you ever find a solution here? I also have no error and my toggle doesn't work.
1 Answer
mikes02
Courses Plus Student 16,968 PointsIn your app.js are you using document.ready? Maybe you could try:
$(document).ready(function() {
$(".nav-toggle").click(function(e) {
e.preventDefault();
$(this).toggleClass("open");
$("nav").fadeToggle(100);
});
});
Note that I replaced your return false with jQuery's preventDefault.
Nijad Kifayeh
6,092 Pointssorry, yes, I was using document.ready....
jQuery(document).ready(function($) {
$(document).foundation();
$( ".nav-toggle" ).click(function() {
$(this).toggleClass("open");
$("nav").fadeToggle(100);
return false;
});
});
tried your code as well and still not toggling....
Nijad Kifayeh
6,092 PointsMike, it's working now!! Not sure why it took so long, but my guess is maybe the delay was cache related. Thanks!
BTW, I'm not too good w/ query, so can you explain why you replaced return false with jQuery's preventDefault ?
mikes02
Courses Plus Student 16,968 PointsJust preference, really, return false would have worked in this case as well, I think that preventDefault is just the more common approach.
Jordan Cox
8,930 PointsJordan Cox
8,930 PointsI'm confused, where did you get the wp_register_script from? That was not in any of the lessons? My toggle is also broken with no errors and I have checked all the answers and suggestions...