忍者ブログ

在閱讀裡沉醉,在影像中做夢,在遊戲裡追尋,在生活中漂流,在心靈角落裡,我做我自己。

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

因為實在是對原本的版型感到很膩了,所以就做了部落格大改版,之前其實有挑過要用的版型,只是侷限於我的連結選單會無法使用,觀察過CSS樣式還是找不到問題,明明其他自定欄位都可以使用JavaScript,但就是那個JavaScript的寫法不行,所以只好找尋其他作連結選單的方法,其實之前就有找過了,只是我不太喜歡【下拉式選單】產生器的複雜語法,太過冗長了,後來就看到有比較簡單的語法,也就直接套用了,改版型真是花了我好一番功夫,光是做一大堆的微調就花去我整個睌上,幸好忍者部落格有小幫手的功能呀,靠著瞎猜、超菜的日文,還有對於CSS的模糊基礎,只留下基本架構的骨幹,其他的部份都被我改的面目全非了(爆),就介紹一下下拉式選單的簡單語法吧。
Related Posts Plugin for WordPress, Blogger...



【Code】(將此部分複製到部落格的自定欄位即可,需支援JavaScript
<select onchange="window.open(this.options[this.selectedIndex].value)">
<option value="">選單名稱</option>
<option value="">------------------------------------</option>
<option value="連結網址">連結名稱</option>
<option value="連結網址">連結名稱</option>
<option value="連結網址">連結名稱</option>
</select>

【範例說明】


選單名稱:身陷謎團の推理眾
第一個選項
連結網址:http://mysteryexpress.blog111.fc2.com/
連結名稱:謎思推理報

第二個選項
連結網址:http://blog.pixnet.net/mysteryfactory
連結名稱:台灣推理夢工廠

------------------------------------
↑是用來控制選單欄位長度,若各選單字數不一,則下拉式選單會呈現長短不齊的狀況,此時可做一樣的虛線長度控制。

若想要增加連結選項,則在程式碼中新增一筆<option value="連結網址">連結名稱</option>即可,若要增加第二組選單,則整個Code複製起來再做內容的修改,此選單經點選會另開視窗開啟點選的網頁。

【Code】
<select onchange="window.open(this.options[this.selectedIndex].value)">
<option value="">身陷謎團の推理眾</option>
<option value="">------------------------------------</option>
<option value="http://mysteryexpress.blog111.fc2.com/">謎思推理報</option>
<option value="http://blog.pixnet.net/mysteryfactory">台灣推理夢工廠</option>
</select>


若有其他問題可以留言問我,我還在研究怎麼改選單中選項的顏色跟字體大小。XD
PR

Comment

-----

  • 若雲飛   
  • 2008/08/06 (水)15:19  
  • edit

這語法似乎在上課時有寫過....
不過有時都是偷懶去找範例然後改變數數值亂try...XDD

Re:-----

  • 栞  
  • 2008/08/06 (水)18:14  

反正好玩就好嘛。

無題

  • 小云   
  • 2008/08/06 (水)15:57  
  • edit

這語法我以前也用過 XD
後來因為覺得下拉式的框框很醜就拿掉了(炸)

這版型留言會強迫填標題跟密碼耶 O_O

Re:無題

  • 栞  
  • 2008/08/06 (水)18:16  

填密碼的話,可以修改自己寫過的留言唷,其實是很方便的功能,萬一有錯字或寫錯東西就可以改了,只是大部分的人都不會填密碼。

我覺得框框是不會很醜啦,不過用火狐跟用ie看到的是不一樣的長相,用火狐的看到的會套版型樣式跟字型大小,我找不到修改的地方。orz

la

  • drem   
  • 2008/08/06 (水)22:42  
  • edit

文章裡的CODE沒有用到CSS(嗅)

目前使用的css<link rel="stylesheet" href="http://twinsyang.blog.shinobi.jp/css/" type="text/css">會對下拉式選單有影響的規則:
body, h1, b, td, th, label, input, option, select, textarea {
color:#333333;/*字的顏色*/
font-family:Verdana;/*字型*/
font-size:12px;/*大小*/
font-weight:normal;/*粗細*/
}
input, option, textarea {
background:#FFFFFF none repeat scroll 0%;/*背景*/
border:1px solid #FFCC00;/*邊框...*/
color:#333333;
font-family:Verdana;
font-size:10px;
font-size-adjust:none; 沒用過,我懶了…
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:normal;
line-height:normal;
vertical-align:middle;
}

如果預設的 css改不到就用 inline-style吧
<select onchange="window.open(this.options[this.selectedIndex].value)" style="width:10em;font-size:2em;background:#ccc;color:#33f;border:none">
<option value="">推理眾</option>
</select>
border:none;這條 ie沒反應

Re:la

  • 栞  
  • 2008/08/06 (水)23:57  

我就是改inline style的說,可是好像沒有生效才覺得奇怪,假日有空再來改改看好了,感謝drem的指導。:)

  • 小云   
  • 2008/08/07 (木)17:02  
  • edit

密碼是還好啦~
但是要填標題就有點小煩燥 (爆)

Re:喵

  • 栞  
  • 2008/08/08 (金)21:33  

我還滿喜歡人家填標題的說:p

無題

  • 唔   
  • 2009/07/16 (木)19:33  
  • edit

請問一下你右下角的按鈕
就是"千言萬語的重量"按下去會跑出來得下拉式要怎麼用@@我想用我fc2

這是我的:http://nosugarfu.blog126.fc2.com/
怎麼用成像這樣:http://akru.blog13.fc2.com/

Re:無題

  • 栞  
  • 2009/07/16 (木)21:32  

不好意思,我是直接套用版型的功能說,不會自己做。Orz

Form

NAME
Title
E-MAIL
URL
Comment
Password

この記事へのトラックバック

この記事にトラックバックする:

BloggerAD

逛逛博客來

◎利益揭露:由此連往博客來的訂單,會讓我得到2%-4%的回饋金,特此說明:)

東野圭吾雪山祭

探索心靈深處

Google探索

Loading

贊助商連結

贊助商連結

旅行者の一步一腳印


忍者ブログ

[PR]

TemplateDesign by KARMA