<!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隐藏但是依然占位置的更多相关文章

  1. JD . 圆角矩形、权重层级、浮动撑开盒子及元素的默认间距、清除浮动、隐藏盒子、盒子的撑开与撑破、子盒子垂直居中|不占位置

    ---恢复内容开始--- 圆角矩形 border-radius:50%  40%  30%  33px:   像素.百分比.小数( 0.5 ) 左上.右上.右下.左下 权重: 标签 1 : 类选择器 ...

  2. 设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示;当页面滚动到起始位置时,头部div出现,底部div隐藏

    设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示: 当页面滚动到起始位置时,头部div出现,底部div隐藏 前端代码: <! ...

  3. 004:CSS三大重点之二:浮动(拖标、不占位置、转行内块)

    目录 1:拖标.不占位.转行内块 2:首先浮动的盒子需要和标准流的父级搭配使用,其次 特别的注意浮动可以使元素显示模式体现为行内块特性. 3:清除浮动 前言 CSS的定位机制有3种:普通流(标准流). ...

  4. javascript-设置div隐藏

    html code: <div class="title"> <ul id="col02_left_title"> <li> ...

  5. js获取div相对屏幕的坐标位置

    1:div相对屏幕的坐标位置 function getDivPosition(div){ var x = div.getBoundingClientRect().left; var y = div.g ...

  6. 点击一个div隐藏另一个div

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. JS控制DIV隐藏显示

    转载自:http://blog.sina.com.cn/s/blog_6c3a67be0100ldbe.html JS控制DIV隐藏显示 一,需求描述: 现在有3个DIV块,3个超链接,需要点击一个链 ...

  8. 获取div相对文档的位置

    获取div相对文档的位置,两个方法 经测试 document.getElementById("btn").getBoundingClientRect() 在IE6下有2像素的bug ...

  9. DIV 浮动存不占空间

    DIV 浮动存不占空间比如<div style="width:80px; border:1px solid #333"><div style="floa ...

随机推荐

  1. MeayunDB-高性能分布式内存数据库

    MeayunDB(www.meayun.com)是一款分布式的NoSQL列式内存数据库,由C#编写,主要为高性能,高并发,高可伸缩及大数据系统提供技术解决方案.基于MeayunDB,可以简单,快速的构 ...

  2. dfs___刷题记录

    poj 1564 给出一个s,n个数,输出所有的能够得到s的方案 #include<cstdio> #include<cstring> #include<iostream ...

  3. Photoshop把图片调成固定的像素。

    1.用PhotoShop打开需要修改的图片. 2.点击“窗口”菜单的“图层”子菜单,打开图层控制面板(快捷键F7).3.用鼠标左键双击“图层”面板的“背景”图层.在弹出窗口中点击“确定”按钮,解锁背景 ...

  4. Kattis - bela

    Bela Young Mirko is a smart, but mischievous boy who often wanders around parks looking for new idea ...

  5. Pyhton学习——Day10

    #################################################################################################### ...

  6. HDU 2303 The Embarrassed Cryptographer

    The Embarrassed Cryptographer 题意 给一个两个素数乘积(1e100)K, 给以个数L(1e6), 判断K的两个素数是不是都大于L 题解 对于这么大的范围,素数肯定是要打表 ...

  7. java判断输入的数字的位数_数字问题

    import java.util.Scanner;public class Numbers { public void Judgy(int n){ for(int i=0;i<100;i++){ ...

  8. pytorch 5 classification 分类

    import torch from torch.autograd import Variable import torch.nn.functional as F import matplotlib.p ...

  9. MVC总结

    一.转自https://zhuanlan.zhihu.com/p/35680070 MVC无人不知,可很多程序员对MVC的概念的理解似乎有误,换言之他们一直在错用MVC,尽管即使如此软件也能被写出来, ...

  10. GitHub上传项目,使用desktop(客户端)教程

    GitHub上传项目,使用desktop(客户端)教程  搜索“GitHub上传项目”,能得到很多相关的文章教程,里面讲的都特别麻烦,要弄什么ssh之类的,可算是吓坏了我,使我非常的怀疑为什么GitH ...