jquery-backstretch零基础入门_jquery动态设置背景图片插件

jquery-backstretch零基础入门

官方网址:http://www.jquery-backstretch.com

jquery-backstretch零基础入门_jquery动态设置背景图片插件

GitHub:https://github.com/jquery-backstretch/jquery-backstretch

简介描述:jquery动态设置背景图片插件

backstretch插件功能

优化网站外观。主要用于设置页面背景图片,也可以设置html元素的背景图片。背景图片可以设置多张,在间隔时间内循环显示。

注:但是在设置背景图片时,如果图片过大,网站使用的资源又受到限制时,应压缩图片的大小。不然图片的加载会非常缓慢。我测试了官方网站的demo,图片都比较大,有的图片在400kb以上,在虚拟空间中打开网站,图片加载有点慢。

插件demo的截图效果不明显,所以不在本文贴出,大家可以去官方看demo演示,或在本文的下面,也有我测试这个插件的用例,可以看一下,中文演示。

测试用例使用的图片来自于网络,并且大小都在100kb以上,使用官方图片一张。由于只是测试插件使用,所以没有对图片进行压缩。

backstretch使用方法 

引用文件

<script src="jquery.js"></script>
<script src="jquery.backstretch.js"></script>

 

海计划公众号
(0)
上一篇 2020/03/06 08:31
下一篇 2020/03/06 08:36

