Javascriptでのmoreタグ

スポンサードリンク

Javascriptでmoreタグを作成する際の備忘録です。

1、まずはmoreタグを入れたいところに以下を記載。

<IfArticleBodyMore>
<span class=”main-continues” id=”show<$ArticleId$>”>
<a class=”acontinues” href=”<$ArticlePermalink$>”
onclick=”showMore(‘<$ArticleId$>’,'<$ArticlePermalink$>’);return false;”>
続きを読む
</a></span>
<div id=”more<$ArticleId$>” style=”display:none”>
<!– ▼続きの部分▼ –>

本文

<!– ▲続きの部分▲ –>
</div><span class=”main-continues” id=”hide<$ArticleId$>” style=”display:none”>
<a class=”acontinues” href=”#<$ArticleId$>”
onclick=”hideMore(‘<$ArticleId$>’);return true;”>
閉じる
</a></span>
</IfArticleBodyMore>

 

2、</body>の手前に以下を記載。

<script type=”text/javascript”>
<!–

function showMore(id,link){
if(document.getElementById){
if(document.getElementById(‘more’ + id).style.display){
document.getElementById(‘more’ + id).style.display=’block’;
document.getElementById(‘show’ + id).style.display=’none’;
document.getElementById(‘hide’ + id).style.display=’block’;
} else {
document.location.href=link;
return true;
}
} else {
document.location.href=link;
return true;
}
}
function hideMore(id){
if(document.getElementById){
document.getElementById(‘more’ + id).style.display=’none’;
document.getElementById(‘show’ + id).style.display=’block’;
document.getElementById(‘hide’ + id).style.display=’none’;
}
}

//–>
</script>

 

これでmoreタグの完成です。

スポンサードリンク

カテゴリー: プログラミング パーマリンク