js手风琴影响body背景图自适应屏幕高度

简介: js手风琴影响body背景图自适应屏幕高度

js影响背景图片问题解决方法:

一个长图,怎么根据菜单栏伸展自适应屏幕高度,不足屏幕高度时默认100vh,

这里可以用js去监听他的高度然后根据他的高度来设置图片大小,但css设置效果会更好些也比较简单,简单看一下吧

.body {
    background-image: url(../img/bg.png);
    width: 100%;
    background-size: 100% auto;
    max-width: 100%;
    min-height: 100vh;
    margin: auto;
}



相关文章
|
移动开发 JavaScript 前端开发
分享82个JS手风琴效果,总有一款适合您
分享82个JS手风琴效果,总有一款适合您
402 1
|
JavaScript 前端开发 数据安全/隐私保护
JS点击切换背景图
JS点击切换背景图
262 0
|
移动开发 JavaScript 前端开发
【Html.js——图片折叠效果】折叠手风琴(蓝桥杯真题-1763)【合集】
本项目实现了一个图片折叠手风琴效果,使用jQuery完成。主要包括以下部分: - **介绍**:任务是通过点击图片实现折叠和展开的效果。 - **准备**:内置初始代码,包含 `css/style.css`、`images/` 文件夹、`js/` 文件夹及 `index.html` 等文件。启动 Web Server 服务可运行项目。 - **目标**:完善 `index.js` 文件,使页面达到预期的折叠效果。 - **规定**:严格按步骤操作,保持默认文件结构不变,并在完成后保持 Web 服务正常访问状态。 - **通关代码**:使用 jQuery 实现点击事件,为选中元素添加 `act
415 19
|
JavaScript
js随机更换背景图
js随机更换背景图
|
JavaScript 前端开发
[Javascript] 检测屏幕滑动方向
要使用 JavaScript 检测屏幕滑动方向,可以监听滚动事件 (scroll) 并与前一个滚动位置进行比较来确定滑动的方向。
387 0
touchslider.js插件高度自适应的解决方案
touchslider.js插件高度自适应的解决方案
185 0
|
JavaScript
js【图解】滚动条的位置(文档与屏幕间的距离),鼠标事件距离(位置),元素距离(位置)
js【图解】滚动条的位置(文档与屏幕间的距离),鼠标事件距离(位置),元素距离(位置)
467 7
|
JavaScript 前端开发
<body> 中的JavaScript函数
【5月更文挑战第1天】<body> 中的JavaScript函数。
203 3
|
移动开发 JavaScript 前端开发
rem的适配方案,css文件和js文件的引入方式,特色小边框的制作,DS-Digital.ttf数字展示屏的使用方法:,自适应图片 background-size,jQuery爆bug,a和盒子居中,
rem的适配方案,css文件和js文件的引入方式,特色小边框的制作,DS-Digital.ttf数字展示屏的使用方法:,自适应图片 background-size,jQuery爆bug,a和盒子居中,
|
XML JavaScript 前端开发
Python之JavaScript逆向系列——4、Body
Python之JavaScript逆向系列——4、Body
227 0