本文实例讲述了js+css实现模仿浏览器网页字符查找功能的方法。分享给大家供大家参考。具体实现方法如下:
JS+CSS模仿的网页字符查找功能
中国
晋州
百战疲劳壮士哀
洛
黄损
江淮
宝马
夸张
美国
Ajax
ASP
JAVA
JQUERY
');
var w=document.body.clientWidth-450
var h=190
w+=document.body.scrollLeft
h+=document.body.scrollTop
var leftpos=w
var toppos=h
scontentmain.style.left=w
scontentmain.style.top=h
function ondisplay(){
if (scontentsub.style.display=='')
scontentsub.style.display='none'
else
scontentsub.style.display==''
}
function offdisplay(){
if (scontentsub.style.display=='none')
scontentsub.style.display=''
else
scontentsub.style.display=='none'
}
function staticize(){
w2=document.body.scrollLeft+leftpos
h2=document.body.scrollTop+toppos
scontentmain.style.left=w2
scontentmain.style.top=h2
}
window.onscroll=staticize
function GetWord()
{
var tr
}
function FindWord(w)
{
for (var i=0;i
if (WordList.options[i].text==w)
{
WordList.options[i].selected=true
Output.value=WordExpln[i]
RESULT.style.visibility="visible"
return true
}
return false
}
var canDrag=0,canGetWord=0
var oldtop=0,oldscrolltop=0
var WordExpln=new Array()
var G_xmlHTTP
document.onmousemove = GetWord
var NS4 = (document.layers);
var IE4 = (document.all);
var win = this;
var n = 0;
function findInPage(str)
{
var txt, i, found;
if (str == "")
return false;
if (NS4)
{
if (!win.find(str))
while(win.find(str, false, true))
n++;
else
n++;
if (n == 0) alert(str + " ... 您要找的文字不存在。
\n请试着输入页面中的关键字再次查找!\n \n 并且请注意,不要把“?”或“:”也输入查找!!!");
}
if (IE4)
{
txt = win.document.body.createTextRange();
for (i = 0; i
{
txt.moveStart("character", 1);
txt.moveEnd("textedit");
}
if (found)
{
txt.moveStart("character", -1);
txt.findText(str);
txt.select();
txt.scrollIntoView();
n++; }
else
{
if (n > 0)
{
n = 0;
findInPage(str);
}
else
alert(str + "... 您要找的文字不存在。
\n请试着输入页面中的关键字再次查找!\n \n 并且请注意,不要把“?”或“:”也输入查找!!!");
}
}
return false;
}
self.onError=null;
currentX = currentY = 0;
whichIt = null;
lastScrollX = 0; lastScrollY = 0;
NS = (document.layers) ? 1 : 0;
IE = (document.all) ? 1: 0;
希望本文所述对大家的javascript程序设计有所帮助。