Test Page: Difference between revisions

From :: ChromeRivals Wiki ::
Jump to navigation Jump to search
Ranzu (talk | contribs)
No edit summary
Ranzu (talk | contribs)
No edit summary
Line 25: Line 25:
<button class="tablink" onclick="openCity('Tokyo', this, 'blue')">Tokyo</button>
<button class="tablink" onclick="openCity('Tokyo', this, 'blue')">Tokyo</button>
<button class="tablink" onclick="openCity('Oslo', this, 'orange')">Oslo</button>
<button class="tablink" onclick="openCity('Oslo', this, 'orange')">Oslo</button>
<script>
function openCity(cityName,elmnt,color) {
  var i, tabcontent, tablinks;
  tabcontent = document.getElementsByClassName("tabcontent");
  for (i = 0; i < tabcontent.length; i++) {
    tabcontent[i].style.display = "none";
  }
  tablinks = document.getElementsByClassName("tablink");
  for (i = 0; i < tablinks.length; i++) {
    tablinks[i].style.backgroundColor = "";
  }
  document.getElementById(cityName).style.display = "block";
  elmnt.style.backgroundColor = color;
}
// Get the element with id="defaultOpen" and click on it
document.getElementById("defaultOpen").click();
</script>

Revision as of 14:16, 5 September 2022

Click on the buttons inside the tabbed menu:

London

London is the capital city of England.

Paris

Paris is the capital of France.

Tokyo

Tokyo is the capital of Japan.

Oslo

Oslo is the capital of Norway.

<button class="tablink" onclick="openCity('London', this, 'red')" id="defaultOpen">London</button> <button class="tablink" onclick="openCity('Paris', this, 'green')">Paris</button> <button class="tablink" onclick="openCity('Tokyo', this, 'blue')">Tokyo</button> <button class="tablink" onclick="openCity('Oslo', this, 'orange')">Oslo</button>