jQuery插件调整背景图像大小以适应屏幕

  • 源码大小:503.92KB
  • 所需积分:1积分
  • 源码编号:19JP-3698
  • 浏览次数:833次
  • 最后更新:2023年07月12日
  • 所属栏目:布局
我要下载
加入收藏
本站默认解压密码:19jp.com 或 19jp_com

简介

Background Fit是一个用于响应式设计的jQuery插件,它可以调整背景图像的大小以适应您的屏幕/容器。该插件将在调整大小时保留背景图像的纵横比,而不会损失任何质量。

如何使用它:

1.将jQuery库和jQuery后台适配插件添加到您的网页中。

<script src="/path/to/cdn/jquery.min.js"></script>
<script src="jquery.background-fit.min.js"></script>

2.在CSS中为您的容器设置一个背景图像。

#bg {
  background: url(background.jpg);
  background-size: 100%;
  background-repeat: no-repeat;
}

3.调用容器上的插件,就完成了。

$(function() {
  $("#bg").bg_fit();
});

更新日志:

2022-02-18

  • 版本0.0.6

预览截图