前一篇提到的是隱藏和顯示列的元件，而本文介紹的是這些顯示的元件透過一些技巧可以動態展開和摺疊起來。Sidebar 的元件有的時候可能很長（尤其是網站列表或是 Archive 之類的），想要顯示該元件又不希望過長的元件會影響版面的美觀，這時候我們可以保留它，透過 Javascript 的技巧去動態切換顯示與否。而我看到人家的作法，要做一些麻煩的修改，參考對方的原始碼我寫了因應這個動作的 Javascript，一方面更精簡 Hack 的步驟，也減少原始碼的修改。
根據原文，還有上一篇對 Widget 程式碼的瞭解，要做的工作就是：第一，把想展開摺疊的區塊找出來，第二，做一個按鈕或連結，當按下去的時候，去切換該區塊的狀態（display inline or none）。打開完整範本原始碼，首先貼入處理這個動作的 Javascript (貼在 <head> </head> 標籤內、</style> 後面)：
<script type='text/javascript'>
<!-- Function used for Sidebar Element Toggling: ElementToggle()-->
function ElementToggle(id) {
var element = document.getElementById(id).getElementsByTagName('div');
for(i = 0; i < element.length; i++) {
attribute = element[i].getAttribute('id');
if(attribute == 'toggle')
{
if (element[i].style.display == 'none')
element[i].style.display = 'inline';
else
element[i].style.display = 'none';
}
}
}
</script>
接下來，要去修改元件 (Widget) 的程式碼。同樣以個人資料 (Profile) 元件為例，找 <b:widget ...> 開頭 </b:widget> 結尾的區段，應該是類似下面這樣：
<b:widget id='Profile1' locked='false' title='AUTHOR PROFILE' type='Profile'>
<b:includable id='main'>
<b:if cond='data:title != ""'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
............. (程式內文略過不表)
</b:includable>
</b:widget>
這個元件的 ID = Profile1，是範本裡用來識別該元件的方法，接下來要插入動態切換的連結，為求簡單我先不顧美觀，直接插入像下面的原始碼：
<b:widget id='Profile1' locked='false' title='AUTHOR PROFILE' type='Profile'>
<b:includable id='main'>
<b:if cond='data:title != ""'>
<h2><a href='javascript:void(0);' onclick='javascript:ElementToggle("Profile1");'>[+/-]</a>
<data:title/></h2>
</b:if>
<div class='widget-content' id='toggle' style='display:none;'>
............. (程式內文略過不表)
</b:includable>
</b:widget>
有兩個部分要解釋一下。第一，塞入元件標題 data:title 前面的那行，就是呼叫 Javascript 的連結，其中有一個變數：Profile1，就是告訴 Javascript 你要動態切換哪一個元件，所以如果你有多個不同元件要摺疊，記得除了呼叫切換的這一行要塞入該元件原始碼中，還要更改 ID 名稱。第二個部分，<div class='widget-content'> 這行標籤開始就是元件的內容，也是要被折疊或展開的區塊，如果你希望該文件「預設」就被折疊起來，那就要在後面加入 CSS Style 去起始隱藏它，如果預設是被展開的，就把後面紅色的 style='display:none;' 部分拿掉就行了。最後，如果對以上樣式不滿意，或是想貼用圖片當切換按鈕，記得調整 <a> 連結那行的內容和位置就可以了！
回應: 93
Abin大你好，你所提供的方法比起Benjamin大的方法精簡，可是在ie6核心的瀏覽器無法開合，請問有解決的辦法嗎?
哎呀！謝謝你的提醒，我竟然忘記測試 IE 的相容性了。我已經修正文章，應該沒問題了。
順便說明一下原因：原來在 IE 的環境， Javascript 裡要抓 class 屬性不能用getAttribute('class') ，要用 getAttribute('className') ，所以原來的程式在 IE 下面會找不到 class = widget-content 的程式區段。
我的修正方法很簡單，既然找不到 class，那找 id 總可以吧！所以 Javascript 裡面我把 class 改成 id，widget-content 改成自訂的名稱 toggle，然後修改樣版 template 時，在原來的 div 標籤裡多塞一段識別用的 id='toggle'，這樣 Javascript 照樣找得到這一塊要被隱藏的程式碼區段，同時也可以解決瀏覽器相容性的問題。（再一次證明，IE 真的是爛，為什麼標籤屬性就 class 不能用，明明一切合乎 WWW 的規則..）
沒問題了！Abin大你真行，我又多學一招了。
我來現寶一下, 我也是用javascript寫的,
http://raeltw.blogspot.com/
裡面的綠圈圈可以張開, 再合起來.
詳細說明在這裡.
http://raeltw.blogspot.com/2007/01/blog-post_23.html
謝謝您精彩的教學，又再一次獲益良多啊!
我想請問一下您那動態的[+]、[-]是怎麼做出來的，我很喜歡。謝謝回覆!
To Wylie，那是一個透明背景、動態的 GIF 圖檔，我用繪圖軟體附的動畫工具做出來的，我用的是 Ulead GIF Animator。
你好，如果我不加「id='toggle' style='display:none;'」的話就不能開合了，請問我還要做些什麼嗎？
To: Agrippa，不加「id='toggle' style='display:none;'」當然不能開合，我文章中提到的是，「如果預設是被展開的，就把後面紅色的 style='display:none;' 部分拿掉就行了」，但是 id='toggle' 這一句要留著。
Sorry, 沒有注意到，謝謝你^^
感謝Abin的教學，十分淺顯易懂。
我會用了，謝謝。
弄了好久,終於成功了,真謝謝Abin的清楚教學.不過那個[+/-]要怎麼改顏色呢?
麻煩囉,謝謝!
http://organic-exist.blogspot.com/
To ethan: 那是我自己改的動態的 Gif 圖檔，如果你想要變顏色，要自己製作圖檔，再轉成動畫才行。
您好，請問一下，不知道您這個收合功能，能不能跟羊男 - 三欄式樣版(Gadget1.1)裡所附的標題收合script相容呢？
兩個看來蠻像的，不知道能不能只留一個就行，只是好奇問問看。
謝謝回答。
To Sam:
應該是可以，我的 Javascript 是獨立的，和樣版版面是幾欄、有用什麼其他的 Javascript 沒有關係。除非，你用到相同的函示名稱、還有廣域變數，不然彼此是不會有影響的。
不過，實際上還是要去試試看才會知道啦。
您好，
請問一下如果我想另外加一個讓全部原件一起打開或合上的功能，
javascript的部分要怎麼修改，
自己試著改卻找不到合用的method，謝謝。
To Shiami:
要全部收合某些元件，如果這些元件程式碼有連在一起，你就在他們的前後用一個標籤 div 或 span 括起來，給一個 class name，然後套用我的程式碼，直接 hide 該元件。如果那些元件是並存於同一個 blogger 元件 (div) 裡，這樣做最快最簡單。
如果每個元件都有定義的名稱，可以在 javascript 裡面同時對多個元件做隱藏，呼叫多次 ElementToggle() 就可以了。
這個修改是需要有程式碼基礎的，希望你看得懂我在說什麼，如果看不懂的話亂改可是會讓版面毀掉的。
謝謝您的回應，我是有許多的網頁元素各自可以開合，但我想要另外加一個可以一次toggle全部同時展開/收合。我之前試過將onclick那段語法加到新的html/javascript網頁元素內，但似乎語法會被blogger誤判，直接改寫在template內就沒問題了。
作者已經移除這則留言。
Abin你好！
请问我的[+/-]为什么不能展开也不能摺疊呢？看到[+/-]但是按不到。。。T.T
To myukoo:
我查了你的代碼，不是把上面的程式碼直接剪貼就可以用！ElementToggle() 函式是用來隱藏特定區塊，括號裡用的是該區塊的 ID，我有 "Profile1" 但你沒有啊！整個貼進去也要修改一下吧。
你有的區塊像是 "BlogArchive1", "LinkList1" (找一下你的代碼就知道), 把 Profile1 改成你自己的區塊才會動。
Abin 谢谢你，
我已经做到了，还受益不浅呢！
我有一个小小的要求，我能否把你的教学指南转去我的部落呢？谢谢您！---- ^_^
To myukoo:
很高興有幫忙到，要轉載歡迎，有標明出處就可以囉～
作者已經移除這則留言。
To Jyue Loh:
那是你其他的代碼裡有問題，從錯誤訊息裡可以得知，是有個 <div> 沒有結束標籤 </div>，請自己檢查你的範本程式碼。
請問 你的code是怎麼貼上去的呢？ 我有參考你的「程式碼的標記區塊」那篇文章，可是要貼像這樣的東西就會出不來耶～"＜link rel="StyleSheet" href="http://kendhin.890m.com/dtree/dtree.css" type="text/css" /＞
To ducklynn:
「程式碼的標記區塊」文章講的是程式碼段落的「樣式」，並不是說，在那一段「樣式」裡面你貼入什麼程式碼都可以用！
如果你要貼程式碼，尤其是有標籤（< >）或特殊符號（&），我建議你用特別的編輯器（我是用 Google Doc），然後轉成 HTML 碼，再把 HTML 碼貼進去程式碼樣式那個段落裡面，那樣那些 HTML 的保留字元或特殊符號，才能夠正確的顯示。
作者已經移除這則留言。
Abin大大，你的方法我都照做了，但是出現一個怪現象，那個{+/-}只會在網頁讀取一半時出現，並且可以點選，若整個網頁讀完了，{+/-}又消失不見，無法點選，但是看的出來他是存在的，因為我sidebar的標題都會空出好幾格，這種情況該怎麼處裡呢？先謝謝你了。
To wesleypig:
我到你的網頁看了一下，我看不出來你原始碼有「照作」什麼修改。發問後好歹保留「事故現場」吧，光這樣的文字敘述我實在也沒什麼頭緒。
我只能猜想，你把 div 標籤的位置和 {+/-} 有放錯，導致一開始讀取還沒被藏起來的部份（style='display:none;'），還沒讀完看得見、一讀完就藏起來，而且你的 div 標籤只包含到標題、並沒有包到整個區塊，所以「屍體」還留在標題前、造成「空出好幾格」。
我想再次重申，更改這類有用到 div 標籤的 hack，很容易因為每個人樣板模組的不同，而有不同的影響和錯誤現象，絕對不是什麼「你的方法我都照做」就保證會成功的。改動這些模板前記得先備份、並且確定知道你在做什麼，才能調整出符合自己需求的樣子。
Abin大大，非常不好意思了。讓你白跑一趟了，當初想說沒有弄好，就先將他清除編輯了。目前我還算是新手，那我會再去好好研究一下，在試試看你說的那些可能，自己摸索看看，總之.....實在是麻煩你了@@"(如果還是不行，我下次會保留案發現場的)
Abin大大 你好:第一次留言,打擾了!
常常來逛你的部落格,你清楚的教學讓小弟受益良多!
尤其是這篇"讓側邊列 (Sidebar) 的元件能夠展開和摺疊 (Element Toggling)"這困擾我很久的功能終於完成了!
不過還是有個問題要向你請益:
就是關於教學文裡第三個步驟中的一段程式碼(紅色)
照著你的教學我已經完成了摺疊功能,可是我希望能夠將小圖示[+/-]作成像你這樣的動態GIF檔,我該在語法中如何作修改?
PS:我已經完成GIF圖檔製作了...
希望在你有空時,可以教我,謝謝!!
這是我剛施工的部落格:http://macotoworld.blogspot.com/
To macoto:
看來大家對那個動態圖示都很有興趣。首先，之前的回應我有提到，那個動畫圖示我是用 Ulead 的 GIF Animator 製作的，會動是因為那是動畫，不是靠什麼特別語法「動起來」的。我不知道你「已經完成GIF圖檔」是不是「動態 GIF」，如果是靜態圖示，請先找工具製作成動畫。
如果你已經有動態的 GIF 圖示，那麼只要把圖片上傳、將 [+/-] 置換成圖片語法: <img src="圖片網址"/>，這樣就行了。
Abin大大:謝謝喔!!真的很感激! 對於你迅速的回覆真的很高興也很驚喜~
今天終於把摺疊的作動功能順利完成!!
還是再次跟你說聲: 謝謝!!
請問能讓我看看↓
---------------------------
參考文章：
折疊側邊欄之"愛折哪個就折哪個"
---------------------------
嗎?
To leo_chen:
那是我曾經參考過的文章，Blog 所有人不是我、我也不認識。
不過看起來，該文章已經不允許一般人公開閱讀了，真的要看請您自己和那個 Blog 的主人聯絡。（既然不能閱讀，那我也把參考連結刪除了..）
謝謝你的分享，令我的 Blog 實用了很多，在此有個問題想請教一下。
同一行當中不能用普通語法同時置左及置右，所以 Sidebar 的 名稱與 +/- 號都擠到同一邊，但看到你的站中 Sidebar 能夠做到文字靠左而 +/- 的圖片靠右，請問怎麼做到？是否在上述留言回覆中提及到的透明背景？請問語法能教一下嗎？
抱歉麻煩到你，謝謝分享及指教。
To POYI:
你說得沒錯，「同一行當中不能用普通語法同時置左及置右」，我的作法是該行文字樣式其實是靠左 (text-align:left)，所以 Sidebar 名稱是靠左沒問題。
而那個靠右的 +/-，我另外定義了一個 span 的 class，而那個 class 其中樣式定義是 float: right，這樣就可以做出同一行靠左又能靠右的樣子。
另外，上面提到關於圖片的透明背景，那不是靠 CSS 或是 HTML 語法做到的，是靠「繪圖軟體」（小畫家不行），透過繪圖軟體的遮罩、去背等等技巧把背景顏色單純化，然後轉存成 .gif 或是 .png 這種支援透明背景的圖檔，在網頁上就會顯示成透明背景了。
原來是說圖片背景，抱歉誤會了是網頁的背景。
再次感謝詳細的解答，去找了找float的代碼，終於成功了。閒來看看實在獲益良多，謝謝。
您好 我照您的方法使用後發現我的blogger在FF3中不能正常開合，但在IE7中就可以。不知道要怎麼修改呢? 先感謝您
To Jason:
抱歉，我還沒換用 FF3，我現在用 FF 2.0.0.15 都很正常，哪天我覺得 FF3 比較成熟穩定、或是 FF2 停止更新後才會換裝，到時候才有機會檢查是不是瀏覽器相容的問題。
不過我忽然發覺我用您的網頁時開合功能是正常的，所以應該也是我某個地方出錯了..不過不知道錯在哪就是了 囧
你好,謝謝Abin所提供這麼好的blogger改造文章，我的blogger終於可以有最新回應的功能，不用在一篇篇從文章大海中看回應，不過對於側邊列展開及折疊部份屢試不成，頁面出現亂碼的狀況，這部分是否可以請教該如何解決呢？謝謝～～另外我想把你的blog放置在我的最愛連結裡，是否可以呢？？？
To Ms.Cleopatra:
「頁面出現亂碼的狀況」，這個問題單從這句話是沒辦法判斷的，除非讓我看到發生亂碼的原始碼或樣板，不然無從判斷起原因。
另外，很歡迎將我 Blog 網址放置在您的最愛連結，這是我的榮幸。
大大您好
請問您一個問題喔
這個展開和摺疊是會先讀取所有的元件嗎?還是把她展開才會讀取
因為我在我的部落格上裝了個即時通訊的
元件他每展開一次就要重讀取一次
PS.
順便請問大大的文章可以給我轉嗎?
有不少讓人做到這個功能的教學不過就您寫的最好說
To OldNick:
上面程式碼的作法，只是把 display 設成 none，所以只要是畫面上有的模組或 flash，載入時統統都會讀進來，然後才讓它們看不見，所以這個折疊的 Hack 只能讓版面變得比較清爽，沒辦法減少讀取增快速度。
您要轉用文章很歡迎，請記得標明引用出處即可。
你好
感謝你的分享
這是一個很好的功能
我在個人blog中引用你的這篇文章
想把這功能讓更多人知道
若你覺得不妥 請告知
我在把文章刪除
謝謝
謝謝 Abin 的教學，我的部落格也用上了你的技巧了 :)
你好 版大
請問如何像你一樣 把你的[+/-] align在右邊呢?
我試過 ＜div style="text-align: right;"＞ 不過會掉在下一行..不好看呢 ^^
請幫忙 thx a lot!
To Aka Clauris:
靠右的問題，請您參考上面我給 poyi 的回覆。
作者已經移除這則留言。
Abin版大,您好:
我很仔細看了您的解說,也一步一步把我的HTML改了
但只能作到看到[+/-],無法收摺,有點像是MyUKoo遇到的問題,但我確定改了我的ID
請問改ID是只有在您文中第三段程式中要改,還是第一段也要?
對程式及HTML這類,小弟實在很外行,只能麻煩您有空方便的話,幫我看一下了,謝謝!
另外,如何才能像您的BLOG INFO一樣,把那麼多東西整合在一起,再加一個收摺,實在太棒了
To 投資理財911:
你 Javascript 的位置貼錯了。是貼在 >head< 標籤裡面沒錯，但是，Javascript 要貼在 CSS 樣式 (style) 的區段外（後面）啊！那是程式碼，並不是樣式的定義，請參考一下我 Blog 的原始碼，參考一下放的位置。
Abin版大,感謝您,問題已解決了,原來我的HTML中沒有＜style＞,所以不知放那,現在放在＜/head＞上方,就OK了,謝謝您!
請問一下若要使網頁元素點擊才執行該怎麼作呢？因為若只是隱藏起來仍會執行那些元件，因此希望改成當使用者點擊展開元件時才執行
To riceone:
這個問題比較麻煩，我也試過調整但做不到，因為 Blogger 內附的大部分網頁元素，都用到不少 Blogger 的自訂標籤和變數，而這些東西載入是有順序性的，它會限制你應該載入的時機和位置。
因此，這些網頁元素「一定」要在整個頁面載入時一併載入，如果你想事後、或點擊時才執行，就會發生錯誤。不過有一類網頁元素可以例外，就是自訂的 HTML/Javascript 這種，因為自訂程式碼的部份用的都是使用者想顯示的自訂內容，當然高興怎麼顯示、顯示什麼都可以調整，搭配本篇的技巧，這類自訂程式碼的模組就能做到，不過每個人用的 HTML/Javascript 網頁元素都不一樣，這裡就很難舉例或改寫給你參考了。
抱歉那麼晚才回，因為這幾天我依照原作給的提示自行作了嘗試卻一再失敗，沒基礎還是很難看懂 >"<。放上原作連結，不曉得Abin兄看完後能否有更清晰的思維？
http://mania.raelelohim.com/2008/11/blog-post_18.html
To riceone:
我的思維一直都很清楚..XD 該文的作法我也看過了，因為沒有需求和興趣，所以也沒想要動手改。
大原則是這樣，基本上你只要將點擊才去載入和處理的部份程式碼包裝在 Javascript 的函式裡（readpost0, handlepost0..），當使用者按下按鈕（onclick）就可以去動態載入了。該文作者比較特別的是這些動態載入的區域（DIV）是 floating 在畫面上，因此多做了小視窗的切換開關（divswitch0）、還有要抓游標位置的判斷（getMouseXY），如果你想做得一模一樣，那還是要根據你的樣板原始碼做一點調整了。不過要很小心，和作者說的一樣，沒基礎的輕易常識是會整組壞掉的，要勤做備份。
感謝Abin兄總是迅速的回覆，我會再嘗試的，其實概念基本算清楚，只是不懂得如何寫出那些命令，也不想照本宣科做出與原作一模一樣的東西，因此才想利用Abin兄此篇教學再與原作的教學作結合。
你好...因為我也想把[+/-]擺在右邊..可我還是不知道要貼什麼語法上去.
所以就偷看(?)了一下你的原始檔...
想說不知道是不是下面那一段...
http://i68.photobucket.com/albums/i28/kay8078/Blog%20something/QQ.jpg
可是貼上去之後[+/-]還是沒有靠右邊耶..
我家部落格http://kay8078.blogspot.com/
麻煩大大替我解答囉~@@
To Kay:
程式碼是對的，但是你用錯了。你要把 <a href=' ..... [+/-] </a> 放到 <span> </span> 的標籤範圍內。剪貼前要先知道那段程式碼的意義和用法，該段 span 標籤是在定義「靠右」的樣式沒錯，但你要靠右的東西沒放在標籤內怎麼會有效哩？
我貼上去之後可以按
但是不能伸縮
都沒反應
(我是改了我的"最新回應")
我的部落格http://ctjh9626.blogspot.com/#
變數我也改了
就是沒反應
恩恩~真的很不好意思囉~
自己的確對這些語法阿什麼的不太熟悉..
還是很謝謝你替我解答囉~@@
按 Abin 格主的詳細解說
小格 http://pinggis.blogspot.com/
也伸縮自如了!! 謝謝分享!
最近放java cript,blogger只要傳單篇文章給別人看
就會跳出internet無法開啟的視窗,
好不容易看到abin格主的網頁卻不敢用,
可以麻煩格主教我如何修改才不會出現錯誤嗎?
To 史黛西:
你的問題在 IE 會發生，在 Firefox 不會。我看了一下，無從幫你 debug 起，請自己回想你最後改樣板做了什麼、或是試著拿掉幾個你裝的外掛，看看是不是哪個外掛衝突到。
Abin大大~
我真的是個粗心鬼....最後裝的是繼續閱讀
但我拿掉後還是一樣耶....
後來我又陸續拿掉左邊的外掛才好一些
不過版面也變的很平凡
現在最想用的是繼續閱讀和你的側邊欄縮起
我改天來試看看好了
Abin 兄， 我看过了回复， 但不是很懂。。。
请问我想将我的几个link lists元件，用一个[+/-]伸缩,我该怎么做?
这个[+/-]我想放在一个 总标题 的下方。。。。
麻烦指点
其实我是否可以用两个html/javascript 的元件。。一头(好站连连)一尾 的 包着 要[+/-]伸缩的多个link lists元件呢？
To 王子:
這個功能是讓每個元件能夠展開折疊。本文舉的範例是用一個「個人簡介」的元件 (widget id='Profile1')，在上面加上這個功能。
請先搞清楚那些你要「伸縮」的元件原始碼是什麼，然後照著上面的範例改法加入修改，這個功能並不是照抄剪貼就能達成的。
Abin, 出现状况。。。我用bloglist 来尝试。。。他显示
Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: Element type "div" must be followed by either attribute specifications, ">" or "/>".
为何呢？
Abin兄，抱歉。。。我找了很久。。。还是找不出原因。。。
to Abin
謝啦,照你的方法,我也完成側欄摺疊
有一問題想請教,就是展開或折合都是按[+/-] id (id=文章分類,等等 的符號,當然也可以修改成其他的;
我想將[+/-] 修改成id,納我直接點id就可展開側欄,不過,卻會出現兩個id
請問有辦法修改成只有一個嗎
To 阿堡:
我不懂你說的 按[+/-] id、這裡的 id 是指什麼？是指 widget id 嗎？這個 id 怎麼會出現在連結裡哩？不懂？！
我上面的範例是，連結只有在括在 [+/-] 上面，所以能夠點的只有這個，並沒有 id，你這樣說我實在看不懂，有範例嗎？
To Abin
sorry,敘述不夠清楚!我最近瀏覽到一個blog,http://whclive.blogspot.com/
他的sidebar,如Categoris,Recent comments等等,直接點選,就可展開,縮何
像這樣要怎樣修改!?
To 阿堡:
像我是用＜a href=""＞把 [+/-] 包住，他的作法是沒有這個符號，連結直接把 widget 的 title 包起來，以上面程式碼當範例，改成像是這樣：
＜h2＞＜a href='javascript:void(0);' onclick='javascript:ElementToggle("Profile1");'＞＜data:title/＞＜/a＞＜/h2＞
這樣就「點到標題即可以展開縮放」。這只是樣式和版面的問題，無關功能。
To Abin
謝謝,我學會了,
sorry,語法,架構還在摸索中~~~
有可能將大大所製作的旋轉圖示給我嗎^^"
To kimihu:
看原始碼另存新檔就行了。圖片網址：http://abinlink.googlecode.com/files/sign.gif (因為是透明底圖、白色，所以你打開連結是「看不到」的）
真的很感謝你的分享~
我有加到我的blogger:http://kimihu.blogspot.com/
thanks ^^
另外還有個問題如何將[+]靠右~
有比較容易的方法嗎?語法又要加在哪個位置~
就算不與標題同行也可以...
To kimihu:
靠右和對齊是標準的 CSS 語法，你可以查看我的原始碼參考 style='float:right;margin:-28px 0;cursor:hand;' 的作法。
請問這種伸縮只能用在sidebar嘛？
我想套用在menu上 因爲menu程式碼不同所以不知如何能辦到？
圖示的套用我已經成功了～～～
我想再請教一個高難度的問題，就是在伸縮的時候加上音效不知有何辦法？
To iLYuSha:
這種展開折疊的效果是透過 CSS 來達成的，你所謂的 menu 我不知道是啥，不過只要是網頁套用 CSS 來呈現，都可以有類似效果（不過要注意不同瀏覽器語法和效果都可能不大一樣）。CSS 基本上目前不能處理音效事件，這方面請自己 Google 去學習 CSS 的相關語法規則和限制。
我照這篇教學改了，開啟Blog也沒問題，可以正常顯示。
但接著按[+/-]後,IE出現"網頁發生錯誤"訊息，當然縮放動作就沒完成。
我進一步查該錯誤訊息如下：
訊息: 必須要有物件
行: 1410
字元: 1
程式碼: 0
URI: http://glanceofray.blogspot.com/
麻煩Abin幫忙看一下我的問題出在哪裡？
謝謝！
我的問題已經解決了。
上面的Javascript程式碼在新版界面下不要直接複製到＜head＞＜/head＞間，必須先新增一個Javascript/HTML小工具，然後將上面內容複製到該小工具的內容中即可
To lin:
我是放在 head 中間沒錯。直接看我網頁的原始碼應該也找得到，有可能是特殊符號轉換的問題。
TO Abin
請問要如何在分類當中加入小分類並把文章分類至小分類裡面去呢??
謝謝喔^^
TO: 樓上的....可以參考一下這篇(在BLOG加入樹狀連結清單)
http://nekki1409.blogspot.com/2008/03/blogger.html
TO: ABIN
上面JAVA一開始要新增到HEAD之間的程式碼是不是有變成亂碼了??@@
這一串..........'none'
To JUN:
那不是亂碼，＆＃39; 這種是 HTML 的特殊字元，請參閱：http://llizard.etherwork.net/cwc/charactmap.html
TO ABIN:
恩!!謝謝你的解說.因為我在想說那個不知道會不會有什麼影響之類的~
因為我的BLOG裝上之後..他原本的框框會變形耶~
而且我找不到style.所以就把一開始的JAVA直接放在(/head)之前.@@
我的測試網頁http://junblogspot.blogspot.com/
張貼留言
歡迎留言或發表意見，不過要理性、不做人身攻擊。匿名的朋友得到回應的速度會比較慢喔～
發問相關的禮貌和規矩請先參考這篇文章，不當留言、和本文無關的回應可能會被直接刪除或無視喔！