0

I'm designing a personal Web page with ASP.NET. In order to make a sticky div inside my page, i'm using jQuery. All of my jQuery functions work well except my sticky div functions.

stickydiv.js

$(document).ready(function () {
    var s = $("#stick_body");
    var pos = s.position();
    $(window).scroll(function () {
        var windowpos = $(window).scrollTop();
        s.html("Distance from top:" + pos.top + "<br />Scroll position: " + windowpos);
        if (windowpos >= pos.top) {
            s.addClass("stick");
        } else {
            s.removeClass("stick");
        }
    });
});

i've placed this file's reference inside my content page(hobbies.aspx). Also, main jquery file (jquery-latest.min.js) is placed inside master page's section. But when i run the project, it give's an error:

Unhandled exception at line 1, column 2 in http...stickydiv.js 0x800a138f - JScript Runtime Error: Object Expected.

I tried to reference stickydiv.js file inside masterpage but it didn't work.

1 Answer 1

1

line 1, column 2

Sounds like it's failing right at the call to the $() function, which most likely means jQuery isn't loaded. You need to make sure that jQuery is loaded before any scripts which use it. For example, this is incorrect:

<script type="text/javascript" src="stickydiv.js"></script>
<script type="text/javascript" src="jQuery.js"></script>

Whereas this is correct:

<script type="text/javascript" src="jQuery.js"></script>
<script type="text/javascript" src="stickydiv.js"></script>
Sign up to request clarification or add additional context in comments.

8 Comments

my jquery.js file is placed inside masterpage. stickydiv.js file is placed in my content page.
@AloneInTheDark: In what relation to one another on the client-side? What you're describing is a server-side separation, which doesn't make a difference in JavaScript (which runs on the client). How are they loaded in the rendered client-side page?
i've a div named "stick_body" inside my content page. stickydiv.js's reference is inside content page's head section. what am i doing wrong?
@AloneInTheDark: Based on the information provided, it sounds like what you're doing wrong is loading the JavaScript libraries in the wrong order. As shown in the answer, the jQuery script reference needs to happen before any code which uses it. Things like "content page section" have no meaning in client-side code, it all renders to a single page in the browser.
even if i put the stickydiv.js file after jquery.js file, it gives same error. because the jquery code does not recognize my div named "stick_body". i need to write an event or something that runs after my content page is fully loaded.
|

Your Answer

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

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.