[心得] 風格修改,把菜單改選單

Styles Released by Other phpbb Sites
推薦您喜歡的非官方認證風格吧!享受多樣化的 phpBB 。

版主: 版主管理群譯文組

主題已鎖定
design
竹貓忠實會員
竹貓忠實會員
文章: 330
註冊時間: 2003-10-31 00:36
聯繫:

[心得] 風格修改,把菜單改選單

文章 design »

:-D
最後由 design 於 2006-05-30 19:46 編輯,總共編輯了 1 次。
GeniusKiKi
竹貓忠實會員
竹貓忠實會員
文章: 1086
註冊時間: 2003-10-28 14:50

文章 GeniusKiKi »

這是我的修改方法
我覺得這樣比較順眼\r
這種的表單裡面可以放圖片
進階的連結方法也沒問題(聊天室那個)
範例請到 我的破爛論壇

[php]<style>
div {font:12px 細明體}
label {height:19px;padding:3px 0px 0px 4px}
.link_box {text-align:left;cursor:default}
.link_head {width:100%;height:20;border:2px inset}
.link_text {background:#fff;padding-left:2px}
.link_arrow0 {font:14px marlett;text-align:center;width:22;height:100%;border:2px outset;background:buttonface}
.link_arrow1 {font:14px marlett;text-align:center;width:22;height:100%;border:1px solid buttonshadow;padding:2px 0px 0px 2px;background:buttonface}
.link_value {position:absolute;visibility:hidden;border:1px solid;overflow:auto;overflow-x:hidden;filter:alpha(opacity:0)}
.link_record0{width:100%;height:20;border-top:1px solid #eee;background:#fff;color:#000;padding-left:2px}
.link_record1{width:100%;height:20;border-top:1px solid #047;background:#058;color:#fe0;padding-left:2px}
</style>
<script>
var dropShow=false
var currentID
function dropdown(el){
if(dropShow){
dropFadeOut()
}else{
currentID=el
el.style.visibility="visible"
dropFadeIn()
}
}
function dropFadeIn(){//選單淡入的效果
if(currentID.filters.alpha.opacity<100){
currentID.filters.alpha.opacity+=20
fadeTimer=setTimeout("dropFadeIn()",50)
}else{
dropShow=true
clearTimeout(fadeTimer)
}
}
function dropFadeOut(){//選單淡出的效果
if(currentID.filters.alpha.opacity>0){
clearTimeout(fadeTimer)
currentID.filters.alpha.opacity-=20
fadeTimer=setTimeout("dropFadeOut()",50)
}else{
dropShow=false
currentID.style.visibility="hidden"
}
}
function dropdownHide(){
if(dropShow){
dropFadeOut()
dropShow=false
}
}
function hiLight(el){//高亮度顯示指標位置\r
if(dropShow){
for(i=0;i<el.parentElement.childNodes.length;i++){
el.parentElement.childNodes(i).className="link_record0"
}
el.className="link_record1"
}
}
function CheckMe(el){//替換顯示內容
el.parentElement.parentElement.childNodes(0).childNodes(0).childNodes(0).childNodes(0).childNodes(0).childNodes(0).innerHTML=el.innerHTML
}
document.onclick=dropdownHide
</script>

<table>
<tr>
<td>

<div class=link_box style="width:100px" onselectStart="return false">
<div class=link_head onclick="dropdown(value1)">
<table width=100% height=100% border=0 cellpadding=0 cellspacing=0><tr>
<td><div class=link_text><img src="templates/subSilver/images/icon_mini_faq.gif" align="absmiddle"><label>相關說明</label></div></td>
<td width=22 align=right><div class=link_arrow0 onmousedown="this.className='link_arrow1'" onmouseup="this.className='link_arrow0'" onmouseout="this.className='link_arrow0'">6</div></td>
</tr></table>
</div>
<div id=value1 class=link_value style="width:100%;height:82px">
<div class=link_record0 onmouseover="hiLight(this)" onclick="CheckMe(this);window.location.href('{U_FAQ}')" ><img src="templates/subSilver/images/icon_mini_faq.gif" align="absmiddle"><label>常見問題</label></div>
<div class=link_record0 onmouseover="hiLight(this)" onclick="CheckMe(this);window.location.href('smilies_list.php')" ><img src="templates/subSilver/images/smilie_mini_icon.png" align="absmiddle"><label>表情符號</label></div>
<div class=link_record0 onmouseover="hiLight(this)" onclick="CheckMe(this);window.location.href('ranking.php')" ><img src="templates/subSilver/images/icon_mini_ranks.gif" align="absmiddle"><label>等級系統</label></div>
<div class=link_record0 onmouseover="hiLight(this)" onclick="CheckMe(this);window.location.href('{U_MEDALS}')" ><img src="templates/subSilver/images/icon_mini_medal.gif" align="absmiddle"><label>榮譽勳章</label></div>
</div>
</div>

</td>
<td>

<div class=link_box style="width:100px" onselectStart="return false">
<div class=link_head onclick="dropdown(value2)">
<table width=100% height=100% border=0 cellpadding=0 cellspacing=0><tr>
<td><div class=link_text><img src="templates/subSilver/images/icon_mini_profile.gif" align="absmiddle"><label>會員資料</label></div></td>
<td width=22 align=right><div class=link_arrow0 onmousedown="this.className='link_arrow1'" onmouseup="this.className='link_arrow0'" onmouseout="this.className='link_arrow0'">6</div></td>
</tr></table>
</div>
<div id=value2 class=link_value style="width:100%;height:82px">
<div class=link_record0 onmouseover="hiLight(this)" onclick="CheckMe(this);window.location.href('{U_PROFILE}')" ><img src="templates/subSilver/images/icon_mini_profile.gif" align="absmiddle"><label>個人資料</label></div>
<div class=link_record0 onmouseover="hiLight(this)" onclick="CheckMe(this);window.location.href('{U_MEMBERLIST}')" ><img src="templates/subSilver/images/icon_mini_members.gif" align="absmiddle"><label>會員列表</label></div>
<div class=link_record0 onmouseover="hiLight(this)" onclick="CheckMe(this);window.location.href('{U_GROUP_CP}')" ><img src="templates/subSilver/images/icon_mini_groups.gif" align="absmiddle"><label>會員群組</label></div>
<div class=link_record0 onmouseover="hiLight(this)" onclick="CheckMe(this);window.location.href('{U_STAFF}')" ><img src="templates/subSilver/images/staff.gif" align="absmiddle"><label>管理團隊</label></div>
</div>
</div>

</td>
<td>

<div class=link_box style="width:100px" onselectStart="return false">
<div class=link_head onclick="dropdown(value3)">
<table width=100% height=100% border=0 cellpadding=0 cellspacing=0><tr>
<td><div class=link_text><img src="templates/subSilver/images/icon_mini_games.gif" align="absmiddle"><label>娛樂設施</label></div></td>
<td width=22 align=right><div class=link_arrow0 onmousedown="this.className='link_arrow1'" onmouseup="this.className='link_arrow0'" onmouseout="this.className='link_arrow0'">6</div></td>
</tr></table>
</div>
<div id=value3 class=link_value style="width:100%;height:82px">
<div class=link_record0 onmouseover="hiLight(this)" onclick="CheckMe(this);window.location.href('games.php')" ><img src="templates/subSilver/images/icon_mini_games.gif" align="absmiddle"><label>電玩大街</label></div>
<div class=link_record0 onmouseover="hiLight(this)" onclick="CheckMe(this);window.location.href('rpg.php?action=menu')" ><img src="templates/subSilver/images/icon_mini_house.gif" align="absmiddle"><label>水怪 RPG</label></div>
<div class=link_record0 onmouseover="hiLight(this)" onclick="CheckMe(this);window.location.href('cash.php')" ><img src="templates/subSilver/images/icon_mini_exchange.gif" align="absmiddle"><label>兌換貨幣</label></div>
<div class=link_record0 onmouseover="hiLight(this)" onclick="CheckMe(this);window.open ('{S_JOIN_CHAT}','{CHATBOX_NAME}','scrollbars=no,width=540,height=450')"><img src="templates/subSilver/images/icon_mini_chat.gif" align="absmiddle"><label>即時聊天</label></div>
</div>
</div>

</td>
</tr>

<tr>
<td colSpan="3" align="center">

<a href="{U_SEARCH}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_search.gif" width="12" height="13" border="0" alt="搜尋" hspace="3" />搜尋</a>
<a href="{U_PRIVATEMSGS}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_message.gif" width="12" height="13" border="0" alt="{PRIVATE_MESSAGE_INFO}" hspace="3" />{PRIVATE_MESSAGE_INFO}</a>
<a href="{U_LOGIN_LOGOUT}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_login.gif" width="12" height="13" border="0" alt="{L_LOGIN_LOGOUT}" hspace="3" />{L_LOGIN_LOGOUT}</a>
<!-- BEGIN switch_user_logged_out -->
<a href="{U_REGISTER}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_register.gif" width="12" height="13" border="0" alt="{L_REGISTER}" hspace="3" />{L_REGISTER}</a>
<!-- END switch_user_logged_out -->

</td>
</tr>
</table>[/php]
再也不當爛好人...
好人是小白轉型成大白的墊腳石...
design
竹貓忠實會員
竹貓忠實會員
文章: 330
註冊時間: 2003-10-31 00:36
聯繫:

文章 design »

贊哦..你改的真不錯^^
Ricky Zero
星球公民
星球公民
文章: 60
註冊時間: 2003-08-25 15:53
來自: 哈哈哈王國
聯繫:

文章 Ricky Zero »

您的這個站的設計也很讚呀
分享火力 - 線上社群 - http://holy.be

超有質感的
小西
竹貓忠實會員
竹貓忠實會員
文章: 460
註冊時間: 2004-11-19 22:29
來自: 超可愛聲音

文章 小西 »

真的很不錯...外掛裝太多都快擠不進去了
用選單可以節省不少空間
ACG自唱:分貝網存放區 (192kbps) ;NICO存放區 (320kbps)
aHfUi
星球公民
星球公民
文章: 184
註冊時間: 2004-11-14 17:52
聯繫:

文章 aHfUi »

Cannot open the "我的破爛論壇 "
Kill
竹貓忠實會員
竹貓忠實會員
文章: 874
註冊時間: 2003-07-31 12:40
來自: CKD Studio
聯繫:

文章 Kill »

e7play已經關了
喜歡...就是淡淡ㄉ愛... ...則是深深ㄉ喜歡...
圖檔
提供phpBB代架服務以及外掛安裝

有付費服務的問題請移駕至CKD Studio發問 ╮( ̄▽ ̄)╭
chsa
星球公民
星球公民
文章: 259
註冊時間: 2004-12-27 20:45

Re: [心得] 風格修改,把菜單改選單

文章 chsa »

design 寫:剛改好一個方式,感覺不錯,如果你有一推外掛,也許您可以試著把他分門別類
用下拉式選單的方式,感覺更有條理。

#
#-----[ 打開 ]------------------------------------------
#


overall_header.tpl

#
#-----[ 尋找 ]------------------------------------------
#

代碼: 選擇全部

<td align="center" valign="top" nowrap="nowrap"><span class="mainmenu">&nbsp;<a href="{U_FAQ}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_faq.gif" width="12" height="13" border="0" alt="{L_FAQ}" hspace="3" />{L_FAQ}</a></span><span class="mainmenu">&nbsp; &nbsp;<a href="{U_SEARCH}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_search.gif" width="12" height="13" border="0" alt="{L_SEARCH}" hspace="3" />{L_SEARCH}</a>&nbsp; &nbsp;<a href="{U_MEMBERLIST}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_members.gif" width="12" height="13" border="0" alt="{L_MEMBERLIST}" hspace="3" />{L_MEMBERLIST}</a>&nbsp; &nbsp;<a href="{U_GROUP_CP}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_groups.gif" width="12" height="13" border="0" alt="{L_USERGROUPS}" hspace="3" />{L_USERGROUPS}</a>&nbsp; 
#
#-----[ 置換 ]------------------------------------------
#

代碼: 選擇全部

<select onchange="location.href=this[this.selectedIndex].value">
<option value="">PHPBB選單</option>
<option value="{U_PROFILE}">{L_PROFILE}</option>
<option value="{U_PRIVATEMSGS}">{PRIVATE_MESSAGE_INFO}</option>
<option value="{U_LOGIN_LOGOUT}">{L_LOGIN_LOGOUT}</option>
<option value="{U_FAQ}">{L_FAQ}</option>
<option value="{U_SEARCH}">{L_SEARCH}</option>
<option value="{U_MEMBERLIST}">{L_MEMBERLIST}</option>
<option value="{U_GROUP_CP}">{L_USERGROUPS}</option>
</select>
這樣一來,不僅版面節省很多,值得您參考!!

如果要分類,只要copy整個區塊,再換裡頭的變數例如}"{L_USERGROUPS}"
這種東西,如果您有裝預設以外的外掛,一樣找出那些外掛的變數,套進去即可.

good luck ! 希望對大家風格修改有幫助。

ps.會員註冊也可以弄進去,但建議大家把註冊窗口放外面比較顯眼。

這個不錯用.. 謝謝您..
頭像
chenghwa
星球公民
星球公民
文章: 62
註冊時間: 2003-02-17 23:03
聯繫:

文章 chenghwa »

Dear design

我好喜歡你版的風格\r
可不可教我呢\r
謝謝
主題已鎖定

回到「非官方認證風格」