一个网页的浏览器兼容修改总结

前一阵看到一个网页蛮感人的，标题是给你一个人生哲学的故事，文字打印、滚动页面再加配乐效果，整体效果很好，原网页在这里。但原来的网页脚本vbscript，只有IE支持，看着不爽，来做个浏览器兼容，完成后的效果在这里。

这次浏览器兼容的修改主要包括两方面：

具体下来有以下几项：

将vbscript语法改为javascript语法，修改函数与代码语法，查文档对应修改即可。
内容居中样式修改，将原来容器的align="center"删除，增加本容器的样式style="margin:auto;"及上级容器样式style="text-align:center;"。
修改背景音乐语法，将<BGSOUND loop=infinite src="friend/friend.mid">改为<embed src='images/friend.mid' loop='true' hidden='true' autostart='true'></embed>，当然还要调整一下位置，从原来的head标签内移到body标签内。今天用Firefox看修改过的效果竟然直接导致FF崩溃，无奈了，改回原来的，还是只有IE下有音乐。哪位如果知道如何解决，恳请告知，万分感谢！
页面滚动的修正，主要是document.body的clientHeight、offsetHeight、scrollHeight属性在浏览器中的不同所致，因而需要做一些修改，另外增加了doctype指示，在文件头部修改<html>为<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" >。具体的分析可以参考《clientHeight、offsetHeight、scrollHeight对比测试分析》。
其他细节方面的修改，已经不记得了

记录一笔，以便日后参考。再贴一次这个页面——给你一个人生哲学的故事，给所有的朋友。

给你一个人生哲学的故事

本博客所有文章如无特别注明均为原创。
复制或转载请以超链接形式注明转自枫芸志，原文地址《一个网页的浏览器兼容修改总结》

标签：浏览器兼容

枫芸志