使用单击时滚动到该位置的按钮为滚动位置添加书签

Question

我有一些JavaScript使用进度条显示滚动进度。我有一个书签按钮，可以在当前进度位置添加一个图标/按钮。我想要做的是添加以使用cookie保存该位置，另外还添加一个链接到按钮，该按钮将滚动到视口中的书签位置。

所以我目前的代码是;

// the elements indicating scroll progress for document height
(function(){
var w = $(window);
var prog = $('.progress-bar');
var progCount = $('.progress-count');

var wh, h, sHeight;

//the containing div from which the height is calculated
function setSizes() {
    wh = w.height();
    h = $('#page-content-wrapper').height();
    sHeight = h - wh;
}

setSizes();

w.on('scroll', function () {
    var perc = Math.max(0, Math.min(1, w.scrollTop() / sHeight));
    updateProgress(perc);
})

.on('resize', function () {
    setSizes();
    w.trigger('scroll');
});

//progress percentage 
function updateProgress(perc) {
    progCount.html(Math.round(perc * 100) + "%");
    prog.css({width : perc*100 + '%'});
    console.log (perc*100 + '%');
}

//bookmark function that adds an icon/button at the end of the progress bar's current position
//within the add - I have tried using jquery scrollto to get the 'perc' value as a scrollto directive
$('#bookmark').on("click", function() {
    var add = "";
    l = prog.width() - 2;
    t = 59;
    add = "<a href='#' title='$(...).scrollTo( 0, perc, {queue:true} );'><div class=\"star\" style=\" left:";
    add += l;
    add += "px; top:";
    add += t;
    add += "px;\"><span class='icon-bookmark tooltipper' data-toggle='tooltip' data-placement='bottom' title data-original-title='Go Bookmark'></span></a></div>";
    $('.progress-bar').append(add);

});

}（））;

我希望这能恰如其分地解释我所追求的目标。

谢谢！