JavaScript经典效果收藏

  荧 光 效 果

.荧 光 效 果


< span id = " theText "  style = " width:100% " >
< h1 >< font size = " 2 " > 用户名: </ font ></ h1 >
</ span >  

< script language = " JavaScript " >
<!--

function  SymError()
... {
  return true;
}

window.onerror  =  SymError;

// -->
</ script >

< script >
<!--
var  from  =   1 ;
var  to  =   4 ;
var  delay  =   55 ;  // 闪的速度
var  glowColor  =   " #FFCC00 " ; // 颜色
var  i  =  to;
var  j  =   0 ;
textPulseDown();

function  textPulseUp()
... {
if (!document.all)
return
if (i < to)
...{
theText.style.filter = "Glow(Color=" + glowColor + ", Strength=" + i + ")";
i++;
theTimeout = setTimeout('textPulseUp()',delay);
return 0;
}
if (i = to)
...{
theTimeout = setTimeout('textPulseDown()',delay);
return 0;
}
}

function  textPulseDown()
... {
if (!document.all)
return
if (i > from)
...{
theText.style.filter = "Glow(Color=" + glowColor + ", Strength=" + i + ")";
i--;
theTimeout = setTimeout('textPulseDown()',delay);
return 0;
}

if (i = from)
...{
theTimeout = setTimeout('textPulseUp()',delay);
return 0;
}
}

// -->
</ script >

 

模仿图片透明渐变

 

< HTML >
< HEAD >
< TITLE > dancepower.cn </ TITLE >
< SCRIPT language = JavaScript >  
//  Flash table Extension for Dreamwever ,by dio(diopex@sina.com)
nereidFadeObjects  =   new  Object();
nereidFadeTimers  =   new  Object();
function  nereidFade(object, destOp, rate, delta) ... {
if (!document.all)
return
    if (object != "[object]")...{  //do this so I can take a string too
        setTimeout("nereidFade("+object+","+destOp+","+rate+","+delta+")",0);
        return;
    }
    clearTimeout(nereidFadeTimers[object.sourceIndex]);
    diff = destOp-object.filters.alpha.opacity;
    direction = 1;
    if (object.filters.alpha.opacity > destOp)...{
        direction = -1;
    }
    delta=Math.min(direction*diff,delta);
    object.filters.alpha.opacity+=direction*delta;
    if (object.filters.alpha.opacity != destOp)...{
        nereidFadeObjects[object.sourceIndex]=object;
        nereidFadeTimers[object.sourceIndex]=setTimeout("nereidFade(nereidFadeObjects["+object.sourceIndex+"],"+destOp+","+rate+","+delta+")",rate);
    }
}

</ SCRIPT >
</ HEAD >
< BODY text = # 000000  bgColor = #ffffff leftMargin = 0  topMargin = 0  marginheight = " 0 "  
marginwidth = " 0 " >
< TABLE height = " 100% "  cellSpacing = 0  cellPadding = 0  width = " 100% "  border = 0 >
   < TBODY >
   < TR >
     < TD align = middle >
       < TABLE borderColor = #ffffff height = 100  cellSpacing = 1  cellPadding = 1  
      width = 100  align = center bgColor = # 000033  border = 1 >
         < TBODY >
         < TR align = middle >
           < TD onmouseover = nereidFade( this , 100 , 10 , 5 ) 
          style = " FILTER: alpha(opacity=70) "  onmouseout = nereidFade( this , 50 , 10 , 5 ) 
          bgColor = #00ccff >< FONT face = verdana color = #ffffff 
size = 1 > dio </ FONT ></ TD >
           < TD onmouseover = nereidFade( this , 100 , 10 , 5 ) 
          style = " FILTER: alpha(opacity=70) "  onmouseout = nereidFade( this , 50 , 10 , 5 ) 
          bgColor = #ff9900 >< FONT face = verdana color = #ffffff 
        size = 1 > pex </ FONT ></ TD ></ TR >
         < TR align = middle >
           < TD onmouseover = nereidFade( this , 100 , 10 , 5 ) 
          style = " FILTER: alpha(opacity=70) "  onmouseout = nereidFade( this , 50 , 10 , 5 ) 
          bgColor = #ff3399 >< FONT face = verdana color = #ffffff 
