Scroll to top funktioniert nicht

[joerg]

Hallo,

ich versuche mich gerade an einem Javascript. Dieses scheint auf den ersten Blick zu funktionieren. Aber wenn das Script aktiv ist, dann funktioniert z.B. das Accordion nicht mehr. Ich verwende Bootstrap 3.3.1 Ich benötige dringend Hilfe beim Debuggen des Scriptes.

Ich möchte die Lösung des Problems als Auftragsarbeit abgeben. Bitte eine PN an mich.

jQuery(function($) {
  
  // When to show the scroll link
  // higher number = scroll link appears further down the page
  var upperLimit = 100;
  
  // Our scroll link element
  var scrollElem = $('a#scroll-to-top');
  
  // Scroll to top speed
  var scrollSpeed = 100;
  
  // Show and hide the scroll to top link based on scroll position
  scrollElem.hide();
  $(window).scroll(function () {
    var scrollTop = $(document).scrollTop();
    if ( scrollTop > upperLimit ){
      $(scrollElem).stop().fadeTo(300, 1); // fade back in
    }else{
      $(scrollElem).stop().fadeTo(300, 0); // fade out
    }
  });
  
  // Scroll to top animation on click
  $(scrollElem).click(function(){
    $('html, body').animate({scrollTop:100}, scrollSpeed); return false;
  });
  
});


/* Anchorlink smooth scroll */
jQuery(function($) {
  $('a[href*=#]:not([href=#])').click(function()
  {
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
        || location.hostname == this.hostname)
    {
      
      var target = $(this.hash),
      headerHeight = $(".primary-header").height() + 5; // Get fixed header height
      
      target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
      
      if (target.length)
      {
        $('html,body').animate({
          scrollTop: target.offset().top - 240
        }, 500);
        return false;
      }
    }
  });
});

[lottikarotti]

[joerg]

Hallo

Hier mein zweiter Versuch. Scroll to top funktioniert jetzt ohne Probleme.

Jetzt nacht mir das accordion Probleme. Vielleicht läßt sich das Codestück auch nur lokal in der speziellen html datei und nicht global, wie ich ich es jetzt habe, einbinden. Bitte schaut einmal drüber.

Vielen dank für die Hilfe.

Hier der code für scroll to top.

 $(function() {$
     // scroll handler$
     var scrollToAnchor = function( id ) {$
       // grab the element to scroll to based on the name$
       var elem = $("a[name='"+ id +"']");$
       // if that didn't work, look for an element with our ID$
       if ( typeof( elem.offset() ) === "undefined" ) {$
         elem = $("#"+id);$
       }$
      // if the destination element exists$
      if ( typeof( elem.offset() ) !== "undefined" ) {$
        // do the scroll$
        $('html, body').animate({$
                scrollTop: elem.offset().top - 240$
        }, 1000 );$
      }$
    };$
    // bind to click event$
    $("a").click(function( event ) {$
      // only do this if it's an anchor link$
      if ( $(this).attr("href").match("#") ) {$
        // cancel default event propagation$
        event.preventDefault();$
        // scroll to the location$
        var href = $(this).attr('href').replace('#', '')$
        scrollToAnchor( href );$
      }$
    });$
  });$

Hier kommt ein Ausschnitt vom Accordion.

<h5>Fragen</h5>$
                <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">$
                  <div class="panel panel-default">$
                    <div class="panel-heading" role="tab" id="uEins">$
                      <h4 class="panel-title"><a data-toggle="collapse" data-parent="#accordion" href="#collapseEins" aria-expanded="false" aria-controls="collapseEins">Was ist das Onlineportal?<
                    </div>$
                    <div id="collapseEins" class="panel-collapse collapse" role="tabpanel" aria-labelledby="uEins">$
                    <div class="panel-body">$
                      <p>Das Onlineportal</p>$
                    </div>$
                    </div>$
                  </div>$

hier das Stück Code, für welches ich scroll to top benötige

<a class="btn btn-default btn-block" href="#dts">Datenschutzklauseln</a>$

<div id="scroll-to-top"></div>

           <div class="page-header">
               <div id="dts"><h4>Datenschutzklauseln</h4></div>
             </div><!-- /.page-header -->

             <div class="page-body">              
               <h5>Datenverarbeitung auf dieser Internetseite</h5>
             </div><!-- /.page-body -->

             <div class="page-footer">
               <a class="btn btn-warning btn-sm" role="button" href="#scroll-to-top" title="zur&uuml;ck nach oben">zur&uuml;ck nach oben</a>
             </div><!-- /.page-footer -->