Qitailang's HP > webtech

簡易ソース表示jQueryプラグイン

2014/07/27

ソース表示だが、説明が加わるときには行番号が役立つかもしれない。私としては文法を分かりやすくするハイライト表示よりも、一部の文字列をカラーで強調したいので、ハイライト表示は不要かと思う。「軽いがいい」し...

行番号はolのリストマークなのでクリップボードにコピーされない。つまりコピペでそのまま使えるということ。（ペーストで行番号まで吐き出すお世話焼きテキストエディタもあるみたいだけど...無視。）

<script src="jquery-1.10.2.min.js"></script>
<script src="jquery.codeshow.js"></script>
<script>
$(document).ready(function() {
  $("pre.code").codeshow();
});
</script>

sample

ソース表示ブロック（ここでは<pre class="code">）ではタグマーク を&lt; &gt;にしておく必要がある。

参照サイト・作者サイト
http://htsign.hateblo.jp/entry/2014/01/16/234802
http://osumituki.com/web-front/7120.html