div하지만 오른쪽으로 오른쪽에서 왼쪽으로 스크롤 왼쪽에서 완료 한 라운드가에 걸리면 scrollBack()기능. 프로그램은 clearInterval()원하는 이벤트에서 문을 실행 하지만 실제로 간격을 지우지는 않습니다. 내가 도대체 뭘 잘못하고있는 겁니까?
var backint = null;
function scrollForward() {
if ($("#foo").scrollLeft() != $("#foo").width()) {
$("#foo").scrollLeft($("#foo").scrollLeft() + 1);
} else {
backint = setInterval(scrollBack, 5);
}
}
function scrollBack() {
if ($("#foo").scrollLeft() != 0) {
$("#foo").scrollLeft($("#foo").scrollLeft() - 1);
} else if ($("#foo").scrollLeft() == 0) {
clearInterval(backint);
}
}
그것은 더 나은 함께 할 것 같은 로리 McCrossan이 때문에 그 제안 재 구현 기존의 것이 아니라 반드시 더 나은 : .animate()setInterval
var foo = $("#container"),
bar = $("#foo"),
scrollSize = bar.width() - foo.width();;
function scrollForward() {
console.log('forward', foo.scrollLeft(), bar.width() - foo.width());
if (foo.scrollLeft() != scrollSize) {
foo.animate({
scrollLeft: scrollSize + 'px'
});
}
}
function scrollBack() {
console.log('back', foo.scrollLeft(), scrollSize);
if (foo.scrollLeft() === scrollSize) {
foo.animate({
scrollLeft: '0px'
});
}
}
foo.on("click", scrollForward);
foo.on("dblclick", scrollBack);#container {
border: 1px solid #ccc;
width: 410px;
overflow-x: scroll;
height: 50px;
}
#foo {
background-color: #ccc;
width: 1300px;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container">
<div id="foo">Click to scroll right. Double-click to scroll left.</div>
</div>이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다