问题:元素明明设置了display:none,但是在刷新页面的时候却会先显示了出来,然后才会隐藏,实现display:none

原因:由于元素渲染的时候,样式还没有应用上去,导致的

解决办法:使用内联样式,动态改变display的值为none或者是block,使用moseenter和mouseleave事件替代hover,在moseenter和mouseleave事件中去改变display的值

解决设置了display:none的元素,会先展示再隐藏的更多相关文章

  1. 使用 jQuery 选择器获取页面元素,然后利用 jQuery 对象的 css() 方法设置其 display 样式属性,从而实现显示和隐藏效果。

    查看本章节 查看作业目录 需求说明: 使用 jQuery 选择器获取页面元素,然后利用 jQuery 对象的 css() 方法设置其 display 样式属性,从而实现显示和隐藏效果. 具体要求如下: ...

  2. 元素设置为display:none,其绑定的事件仍存在

    元素设置为display:none,虽然该元素从页面中消失了,其绑定的事件仍存在. <body> <button class="button1">chang ...

  3. 小程序scroll-view组件使用时,子元素虽设置样式display:inline-flex;whit-space:nowrap

    小程序scroll-view组件使用时,子元素虽设置样式display:inline-flex;whit-space:nowrap

  4. 实现span设置宽度(行内元素本来不支持调宽度高度这些样式)(变成行内块元素:display:inline-block;)

    实现span设置宽度(行内元素本来不支持调宽度高度这些样式)(变成行内块元素:display:inline-block;) 一.总结 1.将span从行内元素变成行内快元素就可以调了: 设置样式的时候 ...

  5. 内层元素设置position:relative后父元素overflow:hidden overflow:scroll失效 解决方法

    内层元素设置position:relative后父元素overflow:hidden overflow:scroll 都失效 解决方法:在position:relative的外层父容器加positio ...

  6. 若块级元素被设置为 display: table-cell 便无法设置宽度

    工作中,遇到表格的单元格中的 div 设置宽度无效,后来是发现 div 被设置为 display: table-cell ,后将其修改为 display: block 则设置的宽度生效.

  7. CSS中用 opacity、visibility、display 属性将 元素隐藏 的 对比分析

    说明 opacity 用来设置透明度 display 定义建立布局时元素生成的显示框类型 visibility 用来设置元素是否可见. opacity.visibility.display 这三个属性 ...

  8. 设置overflow:hiden行内元素会发生偏移的现象

    父级元素包含几个行内元素 <div id="box"> <p> <span>按钮</span> <span>测试文字文字 ...

  9. from表单、css选择器、css组合器、字体样式、背景属性、边框设置、display设置

    目录 一.form表单 1.form表单功能 2.表单使用原理 二.前端基础之css 1.关于css的介绍 2.css语法 3.三种编写CSS的方式 3.1.style内部直接编写css代码 3.2. ...

随机推荐

  1. vue 组件之间通信

    父传子 **父组件代码** <template> <header-box :title-txt="showTitleTxt"></header-box ...

  2. 使用druid连接池带来的坑testOnBorrow=false

    首先说一下自己程序中遇到的问题,前一段时间新写了一个项目,主要架构改进,为前端提供接口(spring +springmvc+mybatis) 在新项目中使用的是阿里的druid连接池,配置简单,除了数 ...

  3. C# DumpBin使用 查看反射C++ dll 动态链接库中的函数

    DumpBin是Microsoft提供的一个用于查看.exe..dll文件信息的工具,其位于: C:\Program Files (x86)\Microsoft Visual Studio 10.0\ ...

  4. CALL 'SYSTEM' ID 'COMMAND'

    CALL 'SYSTEM' ID 'COMMAND' 语句创建 AL11文件夹 , line(), END OF tabl. DATA: lt_string TYPE STANDARD TABLE O ...

  5. 免费申请https

    https://blog.csdn.net/MariaOzawa/article/details/81877756 实测有效

  6. 值得学习的C语言开源项目和库

    收集一些C/C++相关的源码,如有更高效的库,请提醒我 补充上去 C/C++相关交流Q群 1414577 - 1. Webbench Webbench是一个在linux下使用的非常简单的网站压测工具. ...

  7. 不要在viewWillDisappear:方法中移除通知

    都知道viewWillAppear:方法是在控制器的view将要显示的时候调用的,而viewWillDisappear:方法是在控制器的view将要隐藏的时候调用. 这看上去没什么问题,键盘的显示和隐 ...

  8. scalaTest的初步使用

    1. 概述 ScalaTest是scala生态系统中最流行和灵活的测试工具,可以测试scala.js.java代码. 2. ScalaTest的特性 a. ScalaTest的核心是套件(suite) ...

  9. Gogs 设置Git钩子实现项目自动部署

    每次修改代码需要上传到 git仓库,查看了一下 Gogs 使用文档 发现有 web钩子 这个选项,然后发现了本地可实现的 Git钩子. 注意:需要用到管理员帐号登录,进行仓库的设置. 有三种状态分别是 ...

  10. MFC中使用ADO进行数据库操作

    参考FROM:http://hi.baidu.com/sunkanghome/item/e1fda510b3186359f1090ee2 数据库与数据库编程: 当前各种主流数据库有很多,包括Oracl ...