点击消失文本块简单而带有幻影效果

发布时间：2018-08-24 13:18 所属栏目：121 来源：站长网

导读：这是一款点击可让文本块消失的效果，简单而带有幻影，当img class=delete被单击， jQuery 找到div class=pane并修改其opacity值，慢速（slow）渐变到消失（hide），需要你的网页中加载了JQuery才可以哦。点击这里下载：jQuery.js。 !DOCTYPE html PUBLIC -

　　这是一款点击可让文本块消失的效果，简单而带有幻影，当<img class=”delete”>被单击，jQuery找到<div class=”pane”>并修改其opacity值，慢速（slow）渐变到消失（hide），需要你的网页中加载了JQuery才可以哦。点击这里下载：jQuery.js。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=GBK" /> <title>点击消失文本块简单而带有幻影效果 - liehuo.net</title> <script type="text/javascript" src="http://www.veryhuo.com/uploads/Common/jquery-1.3.2.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $(".pane .delete").click(function(){ $(this).parents(".pane").animate({ opacity: 'hide' }, "slow"); }); }); </script> <style type="text/css"> body { margin: 10px auto; width: 470px; } h3 { margin: 0; padding: 0 0 .3em; } p { margin: 0; padding: 0 0 .5em; } .pane { background: #edf5e1; padding: 10px 20px 10px; position: relative; border-top: solid 2px #c4df9b; } .pane .delete { position: absolute; top: 10px; right: 10px; cursor: pointer; } </style> </head> <body> <div class="pane"> <h3>微软计划推迟发布<b><b>Visual Studio</b> 2010</b>时间</h3> <p>微软将推迟发布Visual Studio 2010和.<b>NET Framework</b> 4等软件以便有更多的时间解决性能问题.微软星期五称,它计划在明年2月发布这些软件的额外的测试版本,也就是候选发布版.同时,这个工具集的工程团队将把重点放在改善性能方面.详细：http://www.veryhuo.com/a/view/11675.html</p> <img src="http://www.veryhuo.com/uploads/allimg/091221/btn-delete.gif" alt="delete" class="delete" /> </div> <div class="pane"> <h3>不断更换虚拟主机对网站排名的影响</h3> <p>最近因为服务器被封，而造成网站打不开、不稳定现象想必受此影响的站长们应该是身受其害吧。对做网站优化的站长来说这一段时间可能是不好过的日子。网站打不开，对做网站优化的朋友是最心急的事情，为什么呢?网站打不开你所做优化就会受大最大的影响，如果一天、两天网站打不开...文章源自：烈火网，原文：http://www.veryhuo.com/a/view/11673.html</p> <img src="http://www.veryhuo.com/uploads/allimg/091221/btn-delete.gif" alt="delete" class="delete" /> </div> <div class="pane"> <h3>网站site网址不在首页该怎么办？</h3> <p>百度推出的凤巢计划掀起的血雨腥风已经慢慢平息了，前期刚刚推出的时候众多的网站site:发现首页已经没有在第一了，为什么网站site:首页不在第一，但是很多关键词排名都没有较大的降低。文章源自：烈火网，原文：http://www.veryhuo.com/a/view/11674.html</p> <img src="http://www.veryhuo.com/uploads/allimg/091221/btn-delete.gif" alt="delete" class="delete" /> </div> <div class="pane"> <h3>最新消息：空闲域名被建议中止停放页面</h3> <p>根据CNNIC发布的《关于进一步加强域名注册信息审核工作的公告》的相关规定，注册域名只允许企业注册，我们建议用户尽快做好模板的重新设置，避免影响新域名的注册以及今后已注册域名的续费可能出现的问题。文章源自：烈火网，原文：http://www.veryhuo.com/a/view/11660.html</p> <img src="http://www.veryhuo.com/uploads/allimg/091221/btn-delete.gif" alt="delete" class="delete" /> </div> <div class="pane"> <h3>IE反垄断方案存在隐患或受黑客利用遭攻击</h3> <p>据国外媒体报道，有分析师日前表示，微软与欧盟达成的IE反垄断解决方案存在安全隐患，有可能被黑客利用发动攻击。欧盟周三宣布，已接受微软对<b>IE浏览器</b>的修改方案，从而结束了对IE的长期反垄断调查。文章源自：烈火网，原文：http://www.veryhuo.com/a/view/11659.html</p> <img src="http://www.veryhuo.com/uploads/allimg/091221/btn-delete.gif" alt="delete" class="delete" /> </div> </body> </html> <br /><center>如不能显示效果，请按Ctrl+F5刷新本页，更多网页代码：<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></center>
提示：运行后请刷新显示效果!

（编辑：ASP站长网）

点击消失文本块 简单而带有幻影效果

点击消失文本块简单而带有幻影效果