2025-02-12 18:49:34 +00:00
|
|
|
<!DOCTYPE html>
|
2025-02-13 19:04:06 +00:00
|
|
|
<html>
|
|
|
|
|
<head>
|
2025-02-13 19:08:58 +00:00
|
|
|
<title> Cian O'Shaughnessy's Website </title>
|
2025-02-13 20:09:00 +00:00
|
|
|
<link rel="stylesheet" href= "style.css">
|
2025-02-13 19:04:06 +00:00
|
|
|
</head>
|
|
|
|
|
|
2025-02-13 20:06:40 +00:00
|
|
|
<h2>Tabs</h2>
|
|
|
|
|
<p>Click on the buttons inside the tabbed menu:</p>
|
2025-02-13 19:04:06 +00:00
|
|
|
|
2025-02-13 20:06:40 +00:00
|
|
|
<div class="tab">
|
|
|
|
|
<button class="tablinks" onclick="openCity(event, 'Home')">Home</button>
|
|
|
|
|
<button class="tablinks" onclick="openCity(event, 'Blogs')">Blogs</button>
|
|
|
|
|
<button class="tablinks" onclick="openCity(event, 'Links')">Links</button>
|
|
|
|
|
</div>
|
2025-02-13 19:04:06 +00:00
|
|
|
|
|
|
|
|
<div id="Home" class="tabcontent">
|
|
|
|
|
<h3>Home</h3>
|
2025-02-13 20:06:40 +00:00
|
|
|
<p>Welcome to my Page</p>
|
2025-02-13 19:04:06 +00:00
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="Blogs" class="tabcontent">
|
|
|
|
|
<h3>Blogs</h3>
|
2025-02-13 20:06:40 +00:00
|
|
|
<p> Here are my Blogs.</p>
|
2025-02-13 19:04:06 +00:00
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="Links" class="tabcontent">
|
|
|
|
|
<h3>Links</h3>
|
2025-02-13 20:06:40 +00:00
|
|
|
<p>The links i use.</p>
|
2025-02-12 21:26:50 +00:00
|
|
|
</div>
|
2025-02-13 20:49:53 +00:00
|
|
|
<script>
|
|
|
|
|
function openCity(evt, cityName) {
|
|
|
|
|
var i, tabcontent, tablinks;
|
|
|
|
|
tabcontent = document.getElementsByClassName("tabcontent");
|
|
|
|
|
for (i = 0; i < tabcontent.length; i++) {
|
|
|
|
|
tabcontent[i].style.display = "none";
|
|
|
|
|
}
|
|
|
|
|
tablinks = document.getElementsByClassName("tablinks");
|
|
|
|
|
for (i = 0; i < tablinks.length; i++) {
|
|
|
|
|
tablinks[i].className = tablinks[i].className.replace(" active", "");
|
|
|
|
|
}
|
|
|
|
|
document.getElementById(cityName).style.display = "block";
|
|
|
|
|
evt.currentTarget.className += " active";
|
|
|
|
|
}
|
|
|
|
|
</script>
|
2025-02-13 19:04:06 +00:00
|
|
|
</body>
|
2025-02-12 18:49:34 +00:00
|
|
|
</html>
|
