码迷,mamicode.com
首页 > Web开发 > 详细

JS打造抖动的按钮特效(鼠标放上去开始抖动)

时间:2015-04-25 11:58:16      阅读:188      评论:0      收藏:0      [点我收藏+]

标签:

<HTML><HEAD>
<TITLE>JS打造抖动的按钮特效(鼠标放上去开始抖动)_石家庄水泵厂|草坪销售</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
</HEAD>
<BODY bgColor=#fef4d9><BR><BR>
<CENTER>鼠标抖动的按钮</span>
</CENTER><BR>
<CENTER>
<TABLE borderColor=#FFCC00 border=5 borderlight="green">
  <TBODY>
  <TR>
    <TD align=left>
      <SCRIPT language=JavaScript>
<!-- Begin
pos = 15;
TO = null;
function shake_funct2(object,speed)
{ 
  obj = eval(object)
  txt = clear_space(obj.value);
  if (pos == 15)
  {
   txt = txt + "   ";
   pos = -15;
  }
  else
  {
   txt = "   " + txt;
   pos = 15;
  }  
  obj.value = txt;
  obj.style.width = parseInt(obj.style.width) + pos;
  obj = object
  sp = speed
  TO = setTimeout("shake_funct2(obj,sp)",speed);
}

function clear_space(text)
{
 while (text.substring(0,1) == " ")
 {
  text = text.substring(1,text.length);
 }
 while(text.substring(text.length-1,text.length) == " ")
 {
  text = text.substring(0,text.length-1);
 }
 return text;
}

function end_shake_funct2(object)
{
  clearTimeout(TO);
  obj = eval(object);
  txt = clear_space(obj.value);
  obj.value = txt;
  //alert(pos);
  if (pos == -15)
  {
   obj.style.width = parseInt(obj.style.width) +15;
  }
  pos = 15
}
//  End -->
</SCRIPT>
      <FORM name=myform2>
      <TABLE border=0>
        <TBODY>
        <TR>
          <TD>一般抖动的按钮</TD>
          <TD align=middle width=160><INPUT onmouseover=shake_funct2(this,100) style="FONT-SIZE: 12px; WIDTH: 150px" onmouseout=end_shake_funct2(this) type=button value="一般速度"> 
          </TD></TR>
        <TR>
          <TD>快速抖动的按钮</TD>
          <TD align=middle width=160><INPUT onmouseover=shake_funct2(this,50) style="FONT-SIZE: 12px; WIDTH: 150px" onmouseout=end_shake_funct2(this) type=button value="更快速度"> 
  </TD></TR></TBODY></TABLE></FORM></TD></TR></TBODY></TABLE></CENTER>
<br>

</BODY>
</HTML>

 

JS打造抖动的按钮特效(鼠标放上去开始抖动)

标签:

原文地址:http://www.cnblogs.com/zhaozzm/p/4455556.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!