Django - Page not scrolling down when importing jquery

Question

Basically, if I import jquery as it follows:

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

I happen to observe two different scenarios:

If I use my Django Template, I can no longer scroll down the page in the mousepad, but only with the scrollbar. If I delete the line in which I import jquery, I can scroll down again!
If I decide to view the source code generated from the template, copy and paste it entirely into a new html file, if I open it in my browser, now I can scroll down with my mousepad/arrows.

What on Earth can be such reason for that? What am I missing out?

My base.html template goes more as it follows:

{% load staticfiles %}
<!-- html code -->
<body>
{% block content %}
{% endblock %}
</body>
</html>

There is not enough information here to help you - there must be something specific to your template that is causing this behaviour. — solarissmoke, May 06 '17 at 06:13
Anything useful in the browser devtools' console? Any errors/warnings? — drdaeman, May 06 '17 at 15:58

score 0 · Answer 1 · edited May 23 '17 at 12:34

It must be that there is some code that intercepts mouse events and prevents scrolling. Something along the lines of:

$(document).on("mousewheel", function (e) {
    e.preventDefault();
    return false;
});

(Script taken from here, just for illustration purposes. Yours would look different.)

It could be literally anywhere. Maybe not even in your code, but some third-party script. We can't see this. What's probably the case is that without jQuery it fails and doesn't eat the scroll events, but when you add jQuery it succeeds in installing a listener and your browser starts to "misbehave".

This is not definite, but just a guess of the most probable cause. Search all your files (HTML and JS) for "mousewheel", check out browser devtools for event listeners, and maybe you'll find something. Also, consider temporarily disabling all third-party <script>s if you have any. I guess you can just install something like uMatrix and block all external resources. Then unblock them one by one.

Django - Page not scrolling down when importing jquery

1 Answers1