Solve the problem that syntaxhighlighter long code cannot wrap

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