jquery背景移动插件MyFloatingBg.js

所属分类：UI-背景

62875 439 查看评论 (12)

分享到微信朋友圈

查看演示立即下载

插件描述：这插件可以帮助你在网页上加入可移动背景Background。你可以用于整个文件的背景，或是某几个banner的背景。

这插件可以帮助你在网页上加入可移动背景Background。你可以用于整个文件的背景，或是某几个banner的背景。它可支持简单的animation效果，你不用去做一个flash文件或动态gif图片。单靠jquery和图片，你便可以做出不同的效果。由于我们把动画效果跟内容分开，我们也可以随时更改文字等内容，而不影响其运作。

使用方法

引用jQuery和MyFloatingBg.js到您的网页中

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.MyFloatingBg.js"></script>

Html中加入元素

<div id="demoDiv1" bg="img/fw2.jpg" class="m">
  <div style="color:#fff">
      7 billion friends
  </div>
</div>
<div id="demoDiv2" bg="img/star.jpg" class="m">
  <div style="color:#fff">
      wonderful world
  </div>
</div>

jQuery代码中引用

<script type="text/javascript">
$(document).ready(function(){
  //weather
	$("#demoDiv1").MyFloatingBg({direction:-1});
	$("#demoDiv2").MyFloatingBg({direction:0, speed:50});
});
</script>

=========== 以下方法由我的2009 提供 =====================

这个插件的使用方法和过程作者已经写的很清楚了，效果不错只要换张图片。

开始我是将下面：

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.MyFloatingBg.js"></script>
<script type="text/javascript">
  $(document).ready(function(){
    $("#bannerBg").MyFloatingBg({direction:0, speed:50});
  });
</script>

放在上面<head></head>里面的，结果在ie7和ie8里面跟我写的js代码有冲突导致另外的一个功能有问题，

我试着将此插件的js（即上面一段代码）放到<body></body>里最下面引用，冲突就消失了。

jQuery数字钟,MyDigitClock

jquery图片筛选排序过滤效果(让图片自动归类)