自编SupeSite_X-Space_V5风格制做教程.好东东不断添加中.

斑竹  可以帮我该下我的风格吗
我有个风格包  可不知道用

原帖由 ftwfai 于 2006-10-16 11:31 发表
斑竹  可以帮我该下我的风格吗
我有个风格包  可不知道用

声明:我不是斑竹
不绕弯子的回答:不行.
我只与朋友们进行图文交流.[包括你].不伸手替朋友干活[做不好.为人为事比较小心].
主动交流总比被动好.我很渴望能从各位身上学到知识.

请理解我的直率

[ 本帖最后由 zhanglei700 于 2006-10-16 11:58 编辑 ]

我还是要来顶帖子，这是习惯了

今天开始慢慢做主页.脑子一片空白.随手乱做全凭兴趣.
LOGO就不按常规放到上边了.有点叛逆！
顶部做成登陆框.搜索框.一改常规的导航拦.将日志及资迅栏目分列幻灯两侧.
http://3dmax9.com/3dmax/index.php

[ 本帖最后由 zhanglei700 于 2006-10-17 11:21 编辑 ]

风格方案名 归属系统 模板文件地址 操作
论坛公告列表 论坛公告 thread_subject_list 编辑 | 删除
论坛公告列表(幻灯) 论坛公告 bbs_announcement_js_list 编辑 | 删除
论坛附件列表 论坛附件 bbs_attach_list 编辑 | 删除
论坛图片显示 论坛附件 item_image_subject_list 编辑 | 删除
论坛贴图显示(滚动) 论坛附件 bbs_image_subject_list_td 编辑 | 删除
论坛版块列表 论坛版块 bbs_forums_list 编辑 | 删除
论坛子版块 论坛版块 div_bbs_forums_list 编辑 | 删除
论坛友情链接 论坛友情链接 bbs_links_list 编辑 | 删除
论坛会员列表(会员名) 论坛会员 member_name_list 编辑 | 删除
论坛会员列表(会员名+详细信息) 论坛会员 member_list 编辑 | 删除
论坛帖子列表 论坛帖子 bbs_posts_list 编辑 | 删除
论坛主题列表(标题) 论坛主题 thread_subject_list 编辑 | 删除
论坛主题列表(标题+作者) 论坛主题 thread_subject_author 编辑 | 删除
论坛主题列表(标题+内容) 论坛主题 thread_subject_message 编辑 | 删除
分类列表(分类名+图片) 系统分类 category_channel 编辑 | 删除
分类列表(分类名) 系统分类 category_name_list 编辑 | 删除
用户空间根分类 系统分类 space_category_name_list 编辑 | 删除
专题列表 系统分类 div_category_channel 编辑 | 删除
子分类列表 系统分类 div_category_name_list 编辑 | 删除
投票列表(标题) 投票 item_subject_list 编辑 | 删除
风格方案名 归属系统 模板文件地址 操作
投票列表(表单) 投票 poll 编辑 | 删除
日志列表(标题) 日志 item_subject_list 编辑 | 删除
日志列表(标题+内容) 日志 item_subject_message 编辑 | 删除
日志列表(标题+用户空间名) 日志 item_subject_spacename 编辑 | 删除
日志(幻灯片) 日志 item_subject_pic 编辑 | 删除
日志(分组) 日志 item_subject_span_list 编辑 | 删除
日志列表(图片) 日志 item_image_list 编辑 | 删除
日志列表(分组+标题+用户空间名) 日志 item_subject_span_list_spacename 编辑 | 删除
最新日志列表 日志 div_item_subject_list 编辑 | 删除
最新信息列表(类别+标题) 日志 item_subject_type 编辑 | 删除
回复列表 用户回复 item_subject_list 编辑 | 删除
文件列表(文件名+详细信息) 文件 item_file_list 编辑 | 删除
文件列表(文件名+描述) 文件 item_file 编辑 | 删除
文件列表(文件名) 文件 item_subject_list 编辑 | 删除
商品列表(商品名+详细信息) 商品 item_goods_list 编辑 | 删除
商品列表(商品名+价格) 商品 item_goods 编辑 | 删除
商品列表(商品名+图片) 商品 item_goods_subject_list 编辑 | 删除
图片列表(图片) 图片 item_image_list 编辑 | 删除
图片展示(标题+图片) 图片 item_image_subject_list 编辑 | 删除
图片列表(标题+图片) 图片 image_subject_list 编辑 | 删除
风格方案名 归属系统 模板文件地址 操作
图片展示(幻灯片) 图片 item_pic_list 编辑 | 删除
书签列表 书签 item_subject_list 编辑 | 删除
资讯列表(标题) 资讯 item_subject_list 编辑 | 删除
资讯(图文) 资讯 item_image_subject_list 编辑 | 删除
资讯(幻灯片) 资讯 item_subject_pic 编辑 | 删除
资讯列表(分组+标题+日期) 资讯 item_subject_list_dateline 编辑 | 删除
热点资讯列表 资讯 div_item_subject_hot_list 编辑 | 删除
TAG列表(标题) TAG文章信息 item_subject_list 编辑 | 删除
TAG名列表(列表) TAG tag_tagname_list 编辑 | 删除
TAG名 TAG tag_tagname 编辑 | 删除
用户空间列表(空间名) 个人空间列表 space_name_list 编辑 | 删除
用户空间列表(空间名+用户名) 个人空间列表 space_name_user 编辑 | 删除
用户空间列表(空间名+用户头像) 个人空间列表 space_photo_name_list 编辑 | 删除
用户空间(幻灯片) 个人空间列表 space_name_pic 编辑 | 删除
最新更新个人空间列表 个人空间列表 div_space_name_user 编辑 | 删除

