div隐藏但是依然占位置
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script type="text/javascript" src = "../libs/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src = "../libs/popper.min.js"></script>
<script type="text/javascript" src = "../libs/bootstrap.min.js"></script>
<link rel="stylesheet" href="../libs/bootstrap.min.css">
<title>无标题文档</title>
</head>
<style> .row{
border: 1px solid red;
}
</style>
<body>
<div class="row">
<div class="col-xl-12">
<input type="text" id = "one">
</div>
</div>
<div class="row" style="background-color: red;width: 40%; visibility: visible" id = "two">
<div class="col-xl-12">
<span>1</span> <br>
<span>2</span><br>
<span>3</span>
</div> </div>
<div class="row">
<div class="col-12" style="background-color: aqua">
<span>111</span> <br>
<span>111</span> <br>
<span>111</span> <br>
<span>111</span>
</div>
</div>
</body>
</html>
<script>
$(document).ready(function(){
$("#one").click(function(){
var a = $("#two").css("visibility");
if(a == "visible"){
$("#two").css("visibility","hidden");
}else{
$("#two").css("visibility","visible");
} }); }); </script>
div隐藏但是依然占位置的更多相关文章
- JD . 圆角矩形、权重层级、浮动撑开盒子及元素的默认间距、清除浮动、隐藏盒子、盒子的撑开与撑破、子盒子垂直居中|不占位置
---恢复内容开始--- 圆角矩形 border-radius:50% 40% 30% 33px: 像素.百分比.小数( 0.5 ) 左上.右上.右下.左下 权重: 标签 1 : 类选择器 ...
- 设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示;当页面滚动到起始位置时,头部div出现,底部div隐藏
设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示: 当页面滚动到起始位置时,头部div出现,底部div隐藏 前端代码: <! ...
- 004:CSS三大重点之二:浮动(拖标、不占位置、转行内块)
目录 1:拖标.不占位.转行内块 2:首先浮动的盒子需要和标准流的父级搭配使用,其次 特别的注意浮动可以使元素显示模式体现为行内块特性. 3:清除浮动 前言 CSS的定位机制有3种:普通流(标准流). ...
- javascript-设置div隐藏
html code: <div class="title"> <ul id="col02_left_title"> <li> ...
- js获取div相对屏幕的坐标位置
1:div相对屏幕的坐标位置 function getDivPosition(div){ var x = div.getBoundingClientRect().left; var y = div.g ...
- 点击一个div隐藏另一个div
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- JS控制DIV隐藏显示
转载自:http://blog.sina.com.cn/s/blog_6c3a67be0100ldbe.html JS控制DIV隐藏显示 一,需求描述: 现在有3个DIV块,3个超链接,需要点击一个链 ...
- 获取div相对文档的位置
获取div相对文档的位置,两个方法 经测试 document.getElementById("btn").getBoundingClientRect() 在IE6下有2像素的bug ...
- DIV 浮动存不占空间
DIV 浮动存不占空间比如<div style="width:80px; border:1px solid #333"><div style="floa ...
随机推荐
- MeayunDB-高性能分布式内存数据库
MeayunDB(www.meayun.com)是一款分布式的NoSQL列式内存数据库,由C#编写,主要为高性能,高并发,高可伸缩及大数据系统提供技术解决方案.基于MeayunDB,可以简单,快速的构 ...
- dfs___刷题记录
poj 1564 给出一个s,n个数,输出所有的能够得到s的方案 #include<cstdio> #include<cstring> #include<iostream ...
- Photoshop把图片调成固定的像素。
1.用PhotoShop打开需要修改的图片. 2.点击“窗口”菜单的“图层”子菜单,打开图层控制面板(快捷键F7).3.用鼠标左键双击“图层”面板的“背景”图层.在弹出窗口中点击“确定”按钮,解锁背景 ...
- Kattis - bela
Bela Young Mirko is a smart, but mischievous boy who often wanders around parks looking for new idea ...
- Pyhton学习——Day10
#################################################################################################### ...
- HDU 2303 The Embarrassed Cryptographer
The Embarrassed Cryptographer 题意 给一个两个素数乘积(1e100)K, 给以个数L(1e6), 判断K的两个素数是不是都大于L 题解 对于这么大的范围,素数肯定是要打表 ...
- java判断输入的数字的位数_数字问题
import java.util.Scanner;public class Numbers { public void Judgy(int n){ for(int i=0;i<100;i++){ ...
- pytorch 5 classification 分类
import torch from torch.autograd import Variable import torch.nn.functional as F import matplotlib.p ...
- MVC总结
一.转自https://zhuanlan.zhihu.com/p/35680070 MVC无人不知,可很多程序员对MVC的概念的理解似乎有误,换言之他们一直在错用MVC,尽管即使如此软件也能被写出来, ...
- GitHub上传项目,使用desktop(客户端)教程
GitHub上传项目,使用desktop(客户端)教程 搜索“GitHub上传项目”,能得到很多相关的文章教程,里面讲的都特别麻烦,要弄什么ssh之类的,可算是吓坏了我,使我非常的怀疑为什么GitH ...