JSFiddle - React, Tailwind, and code Playground

by rami7250

HTML

<iframe id="zoome" height="150px" width="400px" allowfullscreen="" frameborder="0" border="0" src="www.coreneto.com/delete/pages/0"></iframe>

<div id="menu">
  <ul>
    <li>
      <button onclick="next()">Next Page</button>
    </li>
    <li>
      <button onclick="previous()">Previous Page</button>
    </li>
    <li>
      Page <span id="currentPage"></span> / <span id="pages"></span>
    </li>

  </ul>
</div>

JavaScript

var pNum = 1;
var maxPage = 100;

document.getElementById("currentPage").innerHTML = pNum;
document.getElementById("pages").innerHTML = maxPage;

this.next = function() {
  pNum++;
  if (pNum > maxPage) pNum = 1;
  document.getElementById("zoome").src = "http://coreneto.com/delete/pages/" + pNum;  
  document.getElementById("currentPage").innerHTML = pNum;
}

this.previous = function () {
  pNum--;
  if (pNum < 1) pNum = 1;
  document.getElementById("zoome").src = "http://coreneto.com/delete/pages/" + pNum;
  document.getElementById("currentPage").innerHTML = pNum;
}