Skip to content

Instantly share code, notes, and snippets.

@Josh00
Created January 24, 2018 16:49
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Josh00/fd13726bb2ce39728dad876e368ac22f to your computer and use it in GitHub Desktop.
Save Josh00/fd13726bb2ce39728dad876e368ac22f to your computer and use it in GitHub Desktop.
.table-of-contents{
display: none;
}
.show-area{
display: inline-block;
padding: 10px;
border-radius: 5px;
cursor: pointer;
margin-bottom: 0;
color: blue;
}
スマホ 記事 ページ上
目次たたむ
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
//クリックすると表示される目次
$(function(){
var $Contents = $(".table-of-contents")
$($Contents).before('<span style="font-size: 150%; color: #333;">目次</span><p class="show-area">[表示]</p>');
$(".show-area").click(function(){
var $this = $(this);
if($Contents.css('display') == 'none'){
$Contents.slideDown(400),
$this.text("[隠す]");
}else{
$Contents.slideUp(400),
$this.text("[表示]")
};
});
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment