more表示を折りたたみ表示に

通常、moreをクリックすると、詳細リンク(Parmalink)へ飛び、当該アイテム(記事)のみを表示する。
ちらっと、「続き」部分を見て、すぐに次の記事を見たい場合は、不便。
折りたたんだものをのばすようにmore部分を表示したり、また、折りたたむ・・・といように表示する方法。
スキンのメインの目次のhead部分に以下の記述をする。

<script language="javascript">
<!-
function showMore(varA1, varB1){
var123 = (‘varXYZ' + (varA1));
varABC = (‘varP' + (varA1));
if( document.getElementById ) {
if( document.getElementById(var123).style.display ) {
if( varB1 != 0 ) {
document.getElementById(var123).style.display = “block”;
document.getElementById(varABC).style.display = “none”;
} else { document.getElementById(var123).style.display = “none”;
document.getElementById(varABC).style.display = “block”; }
} else { location.href = varB1;
return true; }
} else { location.href = varB1;
return true; }
}
//->
</script>

ほんでもって、テンプレートのアイテムの続きへのリンクを下記のように記述。
<div id="varP<%itemid%>" style="text-align: right;">
<a href="<%itemlink%>#<%itemid%>" onclick="showMore(<%itemid%>,'<%itemlink%>#<%itemid%>');return false;">...続きを読む</a><br />
</div>
<div id="varXYZ<%itemid%>" style="display: none"><%more%><br />
<div style="text-align: right;">
<a href="#<%itemid%>" onclick="showMore(<%itemid%>,0);return true;">続きをたたむ</a>
</div>
</div>

コメント

タイトルとURLをコピーしました