2012-02-21 4 views
0

왼쪽 값을 조작하여 div를 가로로 슬라이드하는 함수가 있습니다. 모든 것이 잘 작동합니다. 스크롤을 오른쪽이나 왼쪽으로 돌릴 수 있습니다. 문제가있는 것은 if if statements이고 스크롤하는 것을 멈추는 것입니다. div의 왼쪽 값을 측정하고 div 및 화면 측정을 기준으로 이동해야하는 상한 및 하한을 알고 있습니다. 그러나 왼쪽 값이 한 방향의 한계보다 훨씬 클 때조차도 스크롤을 멈추지 않을 것입니다. 또한 첫 번째 if 문은 패널이 숨겨져 있고 스크롤해야하는지 테스트합니다. 즉 panelsWidth 및 portWidth 변수가 무엇인지 테스트합니다. 내 변수가 업데이트되지 않는지 또는 어떤 제안이 있는지 확실하지 않은가요? 미리 감사드립니다.JQuery if 문 조건

JQuery와 코드

function portfolioSlider() { 

var portWidth = $(window).width()-440; 
var panelsWidth = panels * 221; 
var portDifference = panelsWidth - portWidth; 

if (panelsWidth < portWidth) { 
} 

else if(panelsWidth > portWidth) { 

    var leftPosition = $('#web').css('left').replace(/[^-\d\.]/g, ''); 
    var upperLimit = 220; 
    var lowerLimit = 220 - portDifference; 
    var hoverInterval; 

    if(leftPosition >= lowerLimit, leftPosition <= upperLimit) { 

     $(".arrow_right").css('display','block').css('opacity','1') 
     $(".arrow_left").css('display','block').css('opacity','1')   
     $(".arrow_right").hover(
      function() { 
       hoverInterval = setInterval(
       function() { 
        $('#web').css('left','-=2'); 
        leftPosition = $('#web').css('left').replace(/[^-\d\.]/g, ''); 
       },10); 
      }, 
      function() { 
       clearInterval(hoverInterval); 
      } 
     ); 
     $(".arrow_left").hover(
      function() { 
       hoverInterval = setInterval(
       function() { 
        $('#web').css('left','+=2'); 
        leftPosition = $('#web').css('left').replace(/[^-\d\.]/g, ''); 
       },10); 
      }, 
      function() { 
       clearInterval(hoverInterval); 
      } 
     );   
    }  
    else { 
    }  
}; 
}; 

portfolioSlider() 

되는 HTML은 잘 작동 거기에 이미지 패널의 단지 사업부, 정말 무관하다. 다시 한번 제안에 감사드립니다.

답변

0

왜 jQuery.animate()를 사용하지 않습니까? 당신은 쉽게

$(".arrow_right").hover(
    function() { this.animate("left", animateTo); }, 
    function() { this.animate("left", animateFrom); } 
); 
+0

전체 애니메이션 및 사업부의 슬라이딩, 나는 기능을 점점 더 관심 괜찮아 작품과 문이 실제로 작동을 중지하는 경우 조건이 충족되지 않을 때 더 이상. 스크롤하여 변수가 스크롤되는 방식에 따라 왼쪽 변수 값을 표시하도록 설정했습니다. 문제는 왼쪽 값이 지정 된 최대 값 또는 최소값을 벗어나면 핫 스폿에서 벗어나 다시 스크롤해도 계속 스크롤됩니다. – user1223896

+0

그래서 jquery animate 함수를 사용하여 애니메이션을 만드는 것이 좋습니다. 무슨 일이 일어나고 있는지 당신이 알아 채지 못할 수도 있습니다 (당신은 parseInt로 할 수있는 CSS 픽셀 값의 변환을 포함하여), 인터벌은 리셋되지 않을 수도 있고, CSS 값은 원하지 않을 때 변경 될 것입니다.). –

0

if(leftPosition >= lowerLimit, leftPosition <= upperLimit) { 

이 유효 자바 스크립트 아니다처럼 뭔가를 할 수 있습니다.

부울 을 의미 했습니까?

if(leftPosition >= lowerLimit && leftPosition <= upperLimit) { 

즉 수학적 표기법

: lowerLimit <= leftPosition <= upperLimit