Scrolling navigation not properly working

时间:2016-02-12 22:14:21

标签: javascript php jquery wordpress

I've been struggling with a piece of code that should be really easy to implement and I just don't see what I'm doing wrong. I hope you guys can help.

I'm trying to get my left navbar to scroll down when the user is about to scroll past that navbar. I've found a great jsfiddle that I've tried to implement but so far it is only partly working.

Here is the jsfiddle: http://jsfiddle.net/b43hj/

The site is: http://justaddwater.nl I want the blue navbar on the left to start scrolling when the top of the browser hits the red line on top of the content area. But right now it starts scrolling immediately.

I have a feeling that the js code just isn't being executed but I could be wrong. Can anyone please help me fix this and then tell me that im an idiot for not seeing the problem myself? ^^' Thanks!

/css/hagel.css

(?=\S)

/js/hagel.js

#sidebar { 
position:fixed;
top:250px;
background-color:red
}

sidebar.php

$(window).scroll(function(){
 $("#sidebar").css("top",Math.max(0,250-$(this).scrollTop()));
});

functions.php

<div id="sidebar" class="widgets-area">
<?php dynamic_sidebar('sidebar-1'); ?>
</div>

1 个答案:

答案 0 :(得分:0)

您有Javascript冲突。将jQuery置于无冲突模式。

jQuery.noConflict();
jQuery( document ).ready(function( $ ) {
  $(window).scroll(function(){
    $("#sidebar").css({top:Math.max(0,250-$(this).scrollTop())});
  });
});