打印

大家来看看这个效果怎么样!

c_xiaobing [楼主]

中级会员

帖子: 161
体力: 287
威望: 3
离线: 61 天

1^# 大中小发表于 2006-10-8 20:24

<body>
<style type="text/css">
#home_tag {width: 200; height: 30; border-width: 1; border-color: black; border-style: solid; z-index: 10}
#home_label {width: 200; height: 30; position: absolute; top: 110; left: 200; z-index: 9}
#chiefs_tag {width: 200; height: 30; border-width: 1; border-color: black; border-style: solid; z-index: 12}
#chiefs_label {width: 200; height: 30; position: absolute; top: 110; left: 200; z-index: 11}
#members_tag {width: 200; height: 30; border-width: 1; border-color: black; border-style: solid; z-index: 14}
#members_label {width: 200; height: 30; position: absolute; top: 110; left: 300; z-index: 13}
#pictures_tag {width: 200; height: 30; border-width: 1; border-color: black; border-style: solid; z-index: 16}
#pictures_label {width: 200; height: 30; position: absolute; top: 110; left: 400; z-index: 15}
#links_tag {width: 200; height: 30; border-width: 1; border-color: black; border-style: solid; z-index: 18}
#links_label {width: 200; height: 30; position: absolute; top: 110; left: 500; z-index: 17}
</style>
<script language="JavaScript">

</script>
<div id="background_tag" style="background: red; width: 200; height: 30; position:absolute;top: 110; left: 200; z-index: 8"></div>
<div id="home_tag" onMouseOver="getOverIt(home_tag);" style="position: absolute; top: 110; left: 200"></div>
<div id="chiefs_tag" onMouseOver="getOverIt(chiefs_tag);" style="position: absolute; top: 110; left: 200"></div>
<div id="members_tag" onMouseOver="getOverIt(members_tag);" style="position: absolute; top: 110; left: 300"></div>
<div id="pictures_tag" onMouseOver="getOverIt(pictures_tag);" style="position: absolute; top: 110; left: 400"></div>
<div id="links_tag" onMouseOver="getOverIt(links_tag);" style="position: absolute; top: 110; left: 500"></div>

提示：您可以先修改部分代码再运行

本帖最近评分记录

hutia 威望 +1 原创内容 2006-10-8 22:56

http://hi.baidu.com/skyweb

TOP

做西部数码代理.Cn1元国际45元 | 将虚拟化进行到底

shoppingcat

初级会员

帖子: 80
体力: 186
威望: 1
离线: 343 天

2^# 大中小发表于 2006-10-8 20:36

可以有无限创意。。。

猫眼看人^^

TOP

【美橙超级G空间】688元绑定10个子目录 | oracle工程师注册

aniu419

初级会员

帖子: 119
体力: 63
威望: 0
当前: 北京丰台区
离线: 3 天

3^# 大中小发表于 2006-12-12 11:14

啥也看不到

TOP

请大家尊重和保护奥运知识产权。

lovelium

心飘逝

银牌会员

帖子: 1244
体力: 2145
威望: 11
当前: 广东深圳
离线: 3 天

专长 JS,C#,MSSQL

4^# 大中小发表于 2006-12-12 11:17

不错不错。创意无极限

心飘逝 http://www.szrgb.net

TOP

还在为头像烦恼?还在为不能关注好友动态烦忧?快来蓝色理想家园吧!

0yun123

纯真

银牌会员

帖子: 1397
体力: 1810
威望: 4
当前: 福建厦门
离线: 2 天

专长 网页设计,UI,策划

5^# 大中小发表于 2006-12-12 12:15

支持一下，没看源文件还以为是FLASH做的。

不过这种方式会不会比用FLASH做干浪费资源。

我的BLOG

TOP

xhb928

初级会员

帖子: 37
体力: 53
威望: 0
离线: 359 天

6^# 大中小发表于 2006-12-12 12:36

收藏掉了。

TOP

uestar

中级会员

帖子: 186
体力: 434
威望: 0
离线: 25 天

7^# 大中小发表于 2006-12-12 12:51

很有新意呢~~~赞

If I can,I can!
uestar.spaces.live.com

TOP

gandie

干爹

中级会员

帖子: 253
体力: 428
威望: 0
当前: 广东广州
离线: 11 天

8^# 大中小发表于 2006-12-12 13:13

路过，帮顶一下

设计自我,完美自我！

TOP

dodowork

新手上路

帖子: 9
体力: 22
威望: 0
离线: 14 天

9^# 大中小发表于 2006-12-12 14:02

虽然暂时不用

但是还要顶一下，东西很不错

TOP

liaozeming