size = 1 > pex </ FONT ></ TD >
           < TD onmouseover = nereidFade( this , 100 , 10 , 5 ) 
          style = " FILTER: alpha(opacity=70) "  onmouseout = nereidFade( this , 50 , 10 , 5 ) 
          bgColor = #33ff66 >< FONT face = verdana color = #ffffff 
        size = 1 > dio </ FONT ></ TD ></ TR ></ TBODY ></ TABLE ></ TD ></ TR ></ TBODY ></ TABLE ></ BODY ></ HTML >

 

无图片实现圆角

 

< style type = " text/css " >
div.RoundedCorner ... {background: #9BD1FA}
b.rtop, b.rbottom ... {display:block;background: #FFF}
b.rtop b, b.rbottom b ... {display:block;height: 1px;overflow: hidden; background: #9BD1FA}
b.r1 ... {margin: 0 5px}
b.r2 ... {margin: 0 3px}
b.r3 ... {margin: 0 2px}
b.rtop b.r4, b.rbottom b.r4 ... {margin: 0 1px;height: 2px}
</ style >

< div class = " RoundedCorner " >
< b class = " rtop " >< b class = " r1 " ></ b >< b class = " r2 " ></ b >< b class = " r3 " ></ b >< b class = " r4 " ></ b ></ b >
< br > 无图片实现圆角框 < br >< br >
< b class = " rbottom " >< b class = " r4 " ></ b >< b class = " r3 " ></ b >< b class = " r2 " ></ b >< b class = " r1 " ></ b ></ b >
</ div >

文字幻灯片

<! DOCTYPE html PUBLIC  " -//W3C//DTD XHTML 1.0 Transitional//EN "   " <a href= " http: // www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" target="_blank">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">
< html xmlns = " <a href= " http: // www.w3.org/1999/xhtml" target="_blank">http://www.w3.org/1999/xhtml</a>">
< head >
< title > 51du.cn - 代码演示专用页面 </ title >
< style type = " text/css " >
.trans  ... {filter:revealTrans(Transition=12,Duration=2)}
</ style >
</ head >
< body >
< script language = " JavaScript " >
Text  =   new  Array(
     " <a href='<a href= " http: // www.51du.cn" target="_blank">http://www.51du.cn</a>' target='_blank' class='cr4'>班级留言“说”出口，校友录开通语音留言服务</a>",
     " <a href='<a href= " http: // www.51du.cn" target="_blank">http://www.51du.cn</a>' class='cr4'>星级会员新体验,享受无广告的清新校友录</a>",
     " <a href='<a href= " http: // www.51du.cn" target="_blank">http://www.51du.cn</a>' target='_blank' class='cr4'>星级会员免费多彩留言,表情,贴图,个性无限...</a>",
     " <a href='<a href= " http: // www.51du.cn" target="_blank">http://www.51du.cn</a>' target='_blank' class='cr4'>星级会员免费留言下载,导出更多昔日记忆</a>",
     " <a href='<a href= " http: // www.51du.cn" target="_blank">http://www.51du.cn</a>' target='_blank' class='cr4'>在5千万用户中脱颖而出,我是星级会员</a>"
)
var  IDX =   - 1 ;
function  playAd()  ... {
    if (IDX==Text.length-1) ...{
        IDX=0;
    } else ...{
        IDX++;
    }
    var prefix = "";
    divText.filters[0].apply();
    divText.innerHTML = prefix + Text[IDX];
    divText.filters[0].play();
    to = setTimeout("playAd()",6000);
}
</ script >
< table width = 453  border = 0  cellspacing = 3  cellpadding = 0 >
           < tr bgcolor = CCF4B9 >  
             < td height = 24  bgcolor = CCF4B9 id = divText class = trans ></ td >
           </ tr >
       < script > playAd() </ script >
  </ table >
</ body >
</ html >

将HTML自动转为JS代码

 

< script >
function  toScript(val)
... {
 var value = val.value
 value  = value.replace(///gi,"//").replace(/"/gi,"/"").replace(/'/gi,"/'")
 valArr = value.split(" ")
 value=""
 
 for (i=0; i<valArr.length; i++)
 {
  value += (i==0) ? "info =" : ""
  value += "  "" + valArr[i]
  value += (i!=valArr.length-1) ? "" +"/n"+ " : "" " 
 }
 value+=" document.write(info)"
 
 val.value = value
}
</script> 
<input type=button value="将 HTML 转为 JavaScript" οnclick=toScript(document.all["code"])><br>
<textarea id=code cols=75 rows=20>
<table width="300">
<tr><td align="right">A</td></tr>
</table></textarea>