0

I am building a custom theme in Wordpress from scratch. Right now, I have done only the basics, such as creating the necessary .php files like index.php, footer.php etc..In my navigation menu I have a contacts anchor which is supposed to navigate you in the footer with animation. So, it is not working in Chrome and Safari, but works in Firefox. ( IE is not tested yet ). This is my jQuery and js files reference in header.php right after the meta tags:

<!-- Scripts -->
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/scrolling.js"></script>
<!-- End of Scripts -->

<!-- CSS links -->


<?php wp_enqueue_script("jquery"); ?>
<?php wp_head(); ?>

</head>

and this is my js file, pretty simple:

$(document).ready(function()
{

  var v = $('div.nav-bar li a:last').addClass('scrollToBottom');
    v.click(function()
    {
    $('html,body').animate( {scrollTop: $(document).height() }, 1600);
      console.log('hello');
      return false;
    });

});

My navigation bar is dynamically created with a class "nav-bar" in the functions.php. So, I added the console.log just to make sure that JS is working, and it does, the click function fires when you click in the contacts but nothing happens. Sorry I cannot upload any images. Also, it works fine when it is static but I don't want a static nav and it does work in Firefox....Any suggestions would be much appreciated.

2
  • "building... in Wordpress... from scratch" sooo funny :D
    – musefan
    Mar 20, 2013 at 17:06
  • building a* Wordpress them from scratch..:D
    – appostolis
    Mar 27, 2013 at 11:49

1 Answer 1

0

You shouldn't use <?php wp_enqueue_script("jquery"); ?> in your header.php file. wp_enqueue_script() should be added to your functions.php file and hooked accordingly using add_action('wp_enqueue_scripts', 'function_name').

Then you don't need to add <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> either.

WordPress loads jQuery in No Conflict mode. so your jQuery should look like:

jQuery(document).ready(function($)
{
 // your code here
});
3

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.