问题:元素明明设置了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. linux内核中rtc框架选用什么接口来注册rtc设备呢?

    1. 有哪些接口? 1.1 devm_rtc_device_register 1.2  devm_rtc_allocate_device和 rtc_register_device 2. 1.1与1.2 ...

  2. start开启服务的生命周期

    * 完整生命周期:onCreate()-->onStartCommand()-->onDestroy() * 开启服务:onCreate()-->onStartCommand() * ...

  3. 虚拟化技术实现 — KVM 的 CPU 虚拟化

    目录 文章目录 目录 前文列表 x86 体系结构的虚拟化 硬件辅助的 CPU 虚拟化 由 VMX 切换支撑的 CPU 虚拟化技术 KVM 的 CPU 虚拟化实现 vCPU 的调度方式 客户机 CPU ...

  4. 解决报错Fatal error in launcher

    换电脑重装python,打算安装第三方库的时候出现错误: Fatal error in launcher 然而在网上搜到的大多数是解决 —— Fatal error in launcher: Unab ...

  5. 知识点整理-mysql怎么查看优化器优化后的sql

    背景 1.新建两张表 CREATE TABLE t1 (m1 )); CREATE TABLE t2 (m2 )); 2.插入些数据 INSERT INTO t1 VALUES(, , , 'c'); ...

  6. 微信小程序 — 自定义picker选择器弹窗内容+textarea穿透bug

    微信小程序中定义好的几种picker选择器,不管是日期选择器还是地区选择器,或是其他的都只有定死的样式和内容. 但是大多数开发程序的情况下还是需要自己写样式的,或是内容的. 例如: 代码如下: < ...

  7. 常用CSS媒体查询

    @media screen and (orientation: portrait) { /*竖屏 css*/} @media screen and (orientation: landscape) { ...

  8. python全栈测试之路-py3基础:基础的常用语法知识

    python基础链接 python3速查参考- python基础 2 -> if语句应用 + while循环应用 https://www.cnblogs.com/wuzhiming/p/7795 ...

  9. CVPapers - Computer Vision Resource

    To add links (PDF, project,...) you can use the online tool. Computer Vision Paper Indexes ICCV:  20 ...

  10. OpenCV.3.4.6.附加依赖项

    ZC:VS2015 "项目属性 --> 链接器--> 输入--> 附加依赖项" 中 添加内容 1.E:\OpenCV_something\opencv-3.4.6 ...