5 Replies Latest reply on Feb 6, 2016 7:30 PM by BenPleysier

    jquery to top

    r_tist Level 1

      Hi,

       

      This is clearly defined within the head of all my pages. However, it is only appearing on the homepage.

      None of my subsequent pages present the 'scroll to top' arrow. Any idea as to why that might be?

       

      It is clearly called just like this. And the JS file is definitely in the js folder.

      <script src="js/jquery.ui.totop.js"></script>

       

      Any suggestions?

      Thank you.

        • 1. Re: jquery to top
          BenPleysier Adobe Community Professional & MVP

          Are you loading the jQuery library?

           

          Please supply a link to your site so that we can have a look for ourselves.

          • 2. Re: jquery to top
            r_tist Level 1

            It is only appearing on the homepage of the site, no other pages - which is odd, so it is firing - just not on sub pages. There is also no obvious HTML referring to it on the homepage.

             

            calls in head:

            <script src="js/jquery.ui.totop.js"></script>

            <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>

             

            CSS

             

            #toTop {

              display: none;

              width: 24px;

              height: 24px;

              background: url(../img/top.png) no-repeat;

              position: fixed;

              margin-right: -640px !important;

              right: 50%;

              bottom: 120px;

              z-index: 999;

              opacity: 1;

            }

            #toTop:hover {

              background: url(../img/top.png) no-repeat;

              opacity: 0.55;

            }

             

            Firebug reveals this to me (code that does NOT appear in the raw markup of the index.html):

            <a href="#" id="toTop" style="margin-right: -44px; right: 50%; display: block;"><span id="toTopHover" style="opacity: 0;"></span></a>

             

            Then I manually (forcefully) added that line of code before closing body tag on one sub page just to test - and the top.png arrow appeared but was persistent. Did not abide by the script to fade in upon scrolling. Also when I clicked it, it abruptly jumped to top rather than gracefully scrolled.

             

            No idea what the situation is with that and why it's not auto firing on the other pages upon scrolling.

            Thank you.

            • 3. Re: jquery to top
              BenPleysier Adobe Community Professional & MVP

              <script src="js/jquery.ui.totop.js"></script>

              <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>

              Swap the two lines so that the jQuery library is loaded first.

              • 4. Re: jquery to top
                r_tist Level 1

                You genius, you! I've been examining code for nearly two hours trying all sorts! Time for a glass of wine for sure - cheers!

                Not only did that solve this issue, but also the same was happening with the mobile nav menu - - when it collapses into an unordered list for tablet & phone...was activating on only 2 pages of the site. I can see that also working here so know that was the issue all along.

                 

                Now I can enjoy the weekend, thank you!

                • 5. Re: jquery to top
                  BenPleysier Adobe Community Professional & MVP

                  Thank you for your feedback. Enjoy your wine and say hello to Bacchus when you see him