2014-01-17 2 views
0

jQuery에서 새로운 기능입니다. 나는이 코드를 stackoverflow에 발견했습니다. 스크롤링하는 동안 마우스를 위아래로 움직이면 정상적으로 작동하지만,이 내용을 마우스 왼쪽 및 오른쪽으로 스크롤하고 싶습니다.단추 위로 가져 가면 왼쪽 또는 오른쪽으로 이미지 스크롤

<!DOCTYPE html> 
<html> 
<head> 

<title>Scroll up</title> 
<style> 
#content { 
    overflow:auto; 
    width: 178px; 
height: 21px; 
border:1px solid #000000; 
} 

</style> 
<script type="text/javascript" src="jquery.js"></script> 
<script> 
$(document).ready(function(){ 
var step = 25; 
var scrolling = false; 

// Wire up events for the 'scrollUp' link: 
$("#scrollUp").bind("click", function(event) { 
    event.preventDefault(); 
    // Animates the scrollTop property by the specified 
    // step. 
    $("#content").animate({ 
     scrollTop: "-=" + step + "px" 
    }); 
}).bind("mouseover", function(event) { 
    scrolling = true; 
    scrollContent("up"); 
}).bind("mouseout", function(event) { 
    scrolling = false; 
}); 


$("#scrollDown").bind("click", function(event) { 
    event.preventDefault(); 
    $("#content").animate({ 
     scrollTop: "+=" + step + "px" 
    }); 
}).bind("mouseover", function(event) { 
    scrolling = true; 
    scrollContent("down"); 
}).bind("mouseout", function(event) { 
    scrolling = false; 
}); 

function scrollContent(direction) { 
    var amount = (direction === "up" ? "-=1px" : "+=1px"); 
    $("#content").animate({ 
     scrollTop: amount 
    }, 1, function() { 
     if (scrolling) { 
      scrollContent(direction); 
     } 
    }); 
} 
}); 
</script> 


</head> 
<body> 
    <a id="scrollDown" href="#">up</a> 
    <a id="scrollUp" href="#">down</a> 

<div id="wrapper"> 
    <div id="content"> 

     <ul> 
      <li>some content here</li> 
      <li>some content here</li> 
      <li>some content here</li> 
      <li>some content here</li> 
      <li>some content here</li> 
      <li>some content here</li> 
      <li>some content here</li> 
      <li>some content here</li> 
      <li>some content here</li> 
      <li>some content here</li>    
     </ul> 

    </div> 
</div> 

</body> 
</html> 

jsfiddle 링크 : http://jsfiddle.net/andrewwhitaker/s5mgX/

답변

0

marquee 텍스트를 스크롤하는 데 사용할 수있는 태그, 왼쪽과 오른쪽이있다 :

예 : 내가 천막 태그를 사용하지 못할

<marquee behavior="scroll" direction="left">Here is some scrolling text... right to left!</marquee> 
+0

그 jquery에 있어야합니다. – user2750762

관련 문제