网页有趣的按钮特效

2013-10-03 20:28:50 -0400

转自网页教学网

<script>
var examp01="";
var examp02="";
var examp07="";
var examp07add="";
var basetemp=0;
</script><br>
１、按钮字会动<br>
<button onclick="examp01='例子1';examp02='例子2';alert(examp01+='按钮中的字会动')"><marquee behavior=alternate >按钮字会动</marquee></button><p>
２、按钮中随意写文章<br>
<button onclick="alert(examp01+'可'+examp02+'更牛逼,还有文章呢!')"><pre><br><div width=80% align=left>baiduspider是<a href="http://www.baidu.com" title="喝,还有超链接呢" target=_blank>百度</a>搜索引擎的一个自动程序。<br>它的作用是访问互联网上的html网页，建立<br>索引数据库，使用户能在百度搜索引擎中搜索<br>到您网站的网页。</div><br></pre></button><p>
３、竖按钮<br>
<button onclick=alert('竖按钮')>你<br>好</button><p>
４、按钮中加图片<br>
<button onclick=alert('按钮中图片')><img src=/files/allimg/081026/2326550.gif><img src=/files/allimg/081026/2326551.gif><img src=/files/allimg/081026/2326552.gif></button><p>‡.按钮背景颜色<br>
<button style="BACKGROUND-COLOR: #9cc5f8;">你好</button><p>
６、按钮中套按钮<br>
<button onclick=alert('我是外按钮')><table><button onclick=alert('我是内按钮')>ok</button></table></button><p>
<button onclick=alert('我罩着你')>内按钮上方<table><button onclick=alert('誰罩着我?')>按钮中间</button></table>内按钮下方</button><p>
<button ><marquee behavior=alternate><button><marquee behavior=alternate direction=right><button>按钮中间</button></marquee></button></marquee></button><p>
７、按钮中加表格<br>
<button onclick=alert('3x3表格')><table border=1><tr><td>11</td><td>12</td><td>13</td></tr><tr><td>21</td><td>22</td><td>23</td></tr><tr><td>31</td><td>32</td><td>33</td></tr></table></button><p>
<button onclick="if( basetemp==1){alert('我是老大,你call过偶小弟:'+examp07add);examp07add='';}else{alert('小样直接找我就说^_^')};basetemp=0;"><table border=0><tr><td><button onclick="examp07add=examp07add+'\,'+this.innerHTML;examp07=this.innerHTML;basetemp=1;alert('偶是小弟'+examp07+',找老大要等')">11</button></td><td><button onclick="examp07add=examp07add+'\,'+this.innerHTML;examp07=this.innerHTML;basetemp=1;alert('偶是小弟'+examp07+',找老大要等')">12</button></td><td><button onclick="examp07add=examp07add+'\,'+this.innerHTML;examp07=this.innerHTML;basetemp=1;alert('偶是小弟'+examp07+',找老大要等')">13</button></td></tr><tr><td><button onclick="examp07add=examp07add+'\,'+this.innerHTML;examp07=this.innerHTML;basetemp=1;alert('偶是小弟'+examp07+',找老大要等')">21</button></td><td><button onclick="examp07add=examp07add+'\,'+this.innerHTML;examp07=this.innerHTML;basetemp=1;alert('偶是小弟'+examp07+',找老大要等')">22</button></td><td><button onclick="examp07add=examp07add+'\,'+this.innerHTML;examp07=this.innerHTML;basetemp=1;alert('偶是小弟'+examp07+',找老大要等')">23</button></td></tr><tr><td><button onclick="examp07add=examp07add+'\,'+this.innerHTML;examp07=this.innerHTML;basetemp=1;alert('偶是小弟'+examp07+',找老大要等')">31</button></td><td><button onclick="examp07add=examp07add+'\,'+this.innerHTML;examp07=this.innerHTML;basetemp=1;alert('偶是小弟'+examp07+',找老大要等')">32</button></td><td><button onclick="examp07add=examp07add+'\,'+this.innerHTML;examp07=this.innerHTML;basetemp=1;alert('偶是小弟'+examp07+',找老大要等')">33</button></td></tr></table></button><p>

演示：

１、按钮字会动

２、按钮中随意写文章

３、竖按钮

４、按钮中加图片

‡.按钮背景颜色

６、按钮中套按钮

７、按钮中加表格

«Newer Older»

Back to home

Subscribe | Register | Login | N