作者:zcq101
脚本来自WBZD
zcq101
自己用那部分脚本制作截个图来说明下效果
因为是做截图 只拿了两集出来排版制作
自己很佩服zcq101 很强悍 把他的两个帖子贴一起
***************************************************************************************************
↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑华丽的分割线↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑
***************************************************************************************************
这个是使用默认的输出效果 可以看到第一集简介部分在第一集上面
而第二集简介却在第一集和第二集之间
***************************************************************************************************
↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑华丽的分割线↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑
***************************************************************************************************
修改后的效果
引用:
关于下面代码的说明
1.这段代码主要针对有实体书的小说,并不是通用于所有小说的!
2.请注意灵活使用!这点很重要!即使主要针对有实体书的小说,但也不能保证做到100%的通用,因为每本小说的实际情况会不同,所以在应用在具体的小说,要做必要的修改!需要强调的是这段代码是根据数组pages的结构来编写的,修改时一定要参照数组pages的结构,不要盲目修改!
3.关于快速定位,如果出现定位不准确,请根据实际情况修改判断条件!其实,这点应该归类于上一点!
4.我没有添加生成分卷阅读链接的代码,需要的请自己添加!
5.我只测试过几种情况,并不能保证所有情形都适用
复制内容到剪贴板
代码:
<script language="javascript" type="text/javascript">
var i = 0;j=1;
var end = pages.length
document.write("<tr><td align=center colspan=4 height=30><b>第:</b>");
while(i != end)
{
if(pages[i][3] != undefined)
{
if(pages[i][3].substr(0,4) == "<img"||pages[i-1][3] == undefined)
{
document.write("<a href=#zb"+i+" title='第"+j+" 集' style='text-decoration:none;font-size:9pt;padding:5px'>"+j+"</a>");
j++;
}
}
i++;
}
document.write("<b>集</b></td></tr>");
i=0;
while(i != end)
{
document.write("<tr>")
for(nn = 1;nn < 5;nn++)
{
if (i == end)
{
if(nn == 1) break;
else document.write("<td class='tablebody1' align='middle' style='width:25%;height:30'> </td>");
}
else
{
if (pages[i][3] != undefined)
{
if(nn == 1)
{
if(pages[i][3].substr(0,4) == "<img")
{
document.write("<td class='tablebody2' colspan='4' align='center' valign='middle' style='height:30'><a name=zb"+i+"></a>"+pages[i+1][3]+"</td>");
document.write("</tr><tr>");
document.write("<td colspan=1 align=center>"+pages[i][3]+"</td><td class='tablebody1' colspan=3>"+pages[i][1]+"</td>");
document.write("</tr><tr>");
document.write("<td class='tablebody1' valign='middle' style='width:25%;height:30'>");
document.write("<a href=javascript:loadurl('chapter.htm',"+(i+1)+") class=b1 title='本章字数:"+pages[i+1][2]+"'>"+pages[i+1][1]+"</a>");
document.write("</td>");
i=i+2;
}
else
{
document.write("<td class='tablebody2' colspan='4' align='center' valign='middle' style='height:30'><a name=zb"+i+"></a>"+pages[i][3]+"</td>");
document.write("</tr><tr>");
document.write("<td class='tablebody1' valign='middle' style='width:25%;height:30'>");
document.write("<a href=javascript:loadurl('chapter.htm',"+i+") class=b1 title='本章字数:"+pages[i][2]+"'>"+pages[i][1]+"</a>");
document.write("</td>");
i++;
}
}
else document.write("<td class='tablebody1' align='middle' style='width:25%;height:30'> </td>");
}
else
{
document.write("<td class='tablebody1' valign='middle' style='width:25%;height:30'>");
document.write("<a href=javascript:loadurl('chapter.htm',"+i+") class=b1 title='本章字数:"+pages[i][2]+"'>"+pages[i][1]+"</a>");
document.write("</td>");
i++;
}
}//if pages
}//for nn
document.write("</tr>");
}//while
function gotoNextPage()
{
if (window.event.keyCode == 39 && parent.txt != undefined) loadurl("chapter.htm",parent.txt);
}
document.onkeydown = gotoNextPage;
</script>
***************************************************************************************************
↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑华丽的分割线↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑
***************************************************************************************************第二种修改效果
引用:
代码是今中午写的,内容是关于一种目录排版方式,不用修改HP生成的page.js文件中内容,做出来的效果如上图。
说明一下
1.代码是今中午写的,所以没有测试过几本书。不能保证100%通用
2.图片的那些阴影,一致的宽和高,虚线效果,超链接样式等等。这些都是在CSS中定义的!自己去看吧
3.js代码中有空格的html代码,但是在论坛中显示不出来。
4.如果快速定位不准,请自己修改判断条件
5.做出来的效果如果感觉排列的太稀疏或者紧密,自己修改变量h的值。
复制内容到剪贴板
代码:
<script language="JavaScript" type="text/javascript" >
var i = 0;
var h=320;
var m=1;
var end = pages.length;
document.write("<tr><td colspan=2 height=30><table width=100% border=0 cellpadding=0 cellspacing=5 align=center><tr ><td style='line-height:150%;'><b>第:</b>");
while(i!=end)
{
if(pages[i][3]!=undefined&&pages[i][3].substr(0,4) == "<img")
{
document.write("<a href=#zb"+i+" class=b1>"+m+"</a> ");
m++
}
i++
}
document.write("<b>集</b></td></tr></table></td></tr>");
i=0;
while(i != end)
{
for(nn = 1;nn < 2;nn++)
{
if (i == end)
{
break;
}
else
{
if (pages[i][3] != undefined)
{
if(pages[i][3].substr(0,4) == "<img")
{
if(i!=0){document.write("</table></td></tr>")}
document.write("<tr>")
document.write("<td align=center width=25% height=30 class='tablebody2'>本集封面</td><td align=center width=75% height=30 class='tablebody2' ><a name='zb"+i+"'></a>"+pages[i+1][3]+"</td>");
document.write("<tr><td align=center width=25% >"+pages[i][3]+"</td>");
document.write("<td width=75% ><table border=0 width=100% height="+h+" align=center cellspacing=0 cellpadding=5><tr><td width=30%><a href=javascript:loadurl('chapter.htm',"+i+") title='本章字数:"+pages[i][2]+"' class=b1>内容简介</a></td><td width=50%><hr></td><td width=10%><b>第</b> "+(i+1)+" <b>页</b></td></tr>");
document.write("<tr><td width=30%><a href=javascript:loadurl('chapter.htm',"+(i+1)+") title='本章字数:"+pages[i+1][2]+"' class=b1>"+pages[i+1][1]+"</a></td><td width=60%><hr></td><td width=10%><b>第</b> "+(i+2)+" <b>页</b></td></tr>");
i=i+2;
}
else
{
if(i!=0){document.write("</table></td></tr>")}
document.write("<tr>")
document.write("<td align=center width=25% height=30 class='tablebody2'>"+pages[i][3]+"</td>");
document.write("<td width=75% ><table border=0 width=100% align=center cellspacing=0 cellpadding=5><tr><td width=30%><a href=javascript:loadurl('chapter.htm',"+i+") title='本章字数:"+pages[i][2]+"' class=b1>"+pages[i][1]+"</a></td>");
document.write("<td width=60%><hr></td><td width=10%><b>第</b> "+(i+1)+" <b>页</b></td></tr>")
i++;
}
}
else
{
document.write("<tr><td width=30%><a href=javascript:loadurl('chapter.htm',"+i+") title='本章字数:"+pages[i][2]+"' class=b1>"+pages[i][1]+"</a></td><td width=60%><hr></td><td width=10%><b>第</b> "+(i+1)+" <b>页</b></td></tr>");
i++;
}
}//if pages
}//for nn
}//while
document.write("</table></td></tr>")
function gotoNextPage()
{
if (window.event.keyCode == 39 && parent.txt != undefined) loadurl("chapter.htm",parent.txt);
}
document.onkeydown = gotoNextPage;
</script>
下面的CSS代码是让水平线呈虚线显示
复制内容到剪贴板
代码:
hr{border-bottom-style: dotted; border-left-style: dotted; border-right-style: dotted; border-top-style: dotted; size:1px; color:black; text-shadow:none}
***************************************************************************************************
↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑华丽的分割线↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑
***************************************************************************************************
应要求上传附件 不是chm格式
为输出后的文件夹 方便查看代码
以上代码放在index*\jscss\index.js
第二个效果自己修改下单元格大小
附件是修改过的
[
本帖最后由 qqzhal 于 2009-6-9 09:13 编辑 ]