演示页面:http://demo.joyfulboy.cn/css/vc.html

代码请看演示地址.

IE8 FF 已经支持CSS的 vertical-align:middle; 垂直对齐属性 和 display:table-call; 元素显示为表格单元格,使用这两个属性就可以使在 IE8 FF 浏览器下页面垂直居中。IE6 IE7 不兼容这两个属性,所以使用了相对定位和绝对定位来解决此问题。(本人不是很喜欢浮动和绝对定位,但是不使用表格来实现垂直居中暂时也只好这样做,JS不算啊,用JS来实现感觉多此一举了,就像拿坦克打鸟。)

wordpress_logo

在线工具

2010年03月02日 | 前端技术

基于 javascrip 的在线颜色取色器

工具地址:http://tool.joyfulboy.cn/online/colorpicker/

基于 javascrip 的在线自动刷新页面工具

工具地址:http://tool.joyfulboy.cn/online/pv/

js写的日期选择器,摘自discuz论坛程序。可用于生日等日期选择。不多说了,看演示。

演示地址:http://demo.joyfulboy.cn/js/calendar/

不多说了,看演示吧:http://demo.joyfulboy.cn/css/2px-fillet-layer/

忘记说了,这个2像素圆角层采用固定宽度自动高度,支持 IE6 IE7 IE8 FF 浏览器。

演示页面:http://demo.joyfulboy.cn/js/addbgsound/

调用方法:

<script type=”text/javascript”>

<!–

$Load(function(){

var bgs = new addBgSound();

bgs.Url = “http://sports.wuhan.net.cn/mc3/mp3/%B1%A6%B1%B4.MP3”; //背景音乐地址;

bgs.loop = 1; //重复播放次数,0为始终重复播放;

bgs.show();

});

//–>

</script>

代码有些繁琐,没办法,技术暂时只能到这程度。

前端JS控制利用Mediaplayer来播放,看演示地址:http://demo.joyfulboy.cn/js/musicplayer/

CSS Hack 是在标准 CSS 没办法兼容各浏览器显示效果时才会用上的补救方法,在各浏览器厂商解析 CSS 没有达成一致前,我们只能用这样的方法来完成这样的任务。网上你可能能搜索到一大堆的 CSS Hack,但是我今天发布的你可能并不都很了解,因为这些都是只针对单独一个浏览器的 CSS Hack。

为了向你展示这些 CSS Hack 是否正常运作,我新建六个 P 标签,并给每一个 P 标签一个特有的 id。这将向你展示 CSS Hack 的运作情况。

<p id=”opera”>我来自 Opera 7.2 – 9.5</p>
<p id=”safari”>我是神奇的 Safari</p>
<p id=”firefox”>我来自 Firefox</p>
<p id=”firefox12″>我是你爷爷 Firefox 1 – 2 </p>
<p id=”ie7″>我是囧 IE 7</p>
<p id=”ie6″>我是脑瘸 IE 6</p>

然后我让这些 P 标签默认都不显示

<style type=”text/css”>
body p{display: none;}
</style>

阅读全文»