JavaScript网页上的平滑滚动

时间:2018-10-19 08:56:35

标签: javascript search smooth-scrolling

为了在较大的网页上搜索文本,我找到了脚本“ JavaScript在页面上查找”,并且已在我的网站上实现了该脚本,并且运行良好。但是要使其具有平滑的滚动效果,我想使其平滑地滚动到搜索结果,而不是立即跳转到选定的结果。我尝试调整现有脚本,但不知道如何正确添加任何动画或滚动到此代码。任何想法?您将如何解决这个问题?

var TRange = null;

function findString(str) {
if (parseInt(navigator.appVersion) < 4) return;
var strFound;
if (window.find) {
    // CODE FOR BROWSERS THAT SUPPORT window.find
    strFound = self.find(str);
    if (strFound && self.getSelection && !self.getSelection().anchorNode)     {
        strFound = self.find(str)
    }
    if (!strFound) {
        strFound = self.find(str, 0, 1)
        while (self.find(str, 0, 1)) continue
    }
} else if (navigator.appName.indexOf("Microsoft") != -1) {
    // EXPLORER-SPECIFIC CODE        
    if (TRange != null) {
        TRange.collapse(false)
        strFound = TRange.findText(str)
        if (strFound) TRange.select()
    }
    if (TRange == null || strFound == 0) {
        TRange = self.document.body.createTextRange()
        strFound = TRange.findText(str)
        if (strFound) TRange.select()
    }
} else if (navigator.appName == "Opera") {
    alert("Opera browsers not supported, sorry...")
    return;
}
if (!strFound) alert("String '" + str + "' not found!")
    return;
};

document.getElementById('f1').onsubmit = function() {
findString(this.t1.value);
return false;
};

我发现该脚本已有一个小提琴:

https://jsfiddle.net/samliew/xhYZb/

0 个答案:

没有答案