[ 本帖最后由 zhanglei700 于 2006-10-17 15:22 编辑 ]

楼主很有耐心,而且很有热心!!:) :)

太好了,感谢LZ

今儿个又做了一点.反正每天都做一些.改来改去吧.
发个效果.直逼flash的css+div+js菜单.拿去用吧.这段代码是由网上搜来的.自已改了改以适应自己的风格.

演示:http://3dmax9.com/3dmax/

1. <th bgcolor="#666666" class="style3" scope="col"><div class="style5" id=fbtn>
   
2. <div id=fbtn_mask></div>
   
3. <div id=fbtn_txt>
   
4. <div class="style8"><a href="http://3dmax9.com/">G1</a></div>
   
5. <div><a href="http://3dmax9.com/"> 首页
   
6.      <style>
   
7. 
   
8. #fbtn{
   
9. display:none;
   
10. overflow:hidden;
    
11. border-style:solid;
    
12. border-width:1px;
    
13. border-color:#e1e1c9 #e1e1c9 #6e6e56 #6e6e56;
    
14. padding:1 1 1 1;
    
15. width:225px;
    
16. height:31px;
    
17. }
    
18. #fbtn_txt{
    
19. position:relative;
    
20. }
    
21. #fbtn_txt div{
    
22. height:30px;
    
23. padding-top:11px;
    
24. font-size:12px;
    
25. font-family:small fonts;
    
26. color:#282828;
    
27. text-align:center;
    
28. cursor:hand;
    
29. }
    
30. #fbtn_mask{
    
31. background-color:#404040;
    
32. position:relative;
    
33. width:100%;
    
34. height:100%;
    
35. }
    
36.      </style>
    
37. </a></div>
    
38. </div>
    
39. </div>
    
40. <div id=fbtn>
    
41. <div id=fbtn_mask></div>
    
42. <div id=fbtn_txt>
    
43. <div><a href="http://3dmax9.com/3dmax/?action_news.html">G2 </a></div>
    
44. <div><a href="http://3dmax9.com/3dmax/?action_news.html">最新资迅</a></div>
    
45. </div>
    
46. </div>
    
47. <div id=fbtn>
    
48. <div id=fbtn_mask></div>
    
