2014-05-13 3 views
1

나는 내 웹 페이지를 가로로 스크롤 할 수있는 기능이있다. 나는 Chrome에서 잘 작동하는 다음과 같은 것을 가지고있다. FirefoxInternet Explorer에서 테스트 할 때 단지 넘어 질 뿐이다. 아무도 내 구문에서 주목할만한 오류를 볼 수 있습니까?jQuery는 IE의 Firefox에서 작동하지 않습니까?

/* Navigtion */ 
$('nav ol li a').click(function(e){ 
    e.preventDefault(); 
    $('nav').find('.active').removeClass('active'); 
    $(this).addClass('active'); 


    if($(this).hasClass('sectionOne')){ 

     scrollTo = $('.section-one').position().left;    
     $('body').animate({'scrollLeft': scrollTo}, 800); 

    } else if($(this).hasClass('sectionTwo')){ 

     scrollTo = $('.section-two').position().left;    
     $('body').animate({'scrollLeft': scrollTo}, 800); 

    } else if($(this).hasClass('sectionThree')){ 

     scrollTo = $('.section-three').position().left;    
     $('body').animate({'scrollLeft': scrollTo}, 800); 

    } else if($(this).hasClass('sectionFour')){ 

     scrollTo = $('.section-four').position().left;    
     $('body').animate({'scrollLeft': scrollTo}, 800); 

    } else if($(this).hasClass('sectionFive')){ 

     scrollTo = $('.section-five').position().left;    
     $('body').animate({'scrollLeft': scrollTo}, 800); 

    } else if($(this).hasClass('sectionSix')){ 

     scrollTo = $('.section-six').position().left;    
     $('body').animate({'scrollLeft': scrollTo}, 800); 

    } else if($(this).hasClass('sectionSeven')){ 

     scrollTo = $('.section-seven').position().left;    
     $('body').animate({'scrollLeft': scrollTo}, 800); 

    } 



}); 

답변

4

다른 브라우저는 서로 다른 요소에 스크롤 막대를 연결, 당신은/다른 문이 여기에 예를 들어 만약 모든 것보다 더 좋은 방법을 알아 내기 위해이

$('html, body').animate({'scrollLeft': scrollTo}, 800); 

시도를해야한다.

추가 데이터는 앵커

<nav> 
    <ol> 
     <li> 
     <a data-section="section-one" .... 

속성을 당신은 두 줄

var scrollTo = $('.' + $(this).data('section')).position().left;    
$('html, body').animate({'scrollLeft': scrollTo}, 800); 
+0

Ahh 나는 그것을 몰랐다!, thanks @adeneo – Liam

0

시도와 같은 모든 경우/다른 광기를 제거 할 수 있습니다

$('body').animate({'scrollLeft': scrollTo}, 800); 
$('html').animate({'scrollLeft': scrollTo}, 800); 

일부 브라우저는 'html'로 작동하고 일부 브라우저는 'body'로 작동합니다.

관련 문제