2008-06
24

在犯错中进步

By xrspook @ 17:47:16 归类于: 烂日记

围绕令人晕倒的Light Blue中以500为浏览器宽度测试的问题,几位网友在我的天写了几条言辞比较激烈的评论。今天有位朋友提出我的天在1920*1200的状态下浏览很有问题,我虚心接受!因为这blog现在所用的模板原始版本是在2006年头形成,当时主流显示器还只是正屏的15寸和17寸,我设计所用的显示器就是15寸的,因此里面的布局完全按照分辨率1024*768来分配。在2年间,显示器好像吹气球一般在无限变大,很多人使用宽屏,大家的显示器更新为19寸、20寸、22寸、24寸、26寸、30寸……我昨天也买了个最大分辨率为1440*900的三星943NW,但现在用的还是最大分辨率为1280*1024的acer AT706,常用的分辨率是1152*864。所以,我连1920*1200状态下,网页是个什么状态都没见过。不过我能猜想大概是个什么模样。

之前我body中background-img并没有控制为no-repeat,而我原本使用的背景大小为1024*768,当分辨率大于该分辨率时,网页就会在X和Y重轴方向复图像来填充。在1920*1200分辨率下,1024*768的图像就只占屏幕的1/3(纯面积计算)左右,那种花斑的效果可想而知。通过Opera的缩放功能模拟了一下用25寸以上显示器看我的天的效果,大概如右图。嘻嘻,挺梦幻的嘛。屏幕正中央部分的浏览效果不受影响,其它部分十分不敢恭维。

知道这个bug后,我马上在blog的末端处加入“Best Viewed with Firefox / Opera / IE @ 1024 X 768”,加入这句不能解决问题,只算做个主动承认。 

整个下午都在挣扎该如何解决这个大分辨率的bug。开始的思路是加入个层,然后把层固定在背景之上,依靠层内滚动实现网页浏览,不过该方法与blog内的某些设置相冲突,不得不放弃。最后决定在背景图片上做文章。1920*1200最大的挑战是高度问题,若使用高度为768的图片,Y轴上不重复,长条的网页就免不了要凸出图片之外。也就是说,只能扩大图片高度,达到1200。经过多次尝试,最终敲定采用现行的背景。请看下面的截图:左图是1152*864,右图是模拟1920*1200。

   

单凭我个人力量,很难发现自己存在的所有问题。“众人拾柴火焰高”,希望各位发现问题的朋友踊跃发言,好让我有机会去改进,不尽感激!

1 条评论

  1. 兔子

    我想的也是一个div就应该足够了

    和大巴冲突么?

    不过其实…我感觉这个问题可以不必考虑。我们应当尽量提高页面在不同环境下的可浏览性,但是毕竟现在1920的分辨还很不普及,如果真是要兼顾这个分辨的话,网上的很多页面都会出现问题。能够照顾1440就足够了。

    有一个想法,不知可否。如果背景图片能够左右拼合的话,背景平铺就不是问题咯。不知有没有PS做的好一些的能搞定。

    祝好运咯~~希望过些天能看到able to be viewed with … @1920*1200 哈哈
    xrspook 对 兔子 的回复: 2008-06-25 20:30:46
    万分感谢你的建议!!!因为在我的模板中,tags的CSS有一条是“position: absolute;”,如果插入div,实现只在该div中滚动浏览就必须使用”overflow: auto;”,如此一来,以绝对位置设置的tags就会出毛病。至于1920*1200,现在的网页应该没多大问题了,谢谢关心:)呵呵,其实我也很想PS出一个无缝接合的背景,不过暂时技术不到家,还不知如何下手。不过我一定会继续开动脑筋,解决问题的,嘻嘻。

有话要说

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

© 2004 - 2024 我的天 | Theme by xrspook | Power by WordPress