coolbuttons.js

来自「JScript网页特效,包含很多的实现网页特效的方法.」· JavaScript 代码 · 共 132 行

document.onmouseover = doOver;
document.onmouseout  = doOut;
document.onmousedown = doDown;
document.onmouseup   = doUp;
//alert(document.onmouseover);
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;
  if (el.className == "coolButton")
  {
    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;
  if (el.className == "coolButton") 
  {
    makeFlat(el);
    makeGray(el,true);
  }
}

function doDown() 
{
  el = getReal(window.event.srcElement, "className", "coolButton");
  if (el.className == "coolButton")
  {
    makePressed(el)
  }
}

function doUp() 
{
  el = getReal(window.event.srcElement, "className", "coolButton");
  if (el.className == "coolButton")
  {
    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[i]." + type + "==\"" + value + "\"")) 
    {
      tmp[tmp.length] = children[i];
    }
    tmp = tmp.concat(findChildren(children[i], type, value));
  }
  return tmp;
}

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[i].style.filter = filtval;
  }
}