滚动到网页的顶部功能
scroll to top function on webpage
嗨,我有一个脚本,用来搜索页面上的单词,然后将它们放在页面顶部。我的问题是我有一个固定的标题,突出显示的结果在固定的标题下滚动。我如何修复脚本,使其不在顶部,而是从顶部向下300像素,这样结果就在页面的中间并突出显示?
这是我的代码:
inPageSearch = function () {
document.getElementsByClassName = function (cl) {
var retnode, myclass, elem, classes;
retnode = [];
myclass = new RegExp('''b' + cl + '''b');
elem = this.getElementsByTagName('*');
for (var i = 0, ii = elem.length; i < ii; i++) {
classes = elem[i].className;
if (myclass.test(classes)) retnode.push(elem[i]);
}
return retnode;
};
elemTop = function (elem) {
return elem.top || elem.pixelTop || elem.offsetTop || 0;
};
search = function (str) {
nodewalk = function (node, str) {
var re, m, s, r, frag, sp;
for (var i = 0; i < node.length; i++) {
if (node[i].hasChildNodes() && 'SCRIPT' !== node[i].nodeName) nodewalk(node[i].childNodes, str);
re = new RegExp(str, 'ig');
if (3 === node[i].nodeType) {
m = node[i].nodeValue.match(re);
s = node[i].nodeValue.split(re);
frag = document.createDocumentFragment();
if (m !== null) {
frag.appendChild(document.createTextNode(s[0]));
for (var j = 0, jj = m.length; j < jj; j++) {
sp = document.createElement('span');
sp.appendChild(document.createTextNode(m[j]));
sp.className = 'found';
frag.appendChild(sp);
frag.appendChild(document.createTextNode(s[j + 1]));
}
node[i].parentNode.replaceChild(frag, node[i]);
i += jj * 2;
}
}
}
};
nodewalk(document.getElementsByTagName('body')[0].childNodes, str);
};
clearfound = function (node) {
var txt = node.previousSibling.nodeValue + node.firstChild.nodeValue + node.nextSibling.nodeValue;
node.parentNode.removeChild(node.nextSibling);
node.parentNode.removeChild(node.previousSibling);
node.parentNode.replaceChild(document.createTextNode(txt), node);
};
var d, F, fld, inp, b1, b2, b3;
d = document.createElement("div");
d.id = 'searchbox';
F = document.createElement("form");
fld = document.createElement("fieldset");
inp = document.createElement("input");
inp.type = 'text';
inp.id = 'search';
fld.appendChild(inp);
b1 = document.createElement("input");
b1.type = 'button';
b1.id = 'search1';
b1.value = 'Find';
b1.title = 'Find all and jump to first';
fld.appendChild(b1);
b2 = document.createElement("input");
b2.type = 'button';
b2.id = 'search2';
b2.value = 'Find Next';
b2.title = 'Jump to next found element';
fld.appendChild(b2);
b3 = document.createElement("input");
b3.type = 'button';
b3.id = 'searchx';
b3.value = 'X';
b3.title = 'Close in page search';
fld.appendChild(b3);
F.appendChild(fld);
d.appendChild(F);
document.getElementsByTagName('body')[0].appendChild(d);
document.getElementById('search1').onclick = function () {
var nodes = document.getElementsByClassName('found');
for (var i = nodes.length - 1; i >= 0; i--) clearfound(nodes[i]);
search(document.getElementById('search').value);
window.scrollTo(0, elemTop(document.getElementsByClassName('found')[0]));
return false;
};
document.getElementById('search2').onclick = function () {
var nodes = document.getElementsByClassName('found');
clearfound(nodes[0]);
window.scrollTo(0, elemTop(document.getElementsByClassName('found')[0]));
return false;
};
document.getElementById('searchx').onclick = function () {
var nodes = document.getElementsByClassName('found');
for (var i = nodes.length - 1; i >= 0; i--) clearfound(nodes[i]);
document.getElementById('searchbox').style.display = 'none';
setTimeout(function () {
document.getElementsByTagName('body' [0].removeChild(document.getElementById('searchbox'));
}, 5);
};
};
inPageSearch();
window.scrollTo(0,300);
将从顶部滚动页面至300px。
相关文章:
- 添加文字和评论功能更新Div
- JavaScript打印功能使日历停止工作
- 单击顶部导航时如何进行向下滚动效果(向下滑动).
- 每当您在选择器内移动鼠标时,悬停功能就会重复
- 如何防止网页加载后自动启动功能
- 除修剪外的其他功能
- 悬停功能触发器
- 使用angularjs向浏览器发送servlet响应(下载功能)
- jQuery粘性插件可变顶部间距
- 删除CKEditor工具栏按钮,但不删除功能
- 异步facebook功能
- 辅助功能键盘专用选项卡到z索引“;返回顶部”;
- 浏览器如何读取JavaScripts,它应该排在第一位(设置在顶部):事件?功能?或子函数
- 移动到顶部功能在kineticJ中不起作用
- 在页面更改功能上跳转到页面顶部
- 滚动到网页的顶部功能
- 在facebook喜欢按钮的顶部覆盖关闭按钮,但保持功能
- 在打开侧边栏之前禁用滚动到页面顶部的功能
- 点击功能使页面以奇怪的方式滚动(不滚动到页面顶部)
- 单击按钮时的 jquery 滚动顶部功能