49. <div id=fbtn_txt>
    
50. <div class="style5"><a href="http://3dmax9.com/3dmax/?action_blog.html">G3</a></div>
    
51. <div><a href="http://3dmax9.com/3dmax/?action_blog.html">会员日志</a></div>
    
52. </div>
    
53. </div>
    
54. <div id=fbtn>
    
55. <div id=fbtn_mask></div>
    
56. <div id=fbtn_txt>
    
57. <div><a href="http://3dmax9.com/3dmax/?action_image.html">G4</a></div>
    
58. <div><a href="http://3dmax9.com/3dmax/?action_image.html">会员相册</a></div>
    
59. </div>
    
60. </div>
    
61. <div id=fbtn>
    
62. <div id=fbtn_mask></div>
    
63. <div id=fbtn_txt>
    
64. <div><a href="http://3dmax9.com/3dmax/?action_goods.html">G5</a></div>
    
65. <div><a href="http://3dmax9.com/3dmax/?action_goods.html">会员商品</a></div>
    
66. </div>
    
67. </div>
    
68. <div id=fbtn>
    
69. <div id=fbtn_mask></div>
    
70. <div id=fbtn_txt>
    
71. <div><a href="http://3dmax9.com/3dmax/?action_file.html">G6</a></div>
    
72. <div><a href="http://3dmax9.com/3dmax/?action_file.html">会员下载</a></div>
    
73. </div>
    
74. </div>
    
75. 
    
76. <script>
    
77. var current=null;
    
78. var t=null;
    
79. for(var i=0;i<fbtn.length;i++){
    
80. fbtn_txt[i].style.posTop=-30;
    
81. fbtn_mask[i].style.posTop=-30;
    
82. fbtn[i].index=i;
    
83. fbtn[i].style.display="block";
    
84. fbtn[i].onmouseover=function(){
    
85. if(!current){
    
86. current=this;
    
87. domove(this.index);
    
88. }
    
89. else if(current!=this){
    
90. domove(current.index);
    
91. domove(this.index);
    
92. current=this;
    
93. }
    
94. }
    
95. fbtn[i].onmouseout=function(){
    
96. if(event.toElement==this.parentElement&t==this){
    
97. domove(this.index);
    
98. current=null;
    
99. }
    
100. }
     
101. }
     
102. function domove(num){
     
103. var o=fbtn_txt[num];
     
104. var m=fbtn_mask[num];
     
105. if(o.style.posTop<-60){
     
106. o.style.display="none";
     
107. var t=o.children[1].innerHTML;
     
108. o.children[1].innerHTML=o.children[0].innerHTML;
     
109. o.children[0].innerHTML=t;
     
110. o.style.posTop=-30;
     
111. o.style.display="block";
     
112. if(m.style.posTop>30)
     
113. m.style.posTop=-30;
     
114. else
     
115. m.style.posTop=0;
     
116. }
     
117. else{
     
118. m.style.posTop+=3;
     
119. o.style.posTop-=3;
     
120. setTimeout('domove('+num+')',15);
     
121. }
     
122. }
     
123. </script></th>

复制代码

[ 本帖最后由 zhanglei700 于 2006-10-18 16:15 编辑 ]

原--源码.

1. <html>
   
2. <head>
   
3. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
   
4. <title>css 菜单</title>
   
5. <style>
   
6. body{
   
7. background-color:#B8B8A0;
   
8. }
   
9. #fbtn{
   
10. display:none;
    
11. overflow:hidden;
    
12. border-style:solid;
    
13. border-width:1px;
    
14. border-color:#e1e1c9 #e1e1c9 #6e6e56 #6e6e56;
    
15. padding:1 1 1 1;
    
16. width:115px;
    
17. height:30px;
    
18. }
    
19. #fbtn_txt{
    
20. position:relative;
    
21. }
    
22. #fbtn_txt div{
    
23. height:30px;
    
24. padding-top:11px;
    
25. font-size:9px;
    
26. font-family:small fonts;
    
