***按钮特效***windows式样的按钮
把下列代码加到网页的<body></body>标签之间 从google下载我的照片管理软件<!--网页特效代码由驿站jojoo.net/ts提供!-->
要完成此效果需要两个步骤
第一步:把如下代码加入到<head>区域中
<script>
document.onmouseover = doover;
document.onmouseout= doout;
document.onmousedown = dodown;
document.onmouseup = doup;
function doover() {
var toel = getreal(window.event.toelement, "classname", "coolbutton");
var fromel = getreal(window.event.fromelement, "classname", "coolbutton");
if (toel == fromel) return;
var el = toel;
var cdisabled = el.cdisabled;
cdisabled = (cdisabled != null); // if cdisabled atribute is present
if (el.classname == "coolbutton")
el.onselectstart = new function("return false");
if ((el.classname == "coolbutton") && !cdisabled) {
makeraised(el);
makegray(el,false);
}
}
function doout() {
var toel = getreal(window.event.toelement, "classname", "coolbutton");
var fromel = getreal(window.event.fromelement, "classname", "coolbutton");
if (toel == fromel) return;
var el = fromel;
var cdisabled = el.cdisabled;
cdisabled = (cdisabled != null); // if cdisabled atribute is present
var ctoggle = el.ctoggle;
toggle_disabled = (ctoggle != null); // if ctoggle atribute is present
if (ctoggle && el.value) {
makepressed(el);
makegray(el,true);
}
else if ((el.classname == "coolbutton") && !cdisabled) {
makeflat(el);
makegray(el,true);
}
}
function dodown() {
el = getreal(window.event.srcelement, "classname", "coolbutton");
var cdisabled = el.cdisabled;
cdisabled = (cdisabled != null); // if cdisabled atribute is present
if ((el.classname == "coolbutton") && !cdisabled) {
makepressed(el)
}
}
function doup() {
el = getreal(window.event.srcelement, "classname", "coolbutton");
var cdisabled = el.cdisabled;
cdisabled = (cdisabled != null); // if cdisabled atribute is present
if ((el.classname == "coolbutton") && !cdisabled) {
makeraised(el);
}
}
function getreal(el, type, value) {
temp = el;
while ((temp != null) && (temp.tagname != "body")) {
if (eval("temp." + type) == value) {
el = temp;
return el;
}
temp = temp.parentelement;
}
return el;
}
function findchildren(el, type, value) {
var children = el.children;
var tmp = new array();
var j=0;
for (var i=0; i<children.length; i++) {
if (eval("children." + type + "==\"" + value + "\"")) {
tmp = children;
}
tmp = tmp.concat(findchildren(children, type, value));
}
return tmp;
}
function disable(el) {
if (document.readystate != "complete") {
window.settimeout("disable(" + el.id + ")", 100); // if document not finished rendered try later.
return;
}
var cdisabled = el.cdisabled;
cdisabled = (cdisabled != null); // if cdisabled atribute is present
if (!cdisabled) {
el.cdisabled = true;
el.innerhtml = '<span style="background: buttonshadow; width: 100%; height: 100%; text-align: center;">' +
'<span style="filter:mask(color=buttonface) dropshadow(color=buttonhighlight, offx=1, offy=1, positive=0); height: 100%; width: 100%%; text-align: center;">' +
el.innerhtml +
'</span>' +
'</span>';
if (el.onclick != null) {
el.cdisabled_onclick = el.onclick;
el.onclick = null;
}
}
}
function enable(el) {
var cdisabled = el.cdisabled;
cdisabled = (cdisabled != null); // if cdisabled atribute is present
if (cdisabled) {
el.cdisabled = null;
el.innerhtml = el.children.children.innerhtml;
if (el.cdisabled_onclick != null) {
el.onclick = el.cdisabled_onclick;
el.cdisabled_onclick = null;
}
}
}
function addtoggle(el) {
var cdisabled = el.cdisabled;
cdisabled = (cdisabled != null); // if cdisabled atribute is present
var ctoggle = el.ctoggle;
ctoggle = (ctoggle != null); // if ctoggle atribute is present
if (!ctoggle && !cdisabled) {
el.ctoggle = true;
if (el.value == null)
el.value = 0; // start as not pressed down
if (el.onclick != null)
el.ctoggle_onclick = el.onclick; // backup the onclick
else
el.ctoggle_onclick = "";
el.onclick = new function("toggle(" + el.id +"); " + el.id + ".ctoggle_onclick();");
}
}
function removetoggle(el) {
var cdisabled = el.cdisabled;
cdisabled = (cdisabled != null); // if cdisabled atribute is present
var ctoggle = el.ctoggle;
ctoggle = (ctoggle != null); // if ctoggle atribute is present
if (ctoggle && !cdisabled) {
el.ctoggle = null;
if (el.value) {
toggle(el);
}
makeflat(el);
if (el.ctoggle_onclick != null) {
el.onclick = el.ctoggle_onclick;
el.ctoggle_onclick = null;
}
}
}
function toggle(el) {
el.value = !el.value;
if (el.value)
el.style.background = "url(/images/tileback.gif)";
else
el.style.backgroundimage = "";
// doout(el);
}
function makeflat(el) {
with (el.style) {
background = "";
border = "1px solid buttonface";
padding = "1px";
}
}
function makeraised(el) {
with (el.style) {
borderleft = "1px solid buttonhighlight";
borderright= "1px solid buttonshadow";
bordertop = "1px solid buttonhighlight";
borderbottom = "1px solid buttonshadow";
padding = "1px";
}
}
function makepressed(el) {
with (el.style) {
borderleft = "1px solid buttonshadow";
borderright= "1px solid buttonhighlight";
bordertop = "1px solid buttonshadow";
borderbottom = "1px solid buttonhighlight";
paddingtop = "2px";
paddingleft = "2px";
paddingbottom = "0px";
paddingright= "0px";
}
}
function makegray(el,b) {
var filtval;
if (b)
filtval = "gray()";
else
filtval = "";
var imgs = findchildren(el, "tagname", "img");
for (var i=0; i<imgs.length; i++) {
imgs.style.filter = filtval;
}
}
document.write("<style>");
document.write(".coolbar {background: buttonface;border-top: 1px solid buttonhighlight; border-left: 1px solid buttonhighlight; border-bottom: 1px solid buttonshadow; border-right: 1px solid buttonshadow; padding: 2px; font: menu;}");
document.write(".coolbutton {border: 1px solid buttonface; padding: 1px; text-align: center; cursor: default;}");
document.write(".coolbutton img {filter: gray();}");
document.write("</style>");
</script>
第二步:把如下代码加入到<body>区域中
<table class="coolbar">
<tr>
<td class="coolbutton"> <font size="3"><b><font color="#000000">home</font></b></font>
</td>
<td class="coolbutton"> <font size="3"><b><font color="#000000">link</font></b></font>
</td>
</tr>
</table>
--------------------------------------
拥有三人行论坛管理系列软件,一个人就可以管理一个论坛的更新维护。还能使您的论坛有千人在线的真实火暴效果,让您不在为论坛因没有人气而留不住会员而烦恼,使您的论坛早日成为一流的论坛。详情请登陆网站:http://www.cnsrx.cn 三人行论坛管理软件,站长必备的专业好工具。(您使用的是免费版本,购买收费版本后,将不带广告。业务QQ:247216 44985227)
页:
[1]