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
jquery internet-explorer-11 scrolltop


source to share


No one has answered this question yet

See similar questions:

13
scrollTop not working on firefox and IE?

or similar:

4
-Webkit-scroll bar + overflow + JQuery scrollTop returns always zero
1
Scrolling div with scrolltop () and div position.top only works once and then weird
1
scrollTop occurs when further down
1
I have children to have GrandChildren in jQuery
1
Define the top of the page for jQuery.scrollTop
1
JQuery code not working on iPad only
0
How to disable jQuery properties in css media query
0
jQuery scrollTop with "else if" statement doesn't work
0
fix element after scrolling
-1
swap class in scrolling in jquery



All Articles
Loading...
X
Show
Funny
Dev
Pics