中级会员

帖子: 207
体力: 474
威望: 0
离线: 2 天

10^# 大中小发表于 2006-12-12 15:15

你们没看出什么问题吗？/
如果把<div id="background_tag" style="background: red; width: 200; height: 30; position:absolute;top: 110; left: 200; z-index: 8"></div>
中的width:200px改成100px的话最后一个就不可以过去~~~

TOP

Sheneyan

子虚乌有

超级版主

帖子: 8267
体力: 19489
威望: 177
当前: 福建厦门
离线: 45 天

专长 JS,JAVA,Oracle

11^# 大中小发表于 2006-12-12 22:51

楼上的没理解楼主的代码吧。。。

实际上已经过去了

子叶:子乌的叶子
帅哥们，美女们，新的一年终于来了，祝贺你们...终于又老了一岁~

TOP

liucuqx

新手上路

帖子: 8
体力: 15
威望: 0
离线: 584 天

12^# 大中小发表于 2006-12-13 09:22

不错不错，支持一下

TOP

qiuqiukuaipao

球球快跑

初级会员

帖子: 85
体力: 85
威望: 0
离线: 38 天

13^# 大中小发表于 2006-12-19 02:51

很不错,不过这个可以做什么?

http://www.twdns.cc

TOP

MrShan

罐装曲奇

高级会员

帖子: 314
体力: 693
威望: 0
当前: 内蒙呼伦贝尔

专长 网页设计,前端制作,美编

14^# 大中小发表于 2006-12-19 05:07

不知道兼容FF/OPERA么~?

真是不错 ~~

免费图片上传存储

TOP

bmcsy

中级会员

帖子: 95
体力: 204
威望: 0
当前: 广东佛山
离线: 6 天

15^# 大中小发表于 2007-3-14 11:09

技术创意，赞

活着为了什么？

TOP

zilin

初级会员

帖子: 47
体力: 89
威望: 0

16^# 大中小发表于 2007-3-14 12:33

10楼的是不是想要这种效果,简单改一下就行了,呵呵!
楼主这个效果很不错,对我有用呢,我把它改成下面的效果了

<body>
<style type="text/css">
#home_tag {width: 100; height: 30; border-width: 1; border-color: black; border-style: solid; z-index: 10}
#home_label {width: 100; height: 30; position: absolute; top: 110; left: 200; z-index: 9}
#chiefs_tag {width: 100; height: 30; border-width: 1; border-color: black; border-style: solid; z-index: 12}
#chiefs_label {width: 100; height: 30; position: absolute; top: 110; left: 200; z-index: 11}
#members_tag {width: 100; height: 30; border-width: 1; border-color: black; border-style: solid; z-index: 14}
#members_label {width: 100; height: 30; position: absolute; top: 110; left: 300; z-index: 13}
#pictures_tag {width: 100; height: 30; border-width: 1; border-color: black; border-style: solid; z-index: 16}
#pictures_label {width: 100; height: 30; position: absolute; top: 110; left: 400; z-index: 15}
#links_tag {width: 100; height: 30; border-width: 1; border-color: black; border-style: solid; z-index: 18}
#links_label {width: 100; height: 30; position: absolute; top: 110; left: 500; z-index: 17}
</style>
<script language="JavaScript">

</script>
<div id="background_tag" style="background: red; width: 100; height: 30; position:absolute;top: 110; left: 200; z-index: 8"></div>
<div id="home_tag" onMouseOver="getOverIt(home_tag);" style="position: absolute; top: 110; left: 200"></div>
<div id="chiefs_tag" onMouseOver="getOverIt(chiefs_tag);" style="position: absolute; top: 110; left: 300"></div>
<div id="members_tag" onMouseOver="getOverIt(members_tag);" style="position: absolute; top: 110; left: 400"></div>
<div id="pictures_tag" onMouseOver="getOverIt(pictures_tag);" style="position: absolute; top: 110; left: 500"></div>
<div id="links_tag" onMouseOver="getOverIt(links_tag);" style="position: absolute; top: 110; left: 600"></div>

提示：您可以先修改部分代码再运行

TOP

walt2000

初级会员

帖子: 50
体力: 86
威望: 0
离线: 9 天

17^# 大中小发表于 2007-3-15 09:41

喜欢16楼的

TOP

ldgmc

初级会员

帖子: 73
体力: 144
威望: 0
离线: 170 天

18^# 大中小发表于 2007-3-15 09:52

很有创意

TOP

xwzsky

武者

中级会员

帖子: 162
体力: 291
威望: 0
离线: 11 天

19^# 大中小发表于 2007-3-15 17:22

好极了…………

