좌우 여백에 이전글 다음글 표시 버튼 Script

html body  안쪽에삽입

<!--F 빅 사이즈 좌우 버튼 (1400px 이상 좌우 배치) -->

<div id="outer_btn_left" class="hidden"></div>

<div id="outer_btn_right" class="hidden"></div>

<s_paging>아래에삽입

<!--F 좌우 여백에 이전글 다음글 표시 Script 완벽 동작 버전 by Readiz (1400px 이상) -->

<div id="prevTmp" class="hidden"><a class=""><i class='fa fa-5x fa-chevron-left'></i><img src="http://cfs.tistory.com/custom/blog/27/274786/skin/images/prev.png"></a></div>

<div id="nextTmp" class="hidden"><a class=""><i class='fa fa-5x fa-chevron-right'></i><img src="http://cfs.tistory.com/custom/blog/27/274786/skin/images/next.png"></a></div>

<script>

document.getElementById("outer_btn_left").innerHTML = document.getElementById("prevTmp").innerHTML;

document.getElementById("outer_btn_right").innerHTML = document.getElementById("nextTmp").innerHTML;

     </script>

css맨아래삽입

/* Outer Buttons (Previous, Next) */

@media screen and (min-width: 600px) {

  #outer_btn_left {

    display: inline-block !important;

    visibility: visible !important;

    position:fixed;

    top:40%;

    left:1%;

    z-index: 10000;

  }

  #outer_btn_right {

    display: inline-block !important;

    visibility: visible !important;

    position:fixed;

    margin-right:100px;

    top:40%;

    right:1%;

    z-index: 10000;

  }

  #outer_btn_left .no-more-prev {

    display:none !important;

  }

  #outer_btn_right .no-more-next {

    display:none !important;

  }

  #outer_btn_left a, #outer_btn_right a {

    color: #333;

  }

  #outer_btn_left a, #outer_btn_right a {

    width: 23px;

    border: 2px solid #f7f7f7;

    background: #f7f7f7;

    text-align: center;

    position: fixed;

    opacity: 0.6;

    filter: alpha(opacity=60);

    -webkit-border-radius: 30px;

    -moz-border-radius: 30px;

    -o-border-radius: 30px;

    border-radius: 50px;

    -webkit-transition: all .25s linear;

    -moz-transition: all .25s linear;

    -o-transition: all .25s linear;

    transition: all .25s linear;

    padding: 15px;

  }

  #outer_btn_left a:hover, #outer_btn_right a:hover {

    background: #b3b3b3;

    border: 2px solid #b3b3b3;

  }

}