添加上/下按鈕的jQuery滾動插件

HTML：添加上/下按鈕的jQuery滾動插件

<div id="scrooly" class="span7"> 
    <p> 
     Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc sit amet quam et orci dictum sagittis. In hac habitasse platea dictumst. Morbi sed dictum nibh. Nullam felis est, feugiat a ullamcorper sed, iaculis ut ligula. Aliquam erat volutpat. Nam in sapien magna, in feugiat velit. Quisque tellus est, ultricies a euismod sed, consectetur et libero. Quisque ac libero in elit suscipit semper. Cras eget metus quis turpis ultrices aliquam sed at enim. Integer ullamcorper odio consequat nunc egestas tempus. Cras eget orci elit, ac eleifend nunc. Phasellus tincidunt nibh arcu. Donec laoreet ornare nisl, sit amet rutrum sem mollis sed. 
    </p> 
    <img src="assets/img/photo01.jpg" /> 
    <p> 
     Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc sit amet quam et orci dictum sagittis. In hac habitasse platea dictumst. Morbi sed dictum nibh. Nullam felis est, feugiat a ullamcorper sed, iaculis ut ligula. Aliquam erat volutpat. Nam in sapien magna, in feugiat velit. Quisque tellus est, ultricies a euismod sed, consectetur et libero. Quisque ac libero in elit suscipit semper. Cras eget metus quis turpis ultrices aliquam sed at enim. Integer ullamcorper odio consequat nunc egestas tempus. Cras eget orci elit, ac eleifend nunc. Phasellus tincidunt nibh arcu. Donec laoreet ornare nisl, sit amet rutrum sem mollis sed. 
    </p> 
</div>

和我所有的結構：

http://jsfiddle.net/2FcZN/

它的工作不錯，但我想，UP和DOWN按鈕在我的滾動條。我怎樣才能做到這一點？

來源

2013-11-22 Slaythern Aareonna

您可以在定位的情況下覆蓋默認滾動按鈕。 – Suleman

您可以使用以下方法：

創建2個按鈕：

<button id='upClick'>Go Up</button> 
<button id='downClick'>Go Down</button>

的jQuery：

var scrolled = 0; 
$("#downClick").on("click", function() { 
    scrolled = scrolled + $("#scrooly").scrollHeight; //Edit << 
    $("#scrooly").animate({ 
     scrollTop: scrolled 
    }); 
}); 


$("#upClick").on("click", function() { 
    scrolled = scrolled - $("#scrooly").scrollHeight; //Edit << 

    $("#scrooly").animate({ 
     scrollTop: scrolled 
    }); 
});

更新提琴：http://jsfiddle.net/2FcZN/3/

我希望這有助於！

來源

2013-11-22 13:13:15 Billy

是的，它的工作原理是點擊向上或向下按鈕時，滾動滾動功能。你看到了嗎？ –

這可能是因爲我瞄準了錯誤的元素。你正在做你的網頁/ div的高度。如果你向下滾動，然後向上，它的作品..你應該檢查你應該瞄準什麼元素。我更新了我的代碼，以便它總是滾動到元素的底部。我不確定你在用自定義滾動條做什麼。你也可以定位身體（不在jsfiddle中工作）。 – Billy

-1

嘗試設置與設置爲24像素的值底部，作爲頁腳的高度

來源

2013-11-22 13:10:43

那是甚麼相關 – ImadBakir

添加上/下按鈕的jQuery滾動插件

回答

相關問題