TOP

csshtm

初级会员

帖子: 50
体力: 106
威望: 0
离线: 344 天

20^# 大中小发表于 2007-3-16 09:58

创意不错 ,而且兼容Firefox1.5 , 使区域讯息提示更活泼!

TOP

thirdteendevil

十三妖

高级会员

帖子: 257
体力: 617
威望: 2
当前: 北京西城区
离线: 3 天

专长 前端制作,JS

21^# 大中小发表于 2007-3-16 11:10

javascript ....呵呵。。。没事编个小东西也很有趣

TOP

piscdong

守分奴

钻石会员

帖子: 7661
体力: 5387
威望: 8
当前: 上海浦东
离线: 1 天

专长 JS,PHP,MySQL

22^# 大中小发表于 2007-3-16 11:14

16楼的效果更好

迷你同学录，欢迎试用
Canon S5

TOP

xiaoyuxiami

棉花团

中级会员

帖子: 126
体力: 243
威望: 0
离线: 406 天

23^# 大中小发表于 2007-3-16 11:20

不错不错好极了

TOP

CuTeCuBe

高级会员

帖子: 278
体力: 536
威望: 0
当前: 广东广州
离线: 4 天

专长 PHP,MySQL,MsSQL

24^# 大中小发表于 2007-3-16 14:18

<body>
<style type="text/css">
#home_tag {width: 100; height: 30; border-width: 1; border-color: black; border-style: solid; z-index: 10}
#home_label {width: 100; height: 30; position: absolute; top: 110; left: 200; z-index: 9}
#chiefs_tag {width: 100; height: 30; border-width: 1; border-color: black; border-style: solid; z-index: 12}
#chiefs_label {width: 100; height: 30; position: absolute; top: 110; left: 200; z-index: 11}
#members_tag {width: 100; height: 30; border-width: 1; border-color: black; border-style: solid; z-index: 14}
#members_label {width: 100; height: 30; position: absolute; top: 110; left: 300; z-index: 13}
#pictures_tag {width: 100; height: 30; border-width: 1; border-color: black; border-style: solid; z-index: 16}
#pictures_label {width: 100; height: 30; position: absolute; top: 110; left: 400; z-index: 15}
#links_tag {width: 100; height: 30; border-width: 1; border-color: black; border-style: solid; z-index: 18}
#links_label {width: 100; height: 30; position: absolute; top: 110; left: 500; z-index: 17}
</style>
<script language="JavaScript">

</script>
<div id="background_tag" style="background: red; width: 100; height: 30; position:absolute;top: 110; left: 200; z-index: 8"></div>
<div id="home_tag" onMouseOver="getOverIt(home_tag);" style="position: absolute; top: 110; left: 200"></div>
<div id="chiefs_tag" onMouseOver="getOverIt(chiefs_tag);" style="position: absolute; top: 110; left: 300"></div>
<div id="members_tag" onMouseOver="getOverIt(members_tag);" style="position: absolute; top: 110; left: 400"></div>
<div id="pictures_tag" onMouseOver="getOverIt(pictures_tag);" style="position: absolute; top: 110; left: 500"></div>
<div id="links_tag" onMouseOver="getOverIt(links_tag);" style="position: absolute; top: 110; left: 600"></div>

提示：您可以先修改部分代码再运行

再改了一下，呵呵

TOP

windkoo

中级会员

帖子: 137
体力: 293
威望: 0
当前: 四川成都
离线: 4 天

专长 前端制作,JS,PHP

25^# 大中小发表于 2007-3-16 20:57

效果是不错哈

TOP

dev7

新手上路

帖子: 22
体力: 43
威望: 0
离线: 127 天

26^# 大中小发表于 2007-3-16 23:27

先收藏
慢慢看

TOP

shore

中级会员

帖子: 60
体力: 224
威望: 0
离线: 5 天

专长 网页设计,ASP

27^# 大中小发表于 2007-3-17 12:08

好帖！！！！··

TOP

zibet

初级会员

帖子: 31
体力: 71
威望: 0
当前: 四川乐山
离线: 13 天

28^# 大中小发表于 2007-4-2 10:56

真牛！顶你！

TOP

WebCaiNiao

新手上路

帖子: 12
体力: 33
威望: 0
离线: 227 天

29^# 大中小发表于 2007-4-2 11:34

辛苦楼主了，21世界缺的就是这样有想法的人啊

顶啊

TOP

xzi01

舞炫吾旋

中级会员

帖子: 239
体力: 450
威望: 1
当前: 湖北武汉
离线: 66 天

30^# 大中小发表于 2007-4-27 17:13

顶，！不错。

TOP