Next how to solve.
Open the Shcoredefault.css file, find the definition of the. Syntaxhighlighter textarea, and at the end, add a sentence: Word-break:break-all!important; OK, It means to have the code force line wrapping to appear.
Specific steps
Because my blog is mainly code sharing, a lot of code, are very long. Most of the time I have to hand him the line.
But today I can't stand it. Find a way to solve the problem online.
1, CSS Modification:
In folder: Zb_systemadminueditorthird-partysyntaxhighlighter
Add CSS to file shCoreDefault.pack.css:
The code is as follows |
Copy Code |
Body. Syntaxhighlighter. line{
White-space : Pre-wrap !important ;} Pre , Code
{ Display : Block ; Overflow : Auto ; Background : #f4f4f4 ; Padding : 5px
10px ; Border : 1px
Solid
#eee ; Word-wrap:break-word; /* Internet Explorer 5.5+ * *
White-space : Pre-wrap; * * Firefox * } 2, jquery code: $( 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 ( ' Style ' , ' Height: '
+ Height + '!important ' ); Fix by Edi, for JQuery 1.7+ under Firefox 15.0
Console.debug ($gutterLine. Height (), height, $gutterLine. Text (), $codeLine);
});
});
};
Line wrap then syntax highlighter has done it ' s stuff
Var
Shlinewrapwhenready = function
() {
If
($ ('. Syntaxhighlighter '). Length = = 0) {
SetTimeout (Shlinewrapwhenready, 10);
}
Else
{
Shlinewrap ();
}
};
Fire
Shlinewrapwhenready ();}); |
The above code belongs to the long code. Let's see if we've all changed the line??
Now, the height of the line number can be consistent with the height of the code.
Part from: http://www.suchso.com/projecteactual/z-blog-jquery-SyntaxHighlighter-longcode.html