很久以前,就想制作一个一体化的网页。准确地说,是一体化的静态文本网页。网页一体化,就是在一个单独的html网页中,内置所有JavaScript程序和CSS样式表,不插入任何图片和其他多媒体,建立尽可能少的必要功能,页面简洁清晰,操作简便,并开放源代码,可以修改整理的一本电子书。比起目前网络上流行的各种形式的电子书,具有体积小、速度快、可编辑、便于管理、无不良代码安全可靠等优点。很明显,它不同于互联网所用的动态交互网页,目的只有一个,在一个清新愉悦的界面下脱网看书。
这个念头起源于寡人爱看的网络小说,无论是各个网站的网页页面发布的小说,还是后来的TXT打包小说,都存在着段落错乱、排版不整、甚至内容缺失的缺陷。于是对一些堪称经典的小说文章,没事时候自己重新排版,下载原文用编辑器编辑,去除掉所有无用字符包括空格,标点符号修改成中文文本格式,整理段落,在每个段落前加上两个文本空格,后面加上网页的回车符,设定网页的前景文字和背景的颜色,最后加上网页头和尾的标示,成为一篇最简单的网页小说,以便保留。这样的页面可以随自己喜好改变颜色和大小,在页面上直接选择复制就是一篇TXT小说。后来感觉在一个页面上显示一篇短篇还行,但显示中长篇时就会拖动困难,有时不小心一跑掉也很难找回原来阅读的地方,于是就考虑把那些比较长的文章按章节分别显示。开始是在文章开头编制一个简单菜单,用<A>跳到所指定的章节,结尾可以返回。后来采用过帧框架和<iFRAME>内框架,但这样一来框架调用的章节都要做成各自独立的网页,又是违背了朕的意思。经过断断续续的学习,主要是对JS和CSS技巧的掌握,终于成就了如今这篇网页,尽管说不上十分满意,也算差不多了。
构思:整篇的框架其实就是一个函数加表格的大菜单,采用每个表格的display显示属性的block和none对包含的章节进行显示和隐藏,再运用<div>的滑动条嵌入表格,最终达到内框架的效果。然后,给网页加上前景后景及其他功能。
制作网页也算编程吧,每个制作者的思维方式和操作习惯不尽相同。就寡人而言有以下认识:
网页程序应简洁清晰、层次分明。减少框架、表格、层的嵌套,既有碍观瞻,又影响速度。减少不必要的功能,没必要整个页面塞得满满的,大杂烩一样。文章内容排版好,去掉多余的空格、符号、文字、广告等等,标点符号修改成中文文本标点符号格式,修正被符号替代的隐讳字词,字体最好宋体,字号大小使用12pt即可,前景文字和背景的颜色柔和清晰,不太刺眼也不会累。别懒,也别太马虎,做这种工作就得养成细致耐心认真严格的习惯,差不多总是差一点。
网上自学就是好,资料齐全还有高手教导。只是发现很多网页制作方面的帖子,都是四五年以前的了,仿佛一下回到远古时代,与史前的一拨高人交流。时代发展太快了。毕竟不是专业科班,短时间内不可能聚集起他们那样系统、全面、深入的知识体系,功利性现实性要求朕一切从实用性出发,用哪学哪,现学现用,逐步累积,够用就行。
这些年搜集了不少JS的小功能小技巧,可惜不能全用在这里,不然花里胡哨不停展播,速度如老牛拉破车一样,读者也不用看文章了。这里就拽拽这个网页里使用的小功能,一个动态时间函数还是很有必要的,随时提醒您注意看书时间,爱护眼睛。说实在,寡人学习JS还真是从学习编制时间函数开始的。网上关于日期时间方面的编制技巧真是花团锦簇,美不胜收。不过这里运用的时间函数,应该是时间函数里最简单的吧,本着精简的目标,使用最基础的函数指令,号称无变量函数,只要稍微加以改动,可以用在各种地方。
还有就是菜单设计。查阅了下,目前使用最多的一般就是DIV+UL+LI+CSS,按钮是利用内衬距padding和:link:hover等伪类对<A>设计变化,地址变量链接。存在问题:1.程序行一点没减少,反而更多;2.对层的控制没有对表的控制功能更强大(深有感触,层确实不好控制,很难设计到位。变化也不多,除了有个滑动条,没啥用处);3.一直不喜欢<A>,伪类是否比οnmοuseοver= "className= 'btd2'"更快不知道,但οnmοuseοver= overBd()通过对函数的调用,可以实现更多的功能却是明显的。因此,用单元格做菜单的触发按钮则是不错的选择。用表格做菜单的优点:可以任意横排竖排,多行列排,交叉无序都可以;菜单栏和对应的正文可以不在一处,甚至不在一个框架;单元格的变化形式丰富,易于控制。表内的单元格都有相对应的下标,按行从左到右从上往下依次顺序不间断,合并单元格按一个算,这是个很可以利用的特性。对于一部章回比较多的小说,比如《红楼梦》一百零八回版,采用表格做菜单很见长处了。实际操作中,本来是做了一个菜单表的,每个章回一行,后来发现都是有序的重复,于是编写了一个函数来代替,省了不少地方。为便于对比阅读,演示版中保留了原程序,用<!--...-->封闭。
章回制作。
<table id=mainTable><tr>
<td style="DISPLAY: block;"><div>
前言……
</div></td><td style="DISPLAY: none;"><div>
第一回……
</div></td><td style="DISPLAY: none;"><div>
第二回……
……
</div></td><td style="DISPLAY: none;"><div>
第二十四回……
</div></td>
</tr></table>
有几个章回就有几个单元格,默认第一个单元格属性为显示block,其他均隐藏none。与菜单一一对应。由菜单项通过函数对相应单元格属性修改,从而制造出类似框架一样的翻页效果。
至于字体字号前景背景等的页面控制设置,很多门户网站网页中都有使用,原理简单,不再赘述。要说不足,就是应该设置个cookie的存取,将页面设置,甚至读书标签都保存到cookie里,下次一打开就自动调出,翻到你上次看到的地方。这个功能程序比较长,手术比较大,下次有空了再弄吧。哪位朋友这方面比较擅长,不妨补充进来。
其他问题,大的方面还没想到,也许没了。小毛病肯定不少,以后使用中会不断显示出来。另外,使用者偏好不同,要想做到使每个人都满意的大一统作品,一定很难。最后,就是终结者的问题了,考虑批量制作的方法。这个的确还没学到,不会。期待中的施瓦大侠快快降临吧!
朕一直教导自己,最简单的就是最实用的。因此所用编程工具:记事本 + Front Page。据外电传说有什么三剑客,朕无暇顾及也无心眷恋。朕何等人,敢于用弓箭对抗飞机坦克的才是真正Rambo!
突然发现寡人是如此话痨。突然发现浑身冒汗。如此高手林立的地方,班门弄斧啊!作为一种业余爱好,既能满足一些工作学习生活中的需要,又能获得些许成就感的愉悦,确是受益匪浅。
暂时这些,希望抛此砖能够引玉、引钻石,引瓦片新鲜鸡蛋也行。不用感谢。如果觉得还有用的话,真诚希望能多多出些经典文章小说,页面精致清新,产生保存欲望的电子书。
钦此。ytian053@163.com【老树】 2008年11月29日 星期六 06:23 黎明
一本一体化静态文本网页的电子书 下载
file://800.qqmdm.com/ContentPane.aspx?down=ok&filepath=ivft%2f00%f2%d7%c2%a5%d6%be%c8%ab%b4%ab.htm
一本一体化静态文本网页的电子书附图 下载
file://800.qqmdm.com/ContentPane.aspx?down=ok&filepath=ivft%2f%f2%d7%c2%a5%d6%be.jpg
讲话有点半玩笑了。不过对我程序中存在的不足和错误,真诚希望各位朋友批评指正。
目前只是在IE中测试,其他浏览器没试过。