模板无忧
网页特效
每日更新
|
TOP排行榜
|
Tag标签
|
充值
无忧首页
网页模板
程序模板
建站教程
视频教程
网页特效
图标素材
字体下载
站长工具
站长问答
网页特效
菜单导航
图片特效
文本链接
层和布局
页面背景
表单按钮
日期时间
计算转换
键盘鼠标
浏览器
游戏娱乐
综合其它
常用代码
jQuery特效
Prototype
Ajax/JavaScript
ExtJS
CSS特效
在线编辑器
Mootools
HTML
JS广告代码合集
站长工具
站长常用软件
网站综合查询
Alexa排名查询
Google PR查询
域名Whois查询
网站收录查询
友情链接查询
CSS2中文手册
CSS精简优化工具
网页特效代码
模板无忧
>
网页特效
>
文本链接特效代码
>
收藏
分享
查看评论
文本链接
演示
链接内容可以点击的文字提示_文本链接特效
查看演示效果
特效Tag:
链接提示
添加
链接内容可以点击的文字提示
<!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" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" mrc="text/html; charset=gb2312" /> <meta name="author" mrc="宇,zy.e@163.com" /> <title>w3css.com</title> <style type="text/css"> <!-- body { background:#F4F8FF; margin: 0px; font: 12px/130% arial,宋体,verdana,sans-serif;color: #000; padding: 0px; } li{ list-style:none; } *{ margin: 0; padding: 0; } .fenlei{height:50px; width: 300px; padding: 5px; line-height: 30px;margin-top: 20px;} .fenleiul { float:left;} .fenleiul li{ width: 101px;float: left;height: 30px; padding-left:12px;} .fenleiul li a{ display:block; width: 101px; background: url(http://www.w3css.com/down/ico1.gif) 1px 11px no-repeat; line-height: 30px; float: left; padding-left:12px; color: #069; text-decoration:none; } .fenleiul li a:visited{ background: url(http://www.w3css.com/down/ico2.gif) 1px 11px no-repeat; color: #069;} .fenleiul li a:hover{ background: url(http://www.w3css.com/down/ico.gif) 1px 11px no-repeat;color: #FF4500;} .postitle{filter:alpha(opacity=80);-moz-opacity:0.8;opacity: 0.8; background: url(http://www.w3css.com/down/jt.gif) 0 -10px no-repeat; margin-top: -12px; float:left;margin-left:70px;*margin-left:-40px; position:absolute;} .type{line-height: 16px; float: left; clear: both; background: #D9F6FF; width:120px; margin-left:21px;padding:3px; overflow: hidden; border: solid 1px #9EB6D8; border-left:none;} .fenlei .type a{ clear:both;background-image:none; padding-left:0;line-height: 16px;} .type a:link{color:#004A75;} .type a:visited{ color:#333;} .fenlei .type a:hover{ color:#DC143C;background-image:none;} .flnone{ display:none; } --> </style> </head> <body> <div class="fenlei" > <ul class="fenleiul" id="listyle"> <li><a href="/soft/1900.html" >暗黑之门</a><div class="flnone"><span class="type">最新客户端:<a href="1#">劲乐团圣诞童话</a><br /><a href="1#">劲乐团圣诞童话</a></span></div></li> <li><a href="/soft/1900.html">宝贝坦克x</a><div class="flnone"><span class="type">最新客户端:<a href="#">劲乐团圣诞童话1</a></span></div></li> <li><a href="/soft/1900.html">超级武林大富</a><div class="flnone"><span class="type">最新客户端:<a href="#">劲乐团圣诞童话1</a></span></div></li> <li><a href="/soft/1900.html">魔力宝贝Ⅱ</a><div class="flnone"><span class="type">最新客户端:<a href="#">劲乐团圣诞童话1</a></span></div></li> <li><a href="/soft/1900.html">神泣(Shaiya)</a><div class="flnone"><span class="type">最新客户端:<a href="#">劲乐团圣诞童话1</a></span></div></li> <li><a href="/soft/1900.html">奇迹世界(SUN)</a><div class="flnone"><span class="type">最新客户端:<a href="#">劲乐团圣诞童话1</a></span></div></li> </ul> </div> <script type="text/javascript"> var listyle = document.getElementById("listyle") var lis = listyle.getElementsByTagName("li"); var divs = listyle.getElementsByTagName("div"); for (var tn = 0; tn < lis.length; tn++) { lis[tn].tn = tn; lis[tn].onmouseover = show; lis[tn].onmouseout = unshow; } function unshow() { for (var i = 0; i < divs.length; i++) { divs[i].className = "flnone"; } } function show(tn) { unshow(); divs[this.tn].className = "postitle"; } </script> </body> </html>
所属频道:
文本链接特效
/
更新时间:2012-12-07
[收藏]
[报错]
[返回列表]
相关
文本链接特效
:
后退无效的链接
一种隐藏URL的方法 (并是弹出无边窗口)
随机动态的链接Title提示
表单多选框中列出全部链接点击跳转
一个链接打开两个链接地址(新开窗口和当前窗口)
鼠标onmouse链接时复选框的状态变为checked
多个div层显示隐藏及切换
引用文章链接代码
信息框显示链接
点击链接后跳出一个链接说明小窗口
比较实用的CSS控制连接颜色效果
超链接或按钮的跳马灯式说明文字
文本链接特效Rss订阅
特效代码搜索
文本链接特效推荐
JavaScript文字遮罩效果
文字滚动上楼梯、爬格子
随机动态的链接Title提示
JS让文字反向显示
CSS动态的链接提示
显示网页上所有超链接的按钮
字体效果
滚动新闻
让链接分顺序,必须先点击其它链接,类似广告效果
三行文字成批间隙滚动的走马灯效果
猜你也喜欢看这些
CSS让文字半透明显示在图片上
JS弹出可定时关闭的层
DIV对齐而已实例
JavaScript文章列表的拖拽排序
超酷的CSS列表排行榜
动画展层、关闭层并拖动
Ajax弹出漂亮可拖动的提示层(窗)效果
Div+CSS三行排列自适应宽度代码
特殊字符实现的CSS圆角
未知高度的div垂直居中多浏览器方法
相关链接:
复制本页链接
|
搜索链接内容可以点击的文字提示
特效说明:
文本链接模板
-
链接内容可以点击的文字提示
。