HatenaBlog beta で気にくわなかったので修正
#修正版その2へ
http://raiwingprogram.hateblo.jp/entry/2012/11/13/180644
「続きを読む」
はネタバレを防ぐために必須の物です。
にもかかわらず、見たままモードではそれができない。
残念でしょうがない。
jQuery が使えることがわかったので・・・ やるしかないだろ?
というわけで作った。
表記方法は、
「====」(括弧やそのたもろもろあってはだめ。1行に ==== のみ書かれている必要性がある。
と「=」(半角)を4つ記入でOK
ちなみに、以前の情報を元に、変更する場合は、すでにすばらしい物があるのでそちらを利用すればよい。
はてなブログで「続きを読む」記法 - カワイイはつくれる
を参考に改良し作成した。
<script> (function($) { //みたまま編集用 $('article.entry').each(function() { var $seemore = $(this).find('div.entry-content'); var $data = $seemore.children('p'); if ($seemore.length === 0) return; // ==== を探して それ以降のにクラスを付与し、隠す var flag; flag = 0; //alert( $(this).text() ); $data.each( function(){ if( flag == 1 ){ $(this).addClass('content_hide'); $(this).hide(); } if( $(this).text() == "====" ){ flag = 1; //alert( $(this).text() ); $(this).replaceWith(' 続きを読む '); //alert( $(this).text() ); } //alert( $(this).text() ); }); }); })(jQuery); $( function() { //クリックを取得して表示非表示を切り替える $("a.next_read").click(function(){ $slide_data = $(this).parent('div.entry-content').children('p.content_hide'); $slide_data.slideToggle( 'fast' ); //alert( $(this).text() ); }); });
アラートいっぱい余計な動作が含まれてるけど、気にしない。
気になる方は変更してください。
ついでに、見やすくするためにスタイルシートに以下を設定すると良いかも?
.next_read{ margin: 30px 30px; padding: 10px; border: medium solid #ccccff; background-color:#aaaacc; color:#3333ff; cursor: pointer; }