注册
登录
标签
在线时间兑换积分
帮助
精品酷站论坛
»
CSS代码交流
» 非常不错的鼠标hover效果
‹‹ 上一主题
|
下一主题 ››
发新话题
发布投票
发布商品
发布悬赏
发布活动
发布辩论
发布视频
打印
非常不错的鼠标hover效果
tension
管理员
个人空间
发短消息
加为好友
当前离线
1
#
大
中
小
发表于 2007-7-19 08:53
只看该作者
非常不错的鼠标hover效果
在IE6.0下这个效果有点普通，因为IE6.0不支持“+”
不过在Firefox下就能看到比较帅的效果了
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Pickbar.com 精品<span href="tag.php?name=%E9%85%B7%E7%AB%99" onclick="tagshow(event)" class="t_tag">酷站</span></title> <style type="text/<span href="tag.php?name=css" onclick="tagshow(event)" class="t_tag">css</span>"> ul#hovershow2{list-style-type:none;margin:50px;width:200px;float:left;display:inline;clear:both;}ul#hovershow2 li{float: left;display:inline;width:20px;height:20px;margin:2px;}ul#hovershow2 li a{text-decoration:none;display:block;width:20px;height:20px;border:1px red solid;background-color:White;line-height:20px;font-size:12px;text-align:center;}ul#hovershow2 li a:hover{position:absolute;width:40px;height:40px;line-height:40px;font-size:32px;z-index:100;margin:-10px 0 0 -10px;background:red;color:#fff;-moz-opacity:0.6;filter:Alpha(opacity=60);}ul#hovershow2 li:hover + li a{position:absolute;width:30px;height:30px;line-height:30px;font-size:24px;z-index:99;margin:-5px 0 0 -5px;background:red;color:#fff;-moz-opacity:0.6;} </style> </head> <body> <ul id="hovershow2"> <li><a href="1#" title="test"><span>1</span></a></li><li><a href="2#" title="test"><span>2</span></a></li><li><a href="3#" title="test"><span>3</span></a></li><li><a href="4#" title="test"><span>4</span></a></li><li><a href="5#" title="test"><span>5</span></a></li><li><a href="6#" title="test"><span>6</span></a></li><li><a href="7#" title="test"><span>7</span></a></li> </ul> </body> </html>
提示：您可以先修改部分代码再运行
UID
1
帖子
736
精华
25
积分
1923
阅读权限
200
在线时间
19 小时
注册时间
2007-5-26
最后登录
2008-12-4
查看详细资料
TOP
‹‹ 上一主题
|
下一主题 ››
设计人
插画
网页设计
摄影图片
平面设计
设计师加油
站务区
站务管理
娱乐其他
智力游戏
投资理财
娱乐时尚
IT风向标
社会新闻
灌水专区
娱乐八卦
资源共享区
酷站资源
提交酷站
PS笔刷/样式/滤镜&插件
开源软件
免费资源区
实用软件/手册
代码交流区
WEB2.0 / AJAX
ASP,PHP,JSP...
JS,UI框架开发
JQuery
mootools
ProtoType
DHTML eXtensions
CSS代码交流
控制面板首页
编辑个人资料
积分记录
公众用户组
个人空间管理
基本概况
版块排行
主题排行
发帖排行
积分排行
交易排行
在线时间
管理团队
393张高清晰web2.0站点截图
425款精品毛笔墨迹+38款墨迹底纹..
10位Master级别的Photoshop高手
绝对漂亮的笔刷
Soul 近期新作品欣赏..
熟女养成日志—长草
魔幻抽象/吸血鬼传说！！
photoshop仿CG滤镜
新手必看：积分、资源币、人民币、用户级别、发贴教程
设计QQ群:31195683
