Im using the js SyntaxHighlighter 3.0.83 from http://alexgorbatchev.com/SyntaxHighlighter/
I've been googling the entire world now it seem but cant really find how to enable line breaks. Instad i get a horizontal scrollbar, which is good sometimes but not in my scenario.
In example
Anyone out there who know the way around this?
The wrap is no longer an option but you can add the functionality easily.
Add this to the css to break the lines
body .syntaxhighlighter .line {
white-space: pre-wrap !important; /* make code wrap */
}
To fix the line numbering use the script below.
function lineWrap(){
var wrap = function () {
var elems = document.getElementsByClassName('syntaxhighlighter');
for (var j = 0; j < elems.length; ++j) {
var sh = elems[j];
var gLines = sh.getElementsByClassName('gutter')[0].getElementsByClassName('line');
var cLines = sh.getElementsByClassName('code')[0].getElementsByClassName('line');
var stand = 15;
for (var i = 0; i < gLines.length; ++i) {
var h = $(cLines[i]).height();
if (h != stand) {
console.log(i);
gLines[i].setAttribute('style', 'height: ' + h + 'px !important;');
}
}
}
};
var whenReady = function () {
if ($('.syntaxhighlighter').length === 0) {
setTimeout(whenReady, 800);
} else {
wrap();
}
};
whenReady();
};
lineWrap();
$(window).resize(function(){lineWrap()});
I don't actually use SyntaxHighlight, but it seems to be possible to attach an white-space: pre-wrap
CSS style to the <pre>
or <script>
tag that SyntaxHighlight uses.
HTML (using <pre>
):
<pre class="brush: js" class="syntaxhighlight">
/**
* SyntaxHighlighter
*/
function foo()
{
if (counter <= 10)
return;
// it works!
}
</pre>
HTML (using <script>
):
<script type="syntaxhighlighter" class="syntaxhighlight brush: js"><![CDATA[
/**
* SyntaxHighlighter
*/
function foo()
{
if (counter <= 10)
return;
// it works!
}
]]></script>
CSS:
.syntaxhighlight {
white-space: pre-wrap;
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.