close
酷味站_部落格分類:
部落格分類/選單語法:
部落格分類/選單語法:
<div id="ysbscrblist" class="ycntmod">
<div class="rctop"><div>div>div>
<div class="rcl">
<div class="rcr">
<form name="gallery_list" action="/coolway-blog/subscription" method="post">
<div class="mhd">
<div class="text">
<h3>部落格分類h3>
<select name="cfid" onChange="jumpToFolder(this);">
<option value=25 >奇摩部落格option>
<option value=26 selected>教學部落格option>
<option value=27 >旅遊部落格option>
<option value=31 >攝影部落格option>
<option value=32 >特殊部落格option>
<option value=43 >同事朋友區option>
<option value=45 >友好部落格option>
<option value=46 >熟客部落格option>
<option value=47 >人氣部落格option>
<option value=54 >失聯部落格option>
<option value=56 >寶貝部落格option>select>
div>
<a href='http://tw.myblog.yahoo.com/coolway-blog/rss/subscription' class='btn rss'>RSSa>
div>
yahoo無法用:
2009-02-27 感謝第8名(想飛"的季節_飛行傘)
提供下拉式選單產生器
最近一直在測試下拉式選單之部落格連結，這樣說，也許太繞舌，直接來看個例子比較快 ：
--------歡迎來交換------- 心 焦糖 dllee 敗家誌° 高登工作室 【宅科技】 最完美的感動 怪咖的生活情 韓德爾の原木 愛上陽光的男人 開源節流資訊網 Sandy秘密天空 台灣總霸五金有限公司 原來教養是愛這麼回事 FUN攝影Kerwin的野兔部落 阿肥(肥滋滋)的便利貼記事本 處女座與雙子座的趴趴走日記 Appassionata~她的名字叫熱情
上面這個選單是取自《佶也》http://blog.yam.com/cctsai 家的側欄，這是我一週來看過最方便簡單的連結選單，很符合佶也簡便的要求
本篇將說明目前常見的連結選單(大部分的作法大同小異)以及我想要的連結選單。
先來看看基本選單的範例及語法：
選項顯示字串1 選項顯示字串2 選項顯示字串3
透過表單(form)建立選項(select/option)，就可以建立下拉式選單。不過，這樣的選單，什麼事也沒做，就只是可以下拉而已。
最常見的選單連結是再加一個按鈕，在按鈕按下時，開啟連結，例如：
dllee @ 天空 dllee @ 痞客 dllee @ BlogSpot
其中，select 之後的 name="choice" 是給定選單一個名稱，以利按鈕按下時，取得指定選單的資料。而 input TAG 則是要產生按鈕，在按鈕 onclick 事件中，可以設定想要執行的程式。
在佶也家的作法，則是省略掉按鈕，只要選好指定的選單項目，就可以開啟對方的網頁。使用的方法，就是改用 select 的 onchange 事件，只要選擇不同的選單項目，select 的 onchange 事件就會觸發。例如：
點我看好站 ^__^ dllee @ 天空 dllee @ 痞客 dllee @ BlogSpot
進一步簡化：
省掉按鈕，對於側欄空間版面有限的狀況下，真的是不錯 ，不過，因為必需得在選項改變時，onchange 事件才會觸發，再加上瀏覽器預設會顯示第一項，因此，第一項通常不會放連結，會加入一些文字來吸引訪客點選。
在企鵝家及愛家，則使用了多個連結選單，如同佶也家的連結選單，是沒有按鈕的型式，不過，他們的 onchange 事件比較複雜一些，增加的部份是可以設定每個連結是否要開新頁(_blank)或是在原頁面開啟。我只想要在新頁開啟連結，所以使用佶也的方式就可以了。
我想要的連結選單，除了上述功能外，還想要有隨機點閱的功能，外觀像是：
※ dllee 的連結選單空殼 ※ ※ 隨機看 1 格 ※ 隨機看 3 格 ※ 隨機看 10 格 ※ 一次看全部 dllee @ 天空 dllee @ 痞客 dllee @ BlogSpot ...以下略 XD...
在這一週來，看了很多 JavaScript/Form 的資料，我想要的功能，幾乎都快達成了，心想應該沒問題了，於是在本週一開始，陸續整理我的最愛，一邊整理，一邊測試。但在昨晚測試時，卻發現功能似乎相同的 JavaScript，只是程式碼前後調整，在開新頁時，有時會讓 FireFox 視為自動開新頁而攔下，改回舊的，竟然連原本不會被 FireFox 攔下的寫法，也變成會被 FireFox 攔下。被 FireFox 攔下後，再去企鵝家試，同樣也被攔下 這讓我又開始傷腦筋了
暫時先把目前測試的結果放上來實測一下，等確定後再把程式釋出。
※ dllee 的連結選單 ※(用按鈕) ※ 隨機看 1 格 ※ 隨機看 3 格 ※ 隨機看 10 格 ※ 一次看全部 LKK 思緒 dllee 加薪貓 《佶也》 豪宅小屋 愛美 萬萬歲 小珊頭喵喵叫 my"感恩.惜福" 也無風雨也無晴 簡單生活、簡單愛 + 紫色幻想空間 + 原來教養是愛這麼回事 Amanda的生活與家常美食 焦糖 繪意記錄 如雲似水 I.P. zone NO VIRUS 企鵝碎碎唸 動漫新樂園 dllee痞客店 想不到的想ａ 一腳踩進多倫多 Belito的香格里拉 seagod的慢遊人生 ☆★驛動的心★☆ il Giardino Romantico 人間仙境紐西蘭美女的家 FUN 攝影 Kerwin 的野兔部落 阿肥(肥滋滋)的便利貼記事本 攝影‧旅行‧拈花惹草→Morris 小笠‧雜筆 寂靜的頻率 怪咖的生活情 旅美熟姐日記 我與小崴崴的工作日記 心 Frank的雜記 由紀小姐の遊園地 Appassionata~她的名字叫熱情 彥子小站 高登工作室 LuSoft’s BLOG 月光下的嘆息！ 索尼斯．網路攻略
※ dllee 的連結選單 ※(直接選) ※ 隨機看 1 格 ※ 隨機看 3 格 ※ 隨機看 10 格 ※ 一次看全部 LKK 思緒 dllee 加薪貓 《佶也》 豪宅小屋 愛美 萬萬歲 小珊頭喵喵叫 my"感恩.惜福" 也無風雨也無晴 簡單生活、簡單愛 + 紫色幻想空間 + 原來教養是愛這麼回事 Amanda的生活與家常美食 焦糖 繪意記錄 如雲似水 I.P. zone NO VIRUS 企鵝碎碎唸 動漫新樂園 dllee痞客店 想不到的想ａ 一腳踩進多倫多 Belito的香格里拉 seagod的慢遊人生 ☆★驛動的心★☆ il Giardino Romantico 人間仙境紐西蘭美女的家 FUN 攝影 Kerwin 的野兔部落 阿肥(肥滋滋)的便利貼記事本 攝影‧旅行‧拈花惹草→Morris 小笠‧雜筆 寂靜的頻率 怪咖的生活情 旅美熟姐日記 我與小崴崴的工作日記 心 Frank的雜記 由紀小姐の遊園地 Appassionata~她的名字叫熱情 彥子小站 高登工作室 LuSoft’s BLOG 月光下的嘆息！ 索尼斯．網路攻略
P.S. 整理連結, 比寫程式還要花時間呀!! 目前還在整理中... 為了選單美觀，我按格名的字數排列，我猜想，在我整理完成時，可能又得想新的花樣，因為全列在同一個實在是太多了，也難怪企鵝與愛都使用多個連結選單。
2009-02-26
今天使用 IE 測試，結果更慘...
必需要用按鈕的型式才行，此外，也無法一次看一格以上，IE 只會開第一格，其他的都被封鎖快顯
另外，在痞客也放了測試，同樣的語法，同樣的效果，同樣被 IE 封鎖快顯
得再傷腦筋囉 ~ ~ ~
看到許多人已想要自己試了，先說明簡單的兩種選單連結作法。
※ 無按鈕選單連結
以上紅色的部分按紅色的內容修改，或參考上述「踢寶看這邊 ^__^」的實例。格友的部分按相同的格式一直加下去就可以了，非紅色字的部分不要更動，貼文時使用一般編輯器(純文字編輯器/HTML/原始碼 格式)，不要自動換行，這樣應該就可以了。
※ 有按鈕選單連結
改成您按鈕要顯示的文字"
以上紅色的部分按紅色的內容修改，或參考上述「去逛逛」的按鈕實例。格友的部分按相同的格式一直加下去就可以了，非紅色字的部分不要更動，貼文時同樣使用一般編輯器(純文字編輯器/HTML/原始碼 格式)，不要自動換行。
提供下拉式選單產生器
最近一直在測試下拉式選單之部落格連結，這樣說，也許太繞舌，直接來看個例子比較快 ：
上面這個選單是取自《佶也》http://blog.yam.com/cctsai 家的側欄，這是我一週來看過最方便簡單的連結選單，很符合佶也簡便的要求
本篇將說明目前常見的連結選單(大部分的作法大同小異)以及我想要的連結選單。
先來看看基本選單的範例及語法：
最常見的選單連結是再加一個按鈕，在按鈕按下時，開啟連結，例如：
onclick="window.open(this.form.choice.options[this.form.choice.selectedIndex].value)">
其中，select 之後的 name="choice" 是給定選單一個名稱，以利按鈕按下時，取得指定選單的資料。而 input TAG 則是要產生按鈕，在按鈕 onclick 事件中，可以設定想要執行的程式。
在佶也家的作法，則是省略掉按鈕，只要選好指定的選單項目，就可以開啟對方的網頁。使用的方法，就是改用 select 的 onchange 事件，只要選擇不同的選單項目，select 的 onchange 事件就會觸發。例如：
進一步簡化：
省掉按鈕，對於側欄空間版面有限的狀況下，真的是不錯 ，不過，因為必需得在選項改變時，onchange 事件才會觸發，再加上瀏覽器預設會顯示第一項，因此，第一項通常不會放連結，會加入一些文字來吸引訪客點選。
在企鵝家及愛家，則使用了多個連結選單，如同佶也家的連結選單，是沒有按鈕的型式，不過，他們的 onchange 事件比較複雜一些，增加的部份是可以設定每個連結是否要開新頁(_blank)或是在原頁面開啟。我只想要在新頁開啟連結，所以使用佶也的方式就可以了。
我想要的連結選單，除了上述功能外，還想要有隨機點閱的功能，外觀像是：
在這一週來，看了很多 JavaScript/Form 的資料，我想要的功能，幾乎都快達成了，心想應該沒問題了，於是在本週一開始，陸續整理我的最愛，一邊整理，一邊測試。但在昨晚測試時，卻發現功能似乎相同的 JavaScript，只是程式碼前後調整，在開新頁時，有時會讓 FireFox 視為自動開新頁而攔下，改回舊的，竟然連原本不會被 FireFox 攔下的寫法，也變成會被 FireFox 攔下。被 FireFox 攔下後，再去企鵝家試，同樣也被攔下 這讓我又開始傷腦筋了
暫時先把目前測試的結果放上來實測一下，等確定後再把程式釋出。
※ dllee 的連結選單 ※(直接選) ※ 隨機看 1 格 ※ 隨機看 3 格 ※ 隨機看 10 格 ※ 一次看全部 LKK 思緒 dllee 加薪貓 《佶也》 豪宅小屋 愛美 萬萬歲 小珊頭喵喵叫 my"感恩.惜福" 也無風雨也無晴 簡單生活、簡單愛 + 紫色幻想空間 + 原來教養是愛這麼回事 Amanda的生活與家常美食 焦糖 繪意記錄 如雲似水 I.P. zone NO VIRUS 企鵝碎碎唸 動漫新樂園 dllee痞客店 想不到的想ａ 一腳踩進多倫多 Belito的香格里拉 seagod的慢遊人生 ☆★驛動的心★☆ il Giardino Romantico 人間仙境紐西蘭美女的家 FUN 攝影 Kerwin 的野兔部落 阿肥(肥滋滋)的便利貼記事本 攝影‧旅行‧拈花惹草→Morris 小笠‧雜筆 寂靜的頻率 怪咖的生活情 旅美熟姐日記 我與小崴崴的工作日記 心 Frank的雜記 由紀小姐の遊園地 Appassionata~她的名字叫熱情 彥子小站 高登工作室 LuSoft’s BLOG 月光下的嘆息！ 索尼斯．網路攻略
P.S. 整理連結, 比寫程式還要花時間呀!! 目前還在整理中... 為了選單美觀，我按格名的字數排列，我猜想，在我整理完成時，可能又得想新的花樣，因為全列在同一個實在是太多了，也難怪企鵝與愛都使用多個連結選單。
2009-02-26
今天使用 IE 測試，結果更慘...
必需要用按鈕的型式才行，此外，也無法一次看一格以上，IE 只會開第一格，其他的都被封鎖快顯
另外，在痞客也放了測試，同樣的語法，同樣的效果，同樣被 IE 封鎖快顯
得再傷腦筋囉 ~ ~ ~
看到許多人已想要自己試了，先說明簡單的兩種選單連結作法。
※ 無按鈕選單連結
以上紅色的部分按紅色的內容修改，或參考上述「踢寶看這邊 ^__^」的實例。格友的部分按相同的格式一直加下去就可以了，非紅色字的部分不要更動，貼文時使用一般編輯器(純文字編輯器/HTML/原始碼 格式)，不要自動換行，這樣應該就可以了。
※ 有按鈕選單連結
改成您按鈕要顯示的文字"
onclick="window.open(this.form.choice.options[this.form.choice.selectedIndex].value)">
以上紅色的部分按紅色的內容修改，或參考上述「去逛逛」的按鈕實例。格友的部分按相同的格式一直加下去就可以了，非紅色字的部分不要更動，貼文時同樣使用一般編輯器(純文字編輯器/HTML/原始碼 格式)，不要自動換行。
摘自:http://blog.yam.com/dllee/article/19679204
全站熱搜
留言列表
知識+ (5)