如何让后加载的元素被一开始就有的css样式渲染成功(强制提升css优先级)
今天在做搜索框中的提示语下拉的时候,提示框把搜索框的底部的border遮住,导致看起来不是很美观:

因为下方的提示框是用js后加载的它的样式也是随着js一起加载的,而这个js和它的css我们是不能改动的。如果直接一开始就使用css设置,卸载首页的css文件中,当focus输入框的时候,输入框的css是后加载进来以及渲染的,以至于我们看到的结果是一开始写在首页css文件中的样式被后面加载的样式覆盖了:
方案一:使用js定时器,当focus后延时一会儿大概255ms左右,再来渲染提示框的上边框颜色,亲测可用。
方案二:使用层级,给搜索框的的zIndex设置比较高的值,这样永远在提示框的上层,我还没试过,不知行不行。
方案三:这是一位同事”新强“找到的解决方式,使用强制提升css的优先级,这个方法也是可用!
#zSearchSuggest{ border-top:1px solid red !important;}
当然,实际做的时候是把red化成相应的蓝色。
如何让后加载的元素被一开始就有的css样式渲染成功(强制提升css优先级)的更多相关文章
- 网页移动到一个高度后加载网页元素【getBoundingClientRect好用】
$(window).scroll(function () { var windowH = $(window).height();//取可视窗口的高度 ).getBoundingClientRect() ...
- Javascript动态加载Html元素到页面Dom文档结构时执行顺序的不同
我们有时会通过ajax动态获取一段Html代码,并且将这段代码通过javascript放到页面的Dom结构中去. 而很多时候通过ajax动态获取的Html代码中也包含javascript代码,有一点需 ...
- 使用tcp_probe时最初没有输出,先卸载后加载模块之后就有了。
刚才尝试使用tcp_probe来查看tcp的窗口的变化,最初按照tcpprobe | The Linux Foundation的步骤进行设置,但是iperf之后tcp_probe并没有输出结果.按照t ...
- 【jquery】 在异步加载的元素上绑定事件
最近因为工作关系又重新回归到了jquery的怀抱,发现很多jquery的一些细节处理的部分都忘记了.这里记录一下最近在做项目时频繁遇到的一个问题:给异步加载的元素添加事件绑定. 问题发生的前提是项目前 ...
- jquery:为动态加载的元素添加点击事件
jquery:为动态加载的元素添加点击事件 最近在做项目的时候遇到了这样一个问题,给用ajax动态加载出来的内容添加点击事件,但是怎么都触发不了,经过查询试验总结出正确的写法 在jquery1.7之前 ...
- vue 首次加载缓慢/刷新后加载缓慢 原因及解决方案
# vue 首次加载缓慢/刷新后加载缓慢 原因及解决方案 最近做项目发现一个问题,页面每次刷新后加载速度都非常慢,20s左右,在开发环境则非常流畅,几乎感觉不到,本文参考望山的各种方案优化 1,关闭打 ...
- 原生js与jquery加载页面元素比较
原生js:将获取元素的语句写到页面头部,会因为元素还没有加载而出错,js提供了window.onload 这个方法事先加载元素 <script type="text/javascrip ...
- Linux下文件 ~/.bashrc 和 ~/.bash_profile 和 /etc/bashrc 和 /etc/profile 的区别 | 用户登录后加载配置文件的顺序
转自 https://blog.csdn.net/secondjanuary/article/details/9206151 文件说明: /ect/profile 此文件为系统的每个用户设置环境信息, ...
- 移动端,ajax 动态加载的元素,为动态添加的一系列同个类名的元素添加点击事件
背景:一个列表页,有一系列同类名的元素,需要为每一个动态添加的列表项添加事件: 点击选择下图中不同的文档类型,再通过 ajax 动态加载不同的文档. 使用过的方法: 1.通知 jquery 的 $(s ...
随机推荐
- 实例:通过调用外部程序进行录制视频(ffmpeg.exe)
相关知识点: 1. ffmpeg可以用下面的参数来录制Windows 桌面操作的视频. ffmpeg.exe -y -rtbufsize 100M -f gdigrab -framerate 10 - ...
- CentOS7.0安装EMQ代理服务
CentOS7.0安装EMQ代理服务 安装文件下载 官网 : https://www.emqx.io/cn/ 下载地址: https://www.emqx.io/cn/downloads 选择需要的版 ...
- K3修改字段名
在K3的BOS中,自定义字段之后我们往往会修改字段名,便于记忆和理解,但是修改字段名之后,只是数据库中的字段名被修改了,BOS中的字段标识并没有被修改,可以通过以下语句将标识和字段名改成一致. sel ...
- 删除空目录命令 - rmdir
(1) 命令名称:rmdir (2) 英文原意:remove empty directories (3) 命令所在路径:/bin/rmdir (4) 执行权限:所有用户 (5) 功能描述:删除空目录( ...
- SpringMVC请求乱码问题
今天做一个项目实现插入数据的功能,最开始没有添加FilterEncoding处理字符集乱码了,那是正常的,后来我添加过之后依然还是乱码,让我 百思不得其解,代码配置如下: EncodingFilter ...
- C语言输入一个整数转化为字符串
将数字转化为对应的字符,可以通过n%10+48来实现,也可以通过n%10+'0'来实现,因为‘0’的ASCII码的数值就是48 因为字符串‘0’ 对应的10进制 整数是48 字符串'9'对应的10进制 ...
- 诡异的BUG
1.今天遇到一个诡异的BUG(一个很古老的项目),为什么说他诡异呢,我们本地都是OK的,但是现场部署就会报错? 2.描述下现象其实这个问题不难定位(关键是有个jar包没有源码不能进行验证性的编译) 我 ...
- C++索引从0开始的堆排序算法实现
更新2019年11月4日 04:26:35 睡不着觉起来寻思寻思干点啥吧,好像好久没写堆排了.于是写了个索引从0开始的堆排,这次把建堆函数略了并在heapsort主函数里,索引从0开始到size-1结 ...
- 计算机系统概论之CPU(central processing unit)
CPI表示每条指令(Instruction)周期数,即执行一条指令所需的平均时钟周期数.可用下式计算: CPI=执行某段程序所需的CPU(Centrol Processing Unit)时钟周期数/程 ...
- 关于static 关键字的总结
转发自:https://www.cnblogs.com/xrq730/p/4820992.html 前言 之前讲到final关键字的作用是每次面试的时候我必问求职者的两个问题之一,另外一个问题就是文本 ...