jTruncSubstr「続きを読む」の折りたたみ

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fuga reprehenderit architecto consequuntur error totam porro maiores at! Sit, amet, commodi distinctio eius error quia et quam sint quas aspernatur fuga! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
演奏音たてへぶんへぐるぐる野たですると大きなたたというセロた。俄たらだを長いはたましも小麦のいやたての所をもまるでセロですたて、などセロにしはすりでし。 しいただい何は小太鼓が長いですとこんどの顔のセロ勢にする第六こども館のおじぎがしていたら長い。からだも前居りしまいだ。一虎トマトのようをやめているず。セロ東狸とこれをしてっです。風車はお母さんをまにふるえてたしばをひものようから云わてホールへわけでまるでホールにしていただいた。そんなにぐるぐる度がセロからちがうました。これ少しにセロで出て駒へなるたまし何を風。わたしは一生けん命のところのすこしこんどのなかをはじめう長い。野はかっこうがお楽長になっを楽長を先生が答えながらしかと夜飛びだしましなかで考えましない。 

<div class="omission">
	Lorem ipsum dolor sit amet, consectetur adipisicing（略）cillum dolore eu fugiat nulla pariatur.
</div>


.truncate_more_link {  /*.truncate_more_link …開閉部分のクラス名 */
	text-decoration: none;
	font-weight: bold;
	color: #9400d3;
	cursor: pointer;
	}


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> //古いver.じゃないと動作がぎこちない。
<script src="jquery.jtruncsubstr-1.0rc.js"></script>
<script>
	$().ready(function() {
		$('.omission').jTruncSubstr({	//.omission部分は任意の.クラス名（または#id名）
			length: 100,				//表示させる文字数（スマホだと300字くらいが適当かな…）
			minTrail: 20,				//省略文字の最低文字数。これ以下しか省略されないようなら処理しない。
			moreText: "続きを読む",		//非表示部分を表示するリンクの文字列　デフォルトはmore
			lessText: "閉じる",			//表示した後、再び非表示にするリンクの文字列　デフォルトはless
			ellipsisText: "...",		//続きがあることを表示するための文字列
			moreAni: "600",				//表示時のアニメーション速度。デフォルトは 500。
			lessAni: "300",				//非表示時のアニメーション速度。デフォルトは 500。
		});
	});
</script>

オプション設定も可能

演奏音たてへぶんへぐるぐる野たですると大きなたたというセロた。俄たらだを長いはたましも小麦のいやたての所をもまるでセロですたて、などセロにしはすりでし。 しいただい何は小太鼓が長いですとこんどの顔のセロ勢にする第六こども館のおじぎがしていたら長い。からだも前居りしまいだ。一虎トマトのようをやめているず。セロ東狸とこれをしてっです。風車はお母さんをまにふるえてたしばをひものようから云わてホールへわけでまるでホールにしていただいた。そんなにぐるぐる度がセロからちがうました。これ少しにセロで出て駒へなるたまし何を風。わたしは一生けん命のところのすこしこんどのなかをはじめう長い。野はかっこうがお楽長になっを楽長を先生が答えながらしかと夜飛びだしましなかで考えましない。 

<div jg="jTruncSubstr" jg:jTruncSubstr="length:30,moreText:'続きを読んでね！',lessText:'折りたたむよ！'">
	演奏音たてへぶんへぐるぐる野たですると大きなた…（略）… 夜飛びだしましなかで考えましない。
</div>


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script src="jglycy-1.0.js"></script>
<script src="jquery.jtruncsubstr-1.0rc.js"></script>

TOP