0

I had some animations on my home screen via an external javascript file that I included in my scripts array in my Angular.cli.json file. After implementing routing to my project to use multiple pages, the animations no longer execute when the page loads. Do I have to change how my javascript is being referenced now that I implemented routing? Here is my script array for reference:

"scripts": [
    "./assets/build/js/vendor/jquery-1.11.2.min.js",
    "./assets/build/js/plugins.js",
    "./assets/build/js/vendor/modernizr-2.8.3.min.js",
    "./assets/build/js/main.js"
  ]

EDIT: Here is my javascript

var didScroll;
var lastScrollTop = 0;
var delta = 5;
var navbarHeight = $('.wrp-site-header').outerHeight();

$(window).scroll(function(event){
    didScroll = true;
});

setInterval(function() {
    if (didScroll) {
        hasScrolled();
         didScroll = false;
    }
}, 250);

function hasScrolled() {
    var st = $(this).scrollTop();

 // Make sure they scroll more than delta
if(Math.abs(lastScrollTop - st) <= delta)
    return;

// If they scrolled down and are past the navbar, add class .nav-up.
// This is necessary so you never see what is "behind" the navbar.
if (st > lastScrollTop && st > navbarHeight){
    // Scroll Down
    $('.wrp-site-header').removeClass('nav-down').addClass('nav-up');
} else {
    // Scroll Up
    if(st + $(window).height() < $(document).height()) {
        $('.wrp-site-header').removeClass('nav-up').addClass('nav-down');
    }
}

    lastScrollTop = st;
}
Improve this question
4
  • Can you share what animation code you're trying to run? Commented Oct 31, 2017 at 18:43
  • Hi, I'd really urge you not to influence the 'window' object through the JS / TS files. Angular does this for you, you need to tell Angular how you want the behaviour to be. Commented Oct 31, 2017 at 18:53
  • This stackoverflow thread seems promising. stackoverflow.com/questions/45199319/angular-4-scroll-animation Commented Oct 31, 2017 at 18:54
  • I would agree, but I am getting my js from my designer for the project, so unfortunately that is the code I am stuck with.. Commented Oct 31, 2017 at 18:54
Related questions
1
angular routeprovider not executing
1
Angular-route issues - Route not executing
2
AnguarlJS Routing, Controller not executing
Load 7 more related questions Show fewer related questions

0

Reset to default

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.