0

I have a bar graph that works perfectly in firefox & chrome, but doesn't in internet explorer. Anyone help me out? Thank you. http://jsfiddle.net/FkUYf/6/

    $(document).ready(function(){
        $(document).scroll(function() {
           var top = $(document).scrollTop();
           console.log(top);
           if (top > 300) {
              $("#html, #css").animate({width:"100%"}, 2000);
              $("#javascript").animate({width:"40%"}, 2000);
              $("#php").animate({width:"50%"}, 2000);
              $("#mysql").animate({width:"30%"}, 2000);
              $("#wordpress").animate({width:"60%"}, 2000);
           }
        });
    });
vol7ron
  • 40,809
  • 21
  • 119
  • 172
user1375823
  • 95
  • 1
  • 12
  • 1
    5 `if` statements for the same conditions? Why? – Ram Mar 09 '13 at 19:00
  • 5
    IE doesn't have console.log, so that is probably crashing it before running the rest. Other than that, maybe the IE window is bigger to top never gets big enough. Also as undefined said, having the same if 5 times is just silly. – Dave Mar 09 '13 at 19:02
  • @Dave Um? IE has had a console since IE8. Anyway, working fine for me in IE10. – Niet the Dark Absol Mar 09 '13 at 19:03
  • 1
    @Kolink, he didn't specify *which* IE, so it's possible he's using IE6 or 7. (also I thought it didn't have console.log until IE9?) – Dave Mar 09 '13 at 19:04
  • @Kolink: I got curious and found this, which seems like the reason for the ambiguity in IE8: http://stackoverflow.com/questions/690251/what-happened-to-console-log-in-ie8 – Dave Mar 09 '13 at 19:06
  • I'm using IE9...removed the console.log and now it works! Thank you Dave! – user1375823 Mar 09 '13 at 19:07
  • 1
    Place brackets after (top > 300) to help contain all 5 jquery statements – klewis Mar 09 '13 at 19:08

1 Answers1

2

Try this:

   $(document).ready(function(){
        $(document).scroll(function() {
            var top = $(document).scrollTop();
            console.log(top);
           if (top > 300) {
                          $("#html, #css").animate({width:"100%"}, 2000)
                          $("#javascript").animate({width:"40%"}, 2000);
                          $("#php").animate({width:"50%"}, 2000);
                          $("#mysql").animate({width:"30%"}, 2000);
                          $("#wordpress").animate({width:"60%"}, 2000);
          }
        });
    });
Amrendra
  • 2,019
  • 2
  • 18
  • 36