最新消息:

第82款插件:jquery.pos-fixed.js让IE6支持fixed(绝对定位)效果和Firefox、Chrome一模一样

高级页面 杨红伟 3022浏览 0评论

一、插件介绍

使不支持position:fixed的IE浏览器支持此属性。position:fixed这一CSS属性有着非常重要的作用,有了它,我们就可以省去很多的工作,比如说我们以前做过的好些插件“回到顶部”、“对联插件”、“广告插件”,这些我们都可以用它来解决,很多其它浏览器都支持这一属性,但唯独IE6不支持。

当然如果不考虑IE6的开发者们,就不用考虑看这一篇文章了!

二、插件作者及下载

@Author:Fly Mirage
@Date:2012-01-17
@Version:1.1

三、使用方法及参数

 $('#id').toFixed(); 

这一插件没有参数

四、使用教程

其实这里说的只是 position:fixed 这一属性。只要是用到这一属性都可以用到这一插件!这里我用的是一个对联做为示例了。

1、HTML代码

在这里放置一个左对联,一个右对联。

<div id="posfixed" class="posfixed-l">
	<img src="left.jpg" width="115" height="619" />
</div>
<div id="posfixed" class="posfixed-r">
	<img src="left.jpg" width="115" height="619" />
</div>

2、CSS代码

将对联的两个层进行定位,定位好宽高。

.posfixed-l{position:fixed;left:50px;bottom:10px;display:block;width:115px;height:619px;}
.posfixed-r{position:fixed;right:50px;bottom:10px;display:block;width:115px;height:619px;}

3、JS代码

放置JS代码,再使用toFixed()进行IE6的修复!

<script src="http://www.ijquery.cn/js/jquery-1.7.2.min.js"></script>
<script src="http://www.ijquery.cn/js/jquery.pos-fixed.js"></script>
<script type="text/javascript">
$(function(){
	$('#posfixed1,#posfixed2').toFixed();
});
</script>

好了,就讲到这里,注意在实际使用中活学活用就可以了!

发表我的评论
取消评论
表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址