当你鼠标指向其中一个标签菜单时，它会扩张开来
登入博客 - 信息中心 - 设计 - 修改HTML
CTRL+F找<head>
将以下的代码paste在<head>的后面
<script src='http://pujangga.googlecode.com/files/jquery.tools.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$("#accordion").tabs("#accordion div.pane", {tabs: 'h2', effect: 'slide', initialIndex: null});
});
</script>
就像这样：
保存模板。
最后再到 页面元素 - 添加小工具 - HTML/JavaScript
Copy以下的代码Paste到HTML/JavaScript
<style type="text/css">
h5 {
font-family: trebuchet-ms, arial, tahoma;
font-size: 13px;
padding: 0 0 1em;
font-weight:bold;
color: #ffffff;
}
.msg_list {
list-style: none;
margin: 0;
padding: 0;
width: 100%;
}
.msg_head {
padding: 5px 10px;
cursor: pointer;
position: relative;
background-color:#FFB6D6;
margin:1px;
-moz-border-radius: 35px;
border-radius: 35px;
}
.msg_body {
padding: 5px 10px 15px;
background-color:#FFFFFF;
}
</style>
<script type="text/javascript" src="https://sites.google.com/site/jquery01/tabmenuaccordion.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
//hide the all of the element with class msg_body
$(".msg_body").hide();
//slides the element with class "msg_body" when paragraph with class "msg_head" is clicked
$("#firstpane h5.msg_head").click(function()
{
$(this).next("div.msg_body").slideToggle(700).siblings("div.msg_body").slideUp("slow");
});
//slides the element with class "msg_body" when mouse is over the paragraph
$("#secondpane h5.msg_head").mouseover(function()
{
$(this).next("div.msg_body").slideDown("slow").siblings("div.msg_body").slideUp("slow");
});
});
</script>
<div class="msg_list" id="secondpane">
<h5 class="msg_head">标题 1</h5>
<div class="msg_body">
<center>
标题 1 里面的内容</div>
<h5 class="msg_head">标题 2</h5>
<div class="msg_body">
标题 2 俩面的内容
</div>
<h5 class="msg_head">标题 3</h5>
<div class="msg_body">
标题 3 俩面的内容</div>
</div>
温馨提示：
*青色字体是标签菜单的字体颜色
*橙色字体是标签菜单的背景颜色
*蓝色字体是标签菜单 里面的内容背景颜色
*粉色字体是你要写的标题
*红色字体是标签菜单里面的内容（你也可以放聊天室代码在里面，任何什么都行
*注 如果菜单死板板的扩展不开来的
CTRL + F 找 </html>
在 </html> 前面添加以下代码
<script type="text/javascript" src="https://sites.google.com/site/jquery01/tabmenuaccordion.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
//hide the all of the element with class msg_body
$(".msg_body").hide();
//slides the element with class "msg_body" when paragraph with class "msg_head" is clicked
$("#firstpane h5.msg_head").click(function()
{
$(this).next("div.msg_body").slideToggle(700).siblings("div.msg_body").slideUp("slow");
});
//slides the element with class "msg_body" when mouse is over the paragraph
$("#secondpane h5.msg_head").mouseover(function()
{
$(this).next("div.msg_body").slideDown("slow").siblings("div.msg_body").slideUp("slow");
});
});
</script>
51 道泪痕:
明天我有时间可以分享你这篇吗？我试试看之后再分享我的版本的。
:P 你会介意吗？:P
请问热门贴子会自动上下移位，是怎样弄得呢?
能叫图片能移动的吗？
我弄不到 ><
请问怎么放朋友的连接呢？
要如何把链接列表也放进去？
標籤內容裡面只能打一行字罷了嗎?
愛夏を静
嗯，会写出来 =）
choco
可以用 marquee =）
Elise WLY ♥
可以详细点说吗 =）
不明白那里可以问
Shiyinq
放她的博客链接，更改“网址名称”就好了
泄气的气球
放博客链接，更改“网址名称”就好了
YT
打几行都可以=）
我弄了，可是它帮我开了新的一行pages标题再，鼠标碰到会展开小标题，可是按不进内容。如果我的部落格模板已经有了pages的格式，我要把本来模板里的pages弄成可以展开小标题的呢？展开后可以直接按进小标题的内容吗？
用了哟~谢谢你的教程嗯..成功了=D
looloo
不是很明白地说，希望能说明详细 /_\ 那个标题是按不到的，只是指向它才会扩展开来。
XiiaoXiian_Amelia
不客气 XD 恭喜成功了～
谢谢^^
我真的很喜欢
谢谢你的教学
哈哈，不客气啊，我也很喜欢这功能地说 XDD 减少空间～
我弄了..但是为什么不用动都已经展开来..而且不能弄回去..
教程后面已经写了解决方法
就是那个 “ 如果菜单死板板的扩展不开来的 ” :)
不是展不开来...而是已经展开..不能动的..
你到我的部落格看看...
http://just-be-elaine.blogspot.com
你拉到最下面..然后在右手边..
嗯，没错的，你照着坐就对了
我成功了
可是我想加多多个
要怎么做勒?
直接加在后面的
从 div class="msg_list" id="secondpane"
开始copy ，然后继续paste在下面
我拿了 :) 谢谢 ...
请问 打了三行字 ...但是comform了,为什么它又变成一行?
记得要打 《br》 空行 =）
《》 改成 <> 因为这里放不到代码 不好意思 =）
好的 :)) 非常感谢 :)
мει хιи
不客气 ^^
谢咯 ;)
那个 *注 如果菜单死板板的扩展不开来的
在哪里按？
成功了~^^
thx for ur teaching =)
傻猪
不客气^^
吟 ツ
唔，你的扩展菜单有这问题吗，有的话就做那个步骤就可以了。
мιcнɛℓℓɛ ʏɛσн
哈哈，恭喜成功，welcome ^^
谢谢你丫，加油啦
我拿了
我的扩展菜单动不到
想要根据【*注 如果菜单死板板的扩展不开来的】
但是我完全不明白那些教程><
Sing Yee
不客气，你也要加油，也谢谢你的通知了啊 ^^
ZqinG
扩展菜单动不到 就看 【*注 如果菜单死板板的扩展不开来的】
就是在 修改HTML CTRL+F找 《/html》 （在最下面最后面那里的）
在他前面paste code就行了
哦，成功了哟
谢谢你的教程和解释 :)
谢谢教学 , 拿走了喔 :))
ZqinG
不客气，恭喜成功 ^^
K-Xin Ker Xin Yap
不客气，谢谢通知了 ^^
请问为什么我第一个和第二个能打开罢了...第三个不能打开的??
1. 看 *注 如果菜单死板板的扩展不开来的 那里
2.删了东西，漏了代码，注意你“标题三”内容那里是不是有少了什么代码
3.以上方法都不能的话，建议重新拷贝代码弄过
1和2没有用...haizz...还要重新做过...>,<
但要谢谢你吖^^
请问为什么我的菜单过了一段时间就会自己扩张的? 我没有指向菜单，它自己就扩展开来的?? =O 我已经跟着《如果菜单死板板的扩展不开来》那边做了，不过后果就是真的'菜单死板板的扩展不开来'xPP 如果解释不是很清楚，请到我的部落格看看“病情” ><''
抱歉、为什么它一直都在摊开着 、关不了
已照着 《如果菜单死板板的扩展不开来》 那来弄了 >//<
能放照片的吗?能的话要怎样放?
Sorry啊.. 我拿了你的东西一直想要留评论给你可是都找不到你发表评论的在哪里..现在拉下来才看到..
你的教程真的很好..看得很明白..写到很详细..真的很谢谢你呀..
做莫我的是直接開在那邊的?我那個代碼加了還是一樣，就是你這篇最後寫的那個開不來的，
那，标签菜单又怎么做？
独泪、我可以分享这个过程么？
谢谢XD很好用哦~
blogskin能用么?
弄到了
谢谢 (:
要加多几个要怎么弄呢～
成功了
謝謝 ^^
我的菜单死板板的扩展不开来，可是找不到< /htm l>
发表评论