27. color:#800080;
    
28. text-align:center;
    
29. cursor:hand;
    
30. }
    
31. #fbtn_mask{
    
32. background-color:#ffffff;
    
33. position:relative;
    
34. width:100%;
    
35. height:100%;
    
36. }
    
37. </style>
    
38. 
    
39. </head>
    
40. 
    
41. <body>
    
42. <div id=fbtn>
    
43. <div id=fbtn_mask></div>
    
44. <div id=fbtn_txt>
    
45. <div>G1</div>
    
46. <div>good morning</div>
    
47. </div>
    
48. </div>
    
49. <div id=fbtn>
    
50. <div id=fbtn_mask></div>
    
51. <div id=fbtn_txt>
    
52. <div>G2</div>
    
53. <div>good evening</div>
    
54. </div>
    
55. </div>
    
56. <div id=fbtn>
    
57. <div id=fbtn_mask></div>
    
58. <div id=fbtn_txt>
    
59. <div>M1</div>
    
60. <div>my name is fireyy</div>
    
61. </div>
    
62. </div>
    
63. <div id=fbtn>
    
64. <div id=fbtn_mask></div>
    
65. <div id=fbtn_txt>
    
66. <div>M2</div>
    
67. <div>mm mm i love u</div>
    
68. </div>
    
69. </div>
    
70. <div id=fbtn>
    
71. <div id=fbtn_mask></div>
    
72. <div id=fbtn_txt>
    
73. <div>G1</div>
    
74. <div>good morning</div>
    
75. </div>
    
76. </div>
    
77. <div id=fbtn>
    
78. <div id=fbtn_mask></div>
    
79. <div id=fbtn_txt>
    
80. <div>G2</div>
    
81. <div>good evening</div>
    
82. </div>
    
83. </div>
    
84. <div id=fbtn>
    
85. <div id=fbtn_mask></div>
    
86. <div id=fbtn_txt>
    
87. <div>M1</div>
    
88. <div>my name is fireyy</div>
    
89. </div>
    
90. </div>
    
91. <div id=fbtn>
    
92. <div id=fbtn_mask></div>
    
93. <div id=fbtn_txt>
    
94. <div>M2</div>
    
95. <div>mm mm i love u</div>
    
96. </div>
    
97. </div>
    
98. 
    
99. <script>
    
100. var current=null;
     
101. var t=null;
     
102. for(var i=0;i<fbtn.length;i++){
     
103. fbtn_txt[i].style.posTop=-30;
     
104. fbtn_mask[i].style.posTop=-30;
     
105. fbtn[i].index=i;
     
106. fbtn[i].style.display="block";
     
107. fbtn[i].onmouseover=function(){
     
108. if(!current){
     
109. current=this;
     
110. domove(this.index);
     
111. }
     
112. else if(current!=this){
     
113. domove(current.index);
     
114. domove(this.index);
     
115. current=this;
     
116. }
     
117. }
     
118. fbtn[i].onmouseout=function(){
     
119. if(event.toElement==this.parentElement&t==this){
     
120. domove(this.index);
     
121. current=null;
     
122. }
     
123. }
     
124. }
     
125. function domove(num){
     
126. var o=fbtn_txt[num];
     
127. var m=fbtn_mask[num];
     
128. if(o.style.posTop<-60){
     
129. o.style.display="none";
     
130. var t=o.children[1].innerHTML;
     
131. o.children[1].innerHTML=o.children[0].innerHTML;
     
132. o.children[0].innerHTML=t;
     
133. o.style.posTop=-30;
     
134. o.style.display="block";
     
135. if(m.style.posTop>30)
     
136. m.style.posTop=-30;
     
137. else
     
138. m.style.posTop=0;
     
139. }
     
140. else{
     
141. m.style.posTop+=3;
     
142. o.style.posTop-=3;
     
143. setTimeout('domove('+num+')',15);
     
144. }
     
145. }
     
146. </script>
     
147. </body>
     
148. </html>

复制代码

新手看一下这里...........