CODEWITHSUNDEEP
javascripthtmlcss
Liam Docherty
Liam Docherty

Reputation: 39

Why isn't my navbar appearing on my website?

I'm wondering if anyone can help solve this problem it would be much appreciated. Why isn't my navbar appearing on my website? I have reviewed my HTML, CSS AND JS and can't seem to identify the problem. Here is my GitHub website link. I do believe the problem could be with the JS though.

JS

var scroll = new SmoothScroll('a[href*="#"]');

jQuery(document).ready(function($) {


    $(document).on("scroll", function() {
        const features_top = $(".features-icons").position().top;
        const top_of_window = $(window).scrollTop();

        if (top_of_window >= features_top) {
            $('.navbar').css('display', 'flex') // display: flex
        } else {
            $(".navbar").hide();
        }
    });
}); // This is just a sample script. Paste your real code (javascript or HTML) here.

if ('this_is' == /an_example/) {
    of_beautifier();
} else {
    var a = b ? (c % d) : e[f];
}

Upvotes: 3

Views: 217

Answers (2)

jasinth premkumar
jasinth premkumar

Reputation: 1413

you javascript.js uses smooth scroll so it should be included first.

else

you can include or use it in javascript.js like this

$.getScript("js/smooth-scroll-master/dist/js/smooth-scroll.js", function() {
var scroll = new SmoothScroll('a[href*="#"]');

jQuery(document).ready(function($) {


    $(document).on("scroll", function() {
        const features_top = $(".features-icons").position().top;
        const top_of_window = $(window).scrollTop();

        if (top_of_window >= features_top) {
            $('.navbar').css('display', 'flex') // display: flex
        } else {
            $(".navbar").hide();
        }
    });
}); // This is just a sample script. Paste your real code (javascript or HTML) here.

if ('this_is' == /an_example/) {
    of_beautifier();
} else {
    var a = b ? (c % d) : e[f];
}
});

Upvotes: 1

Mohammad Ali Rony
Mohammad Ali Rony

Reputation: 4905

You need to add reference of smooth-scroll.js file before javascript.js file because of javascript.js code use smooth-scroll.js object.

<script src="js/smooth-scroll-master/dist/js/smooth-scroll.js"></script>

<script src="js/javascript.js"></script>

It will fix your problem.

Upvotes: 3

Related Questions