前端相关/H5/Css/Javascript

javascript图片预加载

网站开发时经常需要在某个页面需要实现对大量图片的浏览,如果考虑流量的话,大可以像pconline一样每个页面只显示一张图片,让用户每看一张 图片就需要重新下载一下整个页面。不过,在web2.0时代,更多人愿意用javascript来实现一个图片浏览器,让用户无需等待过长的时间就能看到 其他图片。

知道了一张图片的地址,需要把它在一个固定大小的html容器(可以是div等)里边显示出来,最重要的当然是需要知道这张即将显示的图片的宽和高,然后再结合容器的宽和高,按照一定的缩放比例使图片显示出来。因此,实现图片预加载就成为图片浏览器的核心功能了。

解决IE6不支持PNG最好方案 — DD_belatedPNG

我们知道IE6是不支持透明的PNG的,这无疑限制了网页设计的发挥空间. 然而整个互联网上解决这个IE6的透明PNG的方案也是多不胜数,从使用IE特有的滤镜或是e­xpression,再到javascript+透明GIF替代.但是这些方法都有一个缺点,就是不支持CSS中backgrond-position与background-repeat.

而我今天介绍DD_belatedPNG,只需要一个理由,就是它支持backgrond-position与background-repeat.这是其他js插件不具备的.同时DD_belatedPNG还支持a:hover属性,以及.

本博 上部的LOGO背景PNG 就是应用的本方法

说个关于站点兼容宽度的CSS技巧

由于网站用户分辨率的不同 所以为了更好的用户体验 网站的宽度自动变更就显得特别重要了

这里我说个 比较好的方法

CSS样式:

div#wrapper{margin:0 auto;min-width:960px;max-width:1200px;padding:0 20px;width:expression(document.body.clientWidth > 1024? "1200px": "960px" );}

如果你的框架外面的 DIV的 ID 为 wrapper 那么定义以上的CSS样式

SWFObject: 基于Javascript的Flash媒体版本检测与嵌入模块

SWFObject是一个用于在HTML中方面插入Adobe Flash媒体资源的独立、敏捷的JavaScript模块。该模块中的JavaScript脚本能够自动检测PC、Mac机器上各种主流浏览器对Flash插件的支持情况。它使得插入Flash媒体资源尽量简捷、安全。而且它是非常符合搜索引擎优化的

  SWFObject是一个用于在HTML中方面插入Adobe Flash媒体资源(*.swf文件)的独立、敏捷的JavaScript模块。该模块中的JavaScript脚本能够自动检测PC、Mac机器上各种主流浏览器对Flash插件的支持情况。它使得插入Flash媒体资源尽量简捷、安全。而且它是非常符合搜索引擎优化的原则的。此外,它能够避免您的HTML、XHTML中出现object、embed等非标准标签,从而符合更加标准。 (即:通过text/html应答页面, 而非application/xhtml+xml)