photoBy: http://www.lifehacker.jp/upload_files/130212markd…
マークダウンエディタの使い方
今回は crevasse を使う
サンプル
http://patbenatar.github.io/crevasse/
ソース
https://github.com/patbenatar/crevasse
組み込み
上記ソースからデータをダウンロードして指定された通りに js や css を読み込む。
全角、半角を便利に使うには
エディタに使いたいテキストエリアは #KijiBody とする。
<script type="text/javascript"> $(function () { $("#KijiBody").crevasse({ previewer: $("#the_previewer") }); $("#KijiBody").blur(function(){ var text = $("#KijiBody").val(); var hen = text.replace(/[＠|＃|＊|]/g,function(s){
return String.fromCharCode(s.charCodeAt(0)-0xFEE0); }); var hen = hen.replace(/ /g," "); $("#KijiBody").val(hen).trigger("change"); }); });</script>
これで #KijiBody から カーソルが外れた時に 全角シャープを 半角シャープなどにそれぞれ自動変換してくれるので
入力途中にわざわざ全角、半角に変換する必要がなく、使いやすくなる。
keydown , keyup をイベント指定すればリアルタイムで変換できるのかと思ったが、IEやFirefoxだとデータが消えるので、
上記の方法でやる。
入力方法
# , ## , ### タイトル
*(半角スペース)リスト
改行 半角スペース 2回
リンクをつける
[View source and download on GitHub](http://github.com/patbenatar/crevasse)
画像にリンクをつける
[](http://www.matomater.com)
上記でそれぞれ入力することができる。
↧