调整iframe滚动条失效
1:<iframe scrolling="auto" frameborder="0" src="' + add + '" style="width:100%;height:100%;overflow:scroll;overflow-x:hidden">'; 2:记得去掉iframe的标准,然后调整iframe下面的
body:/*滚动条样式*/
body::-webkit-scrollbar {/*滚动条整体样式*/
width: 8px; /*高宽分别对应横竖滚动条的尺寸*/
height: 20px;
border-radius: 8px;
}
body::-moz-scrollbar {/*滚动条整体样式*/
width: 8px; /*高宽分别对应横竖滚动条的尺寸*/
height: 20px;
border-radius: 8px;
}
body::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
-webkit-box-shadow: inset 0 0 5px #3384ff;
background: rgba(1,187,218,0.2);
border-radius: 8px;
}
body::-moz-scrollbar-thumb {/*滚动条里面小方块*/
-webkit-box-shadow: inset 0 0 5px #3384ff;
background: rgba(1,187,218,0.2);
border-radius: 8px;
}
body::-webkit-scrollbar-track {/*滚动条里面轨道*/
-webkit-box-shadow: inset 0 0 5px rgba(4,231,250,0.6);
border-radius: 0;
background: rgba(3,10,28,0.6);
}
body::-moz-scrollbar-track {/*滚动条里面轨道*/
-webkit-box-shadow: inset 0 0 5px rgba(4,231,250,0.6);
border-radius: 0;
background: rgba(3,10,28,0.6);
}
/*滚动条样式end*/
调整iframe滚动条失效的更多相关文章
- iframe滚动条充当浏览器滚动条
在做博客项目的时候,使用了iframe,方便根据选择的文章类别切换显示的内容,但是文章一般都有很多,通过bootstrap的媒体列表的方式显示的话,iframe是一定会出现滚动条的,特别是我添加了一个 ...
- 如何根据iframe内嵌页面调整iframe高宽续篇
接着昨天的工作 如何根据iframe内嵌页面调整iframe高宽 来说,按照文章中说的第二种方法实现代码如下: 实现 A.com/detail/view 页面的iframe代码如下: <ifra ...
- sencha touch 在新版谷歌浏览器中painted事件无法触发解决方案以及carousel 控件、togglefield控件、滚动条失效
在2.3/2.4版本中,新版谷歌浏览器(43.44版本)里面painted事件是不会触发的,以及carousel 控件.togglefield控件.滚动条失效,官方的解决方案如下,测试可用 会出现这个 ...
- 如何改变iframe滚动条的样式?
如何改变iframe滚动条的样式? web前端开发 css javascript iframe html RayLiao 2014年11月19日提问 · 2014年11月20日更新 关注 关注 收藏 ...
- IOS上iframe的滚动条失效的解决办法
#iframe-wrap { position: fixed; top: 100px; bottom: 0px; left: 0px; right: 0px; -webkit-overflow-scr ...
- IE8 下 iframe 滚动条的问题
//设置滚动条 $("iframe[name='updateFocalWork']").attr("scrolling", &qu ...
- iframe滚动条的一些方法
用iframe布局,会碰到浏览器右边出现2个滚动条,简单代码解决用iframe布局,会碰到浏览器右边出现2个滚动条, 简单代码解决,用下面的代码可以把浏览器本身的滚动条去掉,只留页面产生的滚动条: b ...
- iframe滚动条问题:显示/隐藏滚动条
iframe 问题2008-01-22 16:37****** 显示 iframe 内容 XHTML 1.0 Transitional 标准不能显示 <!DOCTYPE html PUBLI ...
- 关于overflow-x: hidden隐藏滚动条失效的解决方案
在苦逼写页面的时候,发现有种情况overflow-x: hidden失效了,chrome表现完好,qq浏览器有问题,微信上面展示有问题. 微信上面展示是一样能够滑动的. 如果出现类似问题的同学,请试一 ...
随机推荐
- spring对bean的高级装配之profile机制
最近在读spring实战一书,个人感觉内容通俗易懂,学到了一些之前并不知道的知识,于是打算在博客里记录一下这些知识点便于后期记忆: 今天要记录的就是spring的条件化创建bean,针对条件化创建be ...
- wav文件格式分析与详解
WAV文件是在PC机平台上很常见的.最经典的多媒体音频文件,最早于1991年8月出现在Windows 3.1操作系统上,文件扩展名为WAV,是WaveFom的简写,也称为波形文件,可直接存储声音波形, ...
- C#中字符串大小比较函数--CompareTo与Compare方法(需要完善补充)
字符串比较的原理是什么? 原理: 从两个字符串的第一个字符开始逐个进行比较(按字符的ASCII值进行大小比较),直到出现不同的字符或遇到‘\0’为止. 如果全部字符都相同,就认为两字符串相等,返回0: ...
- 网络编程 多线程/socketserver模块/ threading.local
线程:进程中负责程序执行的执行单元. 多线程:在1个进程中存在多个线程. 进程只是用来把资源集中在一起,而线程才是cpu上的执行单位. 每个进程都会默认有一个控制线程也叫作主线程. 进程之间是竞争关系 ...
- SpringCloud使用Feign调用服务时,@FeignClient注解无法使用
关于解决这个问题的理论根源传送门:https://blog.csdn.net/alinyua/article/details/80070890我在这里只提供解决方案 0. 结论和解决方案 Spring ...
- 我的代码-data pulling
# coding: utf-8 import datetimeimport timefrom sqlalchemy.engine import create_enginefrom sqlalchemy ...
- 在干净的ubuntu 14.10上编译Qemu2.2.0的过程
下载Qemu的源代码 从官网http://wiki.qemu.org/Main_Page 中下载最新的源代码,目前是2.2.0. 安装依赖库和编译 编译过程分两步1. ./configure 2. m ...
- GanttProject 项目管理软件的优点
GanttProject 的优点 GanttProject 是一款基于 GPL 协议的开源软件,代码完全开源,使用的是 Java 语言编写. 最近在试用,有以下一些优大. 文件格式为 xml,这个是我 ...
- zabbix自动发现zabbix_agent后添加到所属组和链接到某些模块(九)
自动发现的两个操作:discovery(自动发现) and actions(发现后执行某个操作) 需求: 1:自动发现 Zabbix agent运行的主机 2:执行的动作 1)添加到所属组 ...
- linux安装redis标准流程-按这个来
1.将下载好的压缩包放到/usr/local目录下# tar xzf redis-3.2.9.tar.gz # cd redis-3.2.9 # make 提示错误 make: cc: Command ...