SyntaxHighlighter.js是一个代码高亮的JS插件,使用也很简单,但是由于是浏览器段执行JS代码来着色,会出现视觉上闪一下的效果。比如你的20行代码网页打开显示高度为100px,但是SyntaxHighlighter高亮后该区域高度变为120px 加上颜色的变化,这样的体验特别不好。

解决原理:把pre标签的样式定义为 高亮后的样式即可

解决方法:在shCoreDefault.css文件加上如下样式

pre {
line-height:22px !important;
background-color:#f5f5f5!important;
border:1px solid #ccc!important;
border-radius:4px!important;
width:98% !important;
margin:.3em 0 .3em 0!important;
padding:0 0 0 1em!important;
font-size:13px !important;
font-family:Monaco,Menlo,Consolas,"Courier New",monospace;
}

  即可这样就不会出现大面积的闪烁了,然后按F5强制刷新浏览器缓存,查看效果,如果还是有细微差距,可以自己微调CSS样式。

原文引用:http://www.itxst.com/detail/d8459385.html

防止SyntaxHighlighter.js的闪烁闪一下的方法的更多相关文章

  1. 利用JS实现闪烁字体

    以下为在JSP文件中,利用JS实现闪烁字体的代码: HTML代码: <div id="blink">一段会闪烁的字</div> JavaScript代码: ...

  2. js jquery 页面加载初始化方法

    js jquery 页面加载初始化方法 一.js页面加载初始化方法 // 1.在body里面写初始化方法. <body onload='init()'> </body> < ...

  3. JS清除IE浏览器缓存的方法

    js中自动清除ie缓存方法 — 常用 对于动态文件,比如 index.asp?id=... 或者 index.aspx?id=... 相信有经验的程序员都知道怎样禁止浏览器缓存数据了.但是对于静态文件 ...

  4. JS按回车键实现登录的方法

    本文实例讲述了JS按回车键实现登录的方法,该功能有着非常广泛的实用价值.分享给大家供大家参考之用.具体方法如下: 方法一: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 < ...

  5. 编写高质量JS代码的68个有效方法(八)

    [20141227]编写高质量JS代码的68个有效方法(八) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...

  6. 编写高质量JS代码的68个有效方法(七)

    [20141220]编写高质量JS代码的68个有效方法(七) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...

  7. 编写高质量JS代码的68个有效方法(六)

    [20141213]编写高质量JS代码的68个有效方法(六) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...

  8. 编写高质量JS代码的68个有效方法(四)

    [20141129]编写高质量JS代码的68个有效方法(四) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...

  9. 编写高质量JS代码的68个有效方法(三)

    [20141030]编写高质量JS代码的68个有效方法(三) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...

随机推荐

  1. 计蒜客 Prefix Free Code(字典树+树状数组)

    Consider n initial strings of lower case letters, where no initial string is a prefix of any other i ...

  2. 你知道forEach和each的区别吗?

      要知道forEach和each的区别,你必须明白一点:forEach是js中的方法(针对数组),而each是jquery中的方法(针对jquery对象,即$( ) ).知道这一点,接下来我分别给举 ...

  3. Qt: error lnk1158 无法运行rc.exe

    解决办法:(依据自己的环境而定) 将C:\Program Files (x86)\Windows Kits\\bin\10.0.15063.0\x64 目录下的rc.exe 和rcdll.dll 复制 ...

  4. LintCode_173 链表插入排序

    题目 用插入排序对链表排序 样例 Given 1->3->2->0->null, return 0->1->2->3->null C++代码 ListN ...

  5. java路径中'/'的使用

    考虑java的跨系统:uinux和winw7中的‘/'标识方法不同,使用下放语句可避免 File.separator;//代表"/"

  6. NSURLSessionDownloadTask的深度断点续传

    http://www.cocoachina.com/ios/20160503/16053.html 本文为投稿文章,作者:WeiTChen 对于后台下载与断点续传相信大家肯定不会陌生,那么如果要同时实 ...

  7. MySQL数据库操作语句(cmd环境运行)

    一.开启MySQL服务器 1,  通过windows提供的服务管理器来完成 windows键+R 输入: services.msc 2.在本地服务中打开其服务 3.在DOC命令行下 net stop ...

  8. python中sort排序

    排序并且改变自身结果: nums.sort()

  9. mac os 使用记录

    折腾过一台黑苹果,配置很菜,奔腾G3260和B150M-D2V,具体EFI和配置详见repo Hackintosh 首先要解决的就是写代码问题,mac进行acm(C/C++)编程 VS code天下第 ...

  10. QT 捕获事件(全局拦截)

    QT 捕获应用键盘事件(全局拦截) 主窗口只有一个QTabWidget,每个tab中嵌入相应的窗口,在使用的过程中,需要主窗口响应键盘事件,而不是tab中的控件响应.故采取以下方式. 重写QAppli ...