翔 的个人资料奥翔照片日志列表更多  |  工具 帮助 |
|
|
运行代码功能JS文件代码
--------------------------------------------------- function runEx(cod1) { cod=document.all(cod1) var code=cod.value; if (code!=""){ var newwin=window.open('','',''); //打开一个窗口并赋给变量newwin。 newwin.opener = null // 防止代码对页面修改 newwin.document.write(code); //向这个打开的窗口中写入代码code，这样就实现了运行代码功能。 newwin.document.close(); } } //复制文本域代码
function cycode(obj) { var rng = document.body.createTextRange(); rng.moveToElementText(obj); rng.scrollIntoView(); rng.select(); rng.execCommand("Copy"); window.status="高亮度包含的代码已被复制到剪贴板！Contents highlighted and copied to clipboard!" setTimeout("window.status=''",1800) rng.collapse(false); } //另存代码 function svcode(obj) { var winname = window.open('', '_blank', 'top=10000'); winname.document.open('text/html', 'replace'); winname.document.writeln(obj.value); winname.document.execCommand('saveas','','code.htm'); winname.close(); } --------------------------------------------------- 在<head>..</head>中调用JS文件. --------------------------------------------------- <script language="javascript" src="runcode.js"></script> --------------------------------------------------- 下面是运行代码调用 --------------------------------------------------- <P align=center><TEXTAREA class=fm id=code5 rows=12 cols=78>代码初始值</TEXTAREA></P> <P><INPUT style="CURSOR: hand" onfocus=this.blur() onclick="runEx('code5')" type=button value=运行代码> [Ctrl+A 全选,提示:你可修改代码后运行] </P> --------------------------------------------------- 鼠标滑过图片时实现图片不透明到透明将下面的代码加入<head>....</head>中
<SCRIPT language=JavaScript>
function fade_in(which){ theobject=which highlighting=setInterval("highlightit(theobject)",50) } function fade_out(which){ clearInterval(highlighting) which.filters.alpha.opacity=40 } function highlightit(cur){ if (cur.filters.alpha.opacity<100) cur.filters.alpha.opacity+=20 else if (window.highlighting) clearInterval(highlighting) } </SCRIPT> 下载是图片调用代码 <img src="01.jpg" alt="图片说明" width="122" height="70" longdesc="http://www.ao-xiang.net" onmouseout=fade_out(this); onmouseover=fade_in(this); style="FILTER:alpha(opacity=40)" />
参考代码 下面我们举一个简单的例子，浏览时会出现这样的一个效果：网页上有一个几乎透明的图像，当鼠标移到图像上时，图像慢慢变清晰；当鼠标移开时，图像又恢复到原来的透明状态。 要实现这个功能，需要使用到CSS的alpha滤镜，并用javascript来控制alpha滤镜的Opacity值，首现在网页中插入一个图片，并设定alpha滤镜的opacity值，让图片透明，图片代码为：<img src="/blog/a.gif" id="me" style="FILTER:alpha(Opacity=20)">. javascript代码如下： <script language="javascript"> function ch(n) { if(n=="add") //如果传入的参数为add，则将图片的不透明度增大 if(me.filters.alpha.Opacity<100) { me.filters.alpha.Opacity=me.filters.alpha.Opacity+5; setTimeout("ch('add')",10); } if(n=="dec") //如果传入的参数为dec，则将图片的不透明度降低 if(me.filters.alpha.Opacity>20) { me.filters.alpha.Opacity=me.filters.alpha.Opacity-5; setTimeout("ch('adc')",10); } } </script> 将上面的代码加入<head></head>中，然后给图片加入onMouseOver和onMouseOut动作，即<img src="/blog/a.gif" id="me" style="FILTER:alpha(Opacity=20)" onMouseOver="ch('add')" onMouseOut="ch('dec')">. 好了，关于CSS滤镜我们就介绍到这里，相信各位开动脑子，一定会做出更好的效果。 |
|
|