您可能感兴趣的内容

  • 打破重重阻碍,Flutter 和 Web 生态如何对接?基础教程_Flutter小白攻略

    Flutter 设计之初是不考虑 Web 生态的,原因很简单:两种技术设计理念不同,强行融合很可能让彼此都丧失了优势。但是业界又有很多团队在做这种尝试,说明需求是存在的。今天,阿里无线开发专家门柳就来手把手教如何实现 Flutter 和 Web 生态的对接?先说结论:不要对接!不要对接!不要对接!开个玩笑,以上仅代表个人观点,大家也知道这种“三体式警告”根本

    2020/03/22
  • pinterest攻略教程_世界上最大的图片社交分享网站

    pinterest攻略教程 官方网址:https://www.pinterest.com/ 简介描述:世界上最大的图片社交分享网站 Pinterest是世界上最大的图片社交分享网站…

    2020/03/06
  • 验证码的分类小白入门 网页验证码有哪些方式?_验证小白基础

    早期的互联网是没有验证码的,随着后来计算机程序的发展,黑客编写了模仿登录、恶意破解密码、刷票、论坛灌水等恶意程序,破坏了整个网络的平衡性。于是验证码这种验证是否是人工操作的检验机制便产生了。随着验证码的出现,它可以防止:恶意破解密码、刷票、论坛灌水,有效防止某个黑客对某一个特定注册用户用特定程序暴力破解方式进行不断的登陆尝试等等,给互联网带来了一定的安全性。

    2020/04/03
  • Bootstrap图标基础入门_图标小白攻略

    小图标icon是一个优秀Web中不可缺少的一部分,起到画龙点睛的效果。在Bootstrap框架中也为大家提供了250多个不同的icon图片。本文将详细介绍Bootstrap图标 原理分析Bootstrap框架中的图标都是字体图标,其实现原理就是通过@font-face属性加载了字体@font-face {
    font-family: ‘Glyphicons H

    2020/03/26
  • 使用Rollup打包并发布到npm使用指南_Rollup小白入门

    前言其实用 webpack 也可以打包库,不过根据create-react-app项目贡献者的说法:rollup适合发布 js 库,而webpack更适合做应用程序。简而言之就是:rollup 打包 js 比 webpack 方便,而 webpack 打包 css 比 rollup 方便,相信大家已经有所了解了,至于选用哪个相信大家已经清楚了,下面我们来详细

    2020/03/29
  • JS的变量作用域问题,理解js全局变量和局部变量问题入门指南_js知识使用说明

    js的变量分为2种类型:局部变量和全局变量。主要区别在于:局部变量是指只能在变量被声明的函数内部调用,全局变量在整个代码运行过程中都可以调用。值得注意的js中还可以隐式声明变量,而隐式声明的变量千万不能当做全局变量来使用。下面将通过一些例子做详细说明:例子一:var a=”Hello”; function test(){ var a; console.

    2020/04/06
  • 技术人如何做演讲?入门攻略_技术基础教程

    技术人一般都口拙,有的人憋了半天都没几句话,有的人巴拉巴拉一大堆却没有重点,那如何做一个中规中矩的演讲呢?此时想必大家都正在如火如荼的进行年终总结或晋升答辩,我总结了一些套路,与大家分享下。个人总结 个人年终总结的套路。首先,自我介绍。开场白,无论是哪个场合,都要先介绍下自己。 比如说, 大家好,我是谁,来自哪里,现在在做什么。其次,回顾历程。热场之后,就

    2020/03/20
  • 近乎SpaceBuilder小白攻略_基于asp.net mvc最强大的SNS社区软件

    近乎SpaceBuilder入门基础知识 官方网址:http://www.jinhusns.com/ 简介描述:基于asp.net mvc最强大的SNS社区软件 近乎(Spaceb…

    2020/03/06
  • 前端常用的几个Js调试技巧 基础知识_调试菜鸟教程网

    1. debugger除了console.log, debugger是我们最喜欢、快速且肮脏的调试工具。执行代码后,Chrome会在执行时自动停止。你甚至可以把它封装成条件,只在需要时才运行。if (thisThing) {debugger;
    }
    2. 用表格显示对象有时, 有一组复杂的对象要查看。可以通过console.log查看并滚动浏览,亦或者使用co

    2020/03/29
  • 彻底淘汰并消除JavaScript中的this入门教程_this小白攻略

    如果这很难明白,为什么我们不停止使用它呢?认真的思考一下。如果你读过 将90%的垃圾扔进垃圾桶后,我如何重新发现对JavaScript的爱, 当我说扔掉它时,你不会感到惊讶。this被丢弃了。再见。this不会被遗弃。使用函数式的JavaScript,你永远不会看到this。因为你的代码永远不会包含this。你无法控制第三方库。流行的第三方库像 React,

    2020/04/03
  • Link 标签的预加载机制新手入门_预加载基础指南

    先简单介绍下 link 标签作用你可以在页面 元素内部使用 标签书写一些声明式的资源获取请求 preload (预加载)有些资源是在页面加载完成后即刻需要的,对于这种即刻需要的资源,你可能希望在页面加载的生命周期的早期阶段就开始获取,在浏览器的主渲染机制介入前就进行预加载。 这一机制使得资源可以更早的得到加载并可用,且更不易阻塞

    2020/03/29
  • pieces.js教程视频一款效果非常炫酷的js碎片化图片轮播切换特效插件

    pieces.js基础入门 官方网址:https://tympanus.net/codrops/2018/02/21/animated-fragment-slideshow/ Gi…

    2020/03/05
  • 程序员写代码为什么需要 review?使用帮助_Review零基础入门

    在日常写完代码之后,你是否会有 Code Review 的习惯?Code Review 即代码审查,其目的在于找到开发时被忽视的 Bug,以此极大地提高代码质量也可以帮助开发者们更加熟悉项目。但遗憾的是,很多业界的开发者并没有常规代码审查的习惯。那么对于程序员而言,Review 是否真的是一项必备的工作?以下为译文:十多年来,我常常担任代码审查的工作。代码审

    2020/03/30
  • jsPDF使用教程_将HTML转为PDF文件

    jsPDF使用教程 官方网址:https://parall.ax/products/jspdf GitHub:https://github.com/MrRio/jsPDF 简介描述…

    2020/03/06
  • JavaScript中的循环和作用域小白攻略_js知识入门基础教程

    JavaScript有一个特点,也许会让开发者头痛, 是与循环和作用域相关的,举个例子:const operations = []
    for (var i = 0; i {console.log(i)})
    }
    for (const operation of operations) {operat

    2020/04/03
  • js base64的实现新手入门_base64菜鸟知识

    什么是base64base64是用规定的64种字符来表示任意二进制数据的一种编码格式,而且这64种字符均是可见字符,而之所以要是可见的是因为在不同设备上处理不可见字符时可能发生错误。通常,电子邮件数据、公钥证书会经常使用。base64编码不提供加密,只是将一种形式的数据转化为另一种形式。Base64编码使用二进制表示,字符串的每一个字符由8个字节表示。Js实

    2020/03/30