DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> Javascript制作浮動的工具條
Javascript制作浮動的工具條
編輯:關於JavaScript     
該程序是我從別人的網站上分析出來的!由於對方的網站使用了框架,而且又取消了鼠標的右鍵功能,因此費了好長時間!
當你浏覽該頁時,工具條始終浮在左上角,你若不喜歡,可以自己調節擺放位置!若想多頁使用該代碼,可以把JSP程序部分寫成JS的文件,然後再通過調用來實現,有不明白的地方,歡迎各位與我交流!
演示地址:http://www.85time.com/softuse/bar.htm
<HTML>
<HEAD>
<TITLE></TITLE>
<META http-equiv="Content-Type" content="text/html; charset=gb2312">
<STYLE type="text/CSS">
.wdBlack{ font-size:9pt; line-height:11pt; font-family:宋體; color:black }
.wdGray{ font-size:9pt; line-height:11pt; font-family:宋體; color:#CCCCCC }
.wdBlue{ font-size:9pt; line-height:11pt; font-family:宋體; color:#2F8BDF }
.wdRed{ font-size:9pt; line-height:11pt; font-family:宋體; color:red }
.wdWhite{ font-size:9pt; line-height:11pt; font-family:宋體; color:white }
.moveme{cursor: move;}
.handle{cursor: move;}
.coolBar{background: #fffffc;border-top: 1px solid buttonhighlight; border-left: 1px solid buttonhighlight; border-bottom: 1px solid buttonshadow; border-right: 1px solid buttonshadow; padding: 2px; font: menu;}
.coolButton{font-size:9pt;border: 1px solid buttonface; padding: 1px; text-align: center; cursor: hand;color:#555555}
.coolButton IMG {filter: gray();} div{ font-size:9pt; line-height:11pt; font-family:宋體; color:black }
Text{ font-size:9pt; line-height:11pt; font-family:宋體; color:black }
INPUT{ font-size:9pt; line-height:11pt; font-family:宋體; color:black }
table{ font-size:9pt; line-height:11pt; font-family:宋體; color:black }
body{ font-size:9pt; line-height:11pt; font-family:宋體; color:black }
form{ font-size:9pt; line-height:11pt; font-family:宋體; color:black }

A:link{ font-size:9pt; font-family:宋體; text-decoration: none; color:#2F8BDF }
A:visited{ font-size:9pt; font-family:宋體; text-decoration: none; color:#2F8BDF }
A:hover{ font-size:9pt; font-family:宋體; text-decoration: underline; color:#FF0000 }
</STYLE>

<script language="javascript">
var dragobject = null;
var tx;
var ty;
document.onmouseover = doOver;
document.onmouseout = doOut;
document.onmousedown = doDown;
document.onmouseup = doUp;
document.onmousedown=initDown;
document.onmouseup=initUp;
document.onmousemove=initMove;
function stat(){
var a = pageYOffset;
document.bar.top = a;
setTimeout('stat()',2);
}
function fix(){
nome=navigator.appName
if(nome=='Netscape') stat();
else{
var a=document.body.scrollTop;
var b=document.body.scrollLeft;
bar.style.top = a;
bar.style.left = b;
}
}
function getReal(el) {
temp = el;
while ((temp != null) && (temp.tagName != "BODY")) {
if ((temp.className == "moveme") || (temp.className == "handle")){
el = temp;
return el;
}
temp = temp.parentElement;
}
return el;
}
function moveme_onmousedown() {
el = getReal(window.event.srcElement)
if (el.className == "mov

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved