z-blog SyntaxHighlighter 长代码无法换行解决办法(jquery)
由于我的博客主要是代码分享,很多贴的代码,都很长。很多时候我都是手动给他换行。
但是今天实在是受不了。从网上找个办法解决一下。
1、css修改:
在文件夹:\zb_system\ADMIN\ueditor\third-party\SyntaxHighlighter
在文件shCoreDefault.pack.css添加css:
复制代码 代码如下:
body .syntaxhighlighter .line{ white-space: pre-wrap !important;} .syntaxhighlighter{width:100%!important;margin:.3em 0 .3em 0!important;position:relative!important;overflow:auto!important;background-color:#f5f5f5!important;border:1px solid #ccc!important;word-break:break-all;
2、Jquery代码:
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
|
$( function () {
// Line wrap back
var shLineWrap = function () {
$( '.syntaxhighlighter' ).each( function () {
// Fetch
var $sh = $( this ),
$gutter = $sh.find( 'td.gutter' ),
$code = $sh.find( 'td.code' )
;
// Cycle through lines
$gutter.children( '.line' ).each( function (i) {
// Fetch
var $gutterLine = $( this ),
$codeLine = $code.find( '.line:nth-child(' + (i + 1) + ')' )
;
//alert($gutterLine);
// Fetch height
var height = $codeLine.height() || 0;
if (!height) {
height = 'auto' ;
}
else {
height = height += 'px' ;
//alert(height);
}
// Copy height over
$gutterLine.attr( '<SPAN id=0_nwp><A id=0_nwl href="http://cpro.baidu.com/cpro/ui/uijs.php?rs=1&u=http%3A%2F%2Fwww%2Esuchso%2Ecom%2Fprojecteactual%2Fz%2Dblog%2Djquery%2DSyntaxHighlighter%2Dlongcode%2Ehtml&p=baidu&c=news&n=10&t=tpclicked3_hc&q=95053049_cpr&k=style&k0=%CE%C4%BC%FE%BC%D0&kdi0=32&k1=style&kdi1=1&k2=%B2%A9%BF%CD&kdi2=1&sid=77860fedb9413425&ch=0&tu=u1702844&jk=e7459084404b7b2f&cf=29&fv=15&stid=9&urlid=0&luki=2&seller_id=1&di=128" target=_blank mpid="0"><SPAN>style</SPAN></A></SPAN>' , 'height: ' + height + ' !important' ); // fix by Edi, for JQuery 1.7+ under Firefox 15.0
console.debug($gutterLine.height(), height, $gutterLine.text(), $codeLine);
});
});
};
// Line wrap back when syntax highlighter has done it's stuff
var shLineWrapWhenReady = function () {
if ($('.syntaxhighlighter').length === 0) {
setTimeout(shLineWrapWhenReady, 10);
}
else {
shLineWrap();
}
};
// Fire
shLineWrapWhenReady();});
|
上面的代码就是属于长代码。大家看看是不是都换行了??
现在,行号的高度就能和代码的高度保持一致了。
本文由主机测评网发布,不代表主机测评网立场,转载联系作者并注明出处:https://zhuji.jb51.net/zblog/7880.html