<!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. SQL Server 2014 中，新建登录用户，分配权限，并指定该用户的数据

    一.运行环境 系统:Windows 10数据库:SQL Server 2014数据库名: APP     新建的用户名: app 二.操作步骤 1.打开 MS SQL Server Managemen ...

  2. ZOJ 3019 Puzzle

    解题思路:给出两个数列an,bn,其中an,bn中元素的顺序可以任意改变,求an,bn的LCS 因为数列中的元素可以按任意顺序排列,所以只需要求出an,bn中的元素有多少个是相同的即可. 反思:一开始 ...

  3. Flex tree展开节点问题！

    问题: 使用 for each(var item:XML in menuTree.dataProvider) {     menuTree.expandChildrenOf(item,true);   ...

  4. HDU 5912 Fraction

    题目来源:2016 CCPC 长春站 题意:青蛙先生想计算一个式子的值,输入两个数列a[],b[]求出最后的分子和分母 思路:一开始看到这个图片首先想到的是递归实现,递归部分始终计算的是右下部分 /* ...

  5. ubuntu 12.04下安装Qt出现cannot execute binary file的解决方案

    最近在ubuntu 12.04下安装QT的过程中,遇到一个问题. ./qt-opensource-linux-x64-5.7.0.run出现了bash: ./qt-opensource-linux-x ...

  6. NOIP2018提高组省一冲奖班模测训练（二）

    比赛链接 NOIP2018提高组省一冲奖班模测训练(二) 今天发挥正常,昨天不在状态…… 花了很久A了第一题 第二题打了30分暴力 第三题投机取巧输出test1答案(连暴力都不知道怎么打,太弱了) 2 ...

  7. C语言实现面向对象（转）

    1.引言 面向对象编程(OOP)并不是一种特定的语言或者工具,它只是一种设计方法.设计思想. 它表现出来的三个最基本的特性就是封装.继承与多态. 很多面向对象的编程语言已经包含这三个特性了,例如 Sm ...

  8. Mysql学习总结（31）——MySql使用建议，尽量避免这些问题

    做服务器端开发的同学们,相信对于mysql应该是十分熟悉,但是一旦真正出现问题,你是否能够快速的发现问题的起因,并且解决呢?一旦问题涉及到数据库层面,往往不是那么好解决的,通常来说,我们需要提前做应对 ...

  9. jvm 垃圾回收概念和算法

    1.概念 GC 中的垃圾,特指存在于内存中.不会再被使用的对象.垃圾回收有很多种算法,如引用计数法.复制算法.分代.分区的思想. 2.算法 1.引用计数法:对象被其他所引用时计数器加 1,而当引用失效 ...

  10. DebugBar v7.0.2 注册码

    blog.sina.com.cn/seoerx 14d4fb95f89bdd277fff0d20910be400 seoerx.diandian.com 505dc8424062f9895c2dd14 ...