ScrollTop not working on IE11

You are correct, there are a ton of similar queries on StackOverflow, but after reading / analyzing at least 20, I haven't found the right answer. I have confirmed that my script contains

$('body,html').animate({scrollTop:$(this).offset().top},800);

      

instead

$("body").animate({scrollTop:$(this).offset().top},800);

      

as pointed here: scrollTop not working on firefox and IE? to no avail. I also tried several other modifications that prevented it from working with all browsers.

While the script works flawlessly in everything I've tested (Chrome, Firefox, Opera), it doesn't work as expected on Windows 8.1 / IE11. It should hide #featuring_wrap, show #DIV_X and scroll it. He does everything except the scroll. The sidebars get taller, but they don't scroll to the DIV.

I read in another post that jQuery v1.x was for <= IE8 and v2.x for> = IE10. Could this be the culprit? Hope not - I already tried v2.1.1 but everything else on the page stopped working (slider, other hide / show features).

Here are two versions of the script. The first is what I am using. There is no difference when I use the second version.

$(document).ready(function(){
  $("#featured-product-nav a").click(function(){
    $("#featuring_wrap").hide();
      var id = $(this).attr('id');
      id = id.split('_');
      $("#divs_container > div").removeClass("active");
      $("#divs_container > #div_"+id[1]).addClass("active");
      $("#divs_container > div:not(.active)").slideUp();
      $("#divs_container > div.active").slideToggle(function(){
         $('body,html #divs_container > #div_"+id[1]').animate({
            scrollTop: $("#div_"+id[1]).offset().top
         }, 800);
      });
   });

   return false
});


$(document).ready(function(){
 $("#featured-product-nav a").click(function(){
    $("#featuring_wrap").hide();
    var id =  $(this).attr('id');
    id = id.split('_');
    $("#divs_container div").removeClass("active");
    $("#divs_container #div_"+id[1]).addClass("active");
    $("#divs_container div:not(.active)").slideUp();
    if($("#divs_container #div_"+id[1]).hasClass("open")){
       $("#divs_container #div_"+id[1]).removeClass("open").slideUp();
    }

   else{
       $("#divs_container .open").slideUp().removeClass("open");
       $("#divs_container #div_"+id[1]).addClass("open").slideDown();
       $('body,html #divs_container #div_"+id[1]').animate({
          scrollTop: $("#div_"+id[1]).offset().top
       }, 800);
   }
 });
});

      

The live code is here: http://www.healthfirst.com/dental-waste/Sharps-Recovery-Dental/index.html

Any suggestions?

+3


source to share





All Articles