ZBLOG改造计划之KTabs篇（2007年12月5日更新）
详细请看：[url=http://www.k-zone.cn/zblog/post/4u-HK-KTabs.html]http://www.k-zone.cn/zblog/post/4u-HK-KTabs.html[/url]
[color=#ff00]2007年12月5日更新：[/color]
修正了一个BUG！
BUG产生原因：
只有使用了本插件（[url=http://www.k-zone.cn/zblog/post/4u-HK-KTabs.html][color=#800080]KTabs[/color][/url]）才能产生这样的BUG。
BUG产生效果：
在使用本插件后，在任意浏览器里面进行留言的回复就会产生一个JavaScript错误。
BUG的影响：
虽然会产生BUG，但是不会影响用户的留言回复功能，因此这个BUG只会造成较差的用户体验性。
[b][color=#ff00]BUG解决方法：[/color][/b]
[b][color=#ff00][url=http://www.k-zone.cn/zblog/post/4u-HK-KTabs.html]http://www.k-zone.cn/zblog/post/4u-HK-KTabs.html[/url][/color][/b]
[color=red]2007年12月4日更新：[/color]
具体效果，请看[url=http://www.k-zone.cn/zblog/post/4u-HK-KTabs.html]http://www.k-zone.cn/zblog/post/4u-HK-KTabs.html[/url]页面的中部，即出现Tabs的地方(*^__^*) 或下面的截图
[img]http://www.k-zone.cn/zblog/upload/ktabs.jpg[/img]
改造对象：
[b]single.html[/b]和[b]b_article-single.html[/b]，即[url=http://www.k-zone.cn/zblog/catalog.asp?tags=Zblog][color=#598d32]ZBLOG[/color][/url]的文章页！
适合对象：
任何版本的[url=http://www.k-zone.cn/zblog/catalog.asp?tags=Zblog][color=#598d32]ZBLOG[/color][/url]，当然更可以和[url=http://www.k-zone.cn/zblog/catalog.asp?tags=4u%2DHK][color=#598d32]4u-HK[/color][/url]完美融合，同样适用于任何使用HTML代码的地方(*^__^*)
[b][color=#ff0000]下载地址：[/color][/b]
完美无缝整合[url=http://www.k-zone.cn/zblog/catalog.asp?tags=4u%2DHK][color=#598d32]4u-HK[/color][/url]
下载请去：[url=http://www.k-zone.cn/zblog/post/4u-HK-KTabs.html]http://www.k-zone.cn/zblog/post/4u-HK-KTabs.html[/url]
[url=http://www.k-zone.cn/zblog/upload/4u-HK-update-KTabs.rar][color=#598d32]4u-HK-update-KTabs.rar[/color][/url]升级包使用方法：
将解压缩后的两个文件夹分别覆盖到[url=http://www.k-zone.cn/zblog/catalog.asp?tags=Zblog][color=#598d32]ZBLOG[/color][/url]根目录下面，注：请先备份原来的single.html和b_article-single.html
适合浏览器版本：
IE6、IE7、Safrai3.04、Opera9.5 Alpha、FireFox2.X、FireFox3.X（由于JQuery的强大兼容性，基本上可以适用于任何版本的浏览器）
优缺点：
优点：显而易见，给予blogger更佳浏览效果、更棒的用户体验、还会减少文章页的长度。
缺点：1、由于在页面Loading的时候会加载JQuery，因此会拖慢页面的Loading时间。不过我完全感觉不到有什么拖慢的现象存在，还是要得益于JQuery的强大效率。
2、在某些浏览器中会出现错误，我只的这些浏览器是类似IE4、IE5等老古董的浏览器了，因此绝大多数正常情况也应该没有问题！
总结：基于以上两个缺点是很难出现的（只有非常古老的古董级别的浏览器才能出现问题）因此可以忽略不计(*^__^*)
[b][color=#ff0000]具体修改步骤：[/color][/b]
首先下载JQuery的效果包，下载地址：[url=http://www.k-zone.cn/zblog/upload/KTabs.rar][color=#598d32]http://www.k-zone.cn/zblog/upload/KTabs.rar[/color][/url]，解压缩后将其放入plugin目录下面。
1、single.html页面的改造步骤
使用文本编辑工具打开single.html，将以下代码复制到</head>前面。
<script src="[color=#ff0000]<#ZC_BLOG_HOST#>plugin/[/color]KTabs/jquery-1.2.1.pack.js" type="text/javascript"></script>
<script src="[color=#ff0000]<#ZC_BLOG_HOST#>plugin/[/color]KTabs/ui.tabs.js" type="text/javascript"></script>
<script type="text/javascript">
var $j = jQuery.noConflict();
$j(function() {
$j('#[color=#3366ff][b]K[/b][b]Tabs[/b] [/color]ul').tabs({ fxSlide: true, fxFade: true, fxSpeed: 'normal' });
});
</script>
在<Title>的前面加入如下代码
<link rel="stylesheet" href="[color=#ff0000]<#ZC_BLOG_HOST#>plugin/[/color]KTabs/ui.tabs.css" type="text/css" media="print, projection, screen">
以上，single.html的改造完毕(*^__^*)
PS：以上步骤只使用与ZBLOG程序，而其他程序请将红色部分换成相应的绝对路径，其他步骤一致！
2、b_article-single.html页面的改造步骤
使用文本编辑工具打开b_article-single.html，在适当的位置加入如下代码（适当的位置是指：想要显示Tabs的地方）
<div id="[color=#3366ff][b]KTabs[/b][/color]">
<ul>
<li><a href="#[color=#ff0000]tabsview-1[/color]"><span>Tab1的名称</span></a></li>
<li><a href="#[color=#ff0000]tabsview-2[/color]"><span>Tab2的名称</span></a></li>
........................
<li><a href="#[color=#ff0000]tabsview-n[/color]"><span>Tabn的名称</span></a></li>
</ul>
<div id="[color=#ff0000]tabsview-1[/color]">
内容1
</div>
<div id="[color=#ff0000]tabsview-2[/color]">
内容2
</div>
........................
<div id="[color=#ff0000]tabsview-n[/color]">
内容n
</div>
</div>
注：其中[b][color=#3366ff]蓝色黑体字[/color][/b]部分一定要和single.html中的保持一致！
[color=#ff0000]红色字体[/color]部分要一一对应！
最后，将[url=http://www.k-zone.cn/zblog/catalog.asp?tags=Zblog][color=#598d32]ZBLOG[/color][/url]用户进行文件重建和索引重建即可完成(*^__^*)
是不是很简单啊，呵呵JQuery的魅力就在于此，祝各位使用者顺利添加(*^__^*)
[[i] 本帖最后由 kenshin520 于 2007-12-5 12:40 编辑 [/i]]
