Skip to content

Commit 7b8e77d

Browse files
bbauskabbauska
authored
Update index.html
1 parent 44a7150 commit 7b8e77d

1 file changed

Lines changed: 42 additions & 16 deletions

File tree

‎index.html‎

Lines changed: 42 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -17,25 +17,52 @@
1717
<link href='https://fonts.googleapis.com/css?family=Armata' rel='stylesheet' type='text/css'>
1818

1919
<!-- favicons -->
20-
<link rel="apple-touch-icon" sizes="57x57" href="./images/apple-icon-57x57.png">
21-
<link rel="apple-touch-icon" sizes="60x60" href="./images/apple-icon-60x60.png">
22-
<link rel="apple-touch-icon" sizes="72x72" href="./images/apple-icon-72x72.png">
23-
<link rel="apple-touch-icon" sizes="76x76" href="./images/apple-icon-76x76.png">
24-
<link rel="apple-touch-icon" sizes="114x114" href="./images/apple-icon-114x114.png">
25-
<link rel="apple-touch-icon" sizes="120x120" href="./images/apple-icon-120x120.png">
26-
<link rel="apple-touch-icon" sizes="144x144" href="./images/apple-icon-144x144.png">
27-
<link rel="apple-touch-icon" sizes="152x152" href="./images/apple-icon-152x152.png">
28-
<link rel="apple-touch-icon" sizes="180x180" href="./images/apple-icon-180x180.png">
29-
<link rel="icon" type="image/png" sizes="192x192" href="./images/android-icon-192x192.png">
30-
<link rel="icon" type="image/png" sizes="32x32" href="./images/favicon-32x32.png">
31-
<link rel="icon" type="image/png" sizes="96x96" href="./images/favicon-96x96.png">
32-
<link rel="icon" type="image/png" sizes="16x16" href="./images/favicon-16x16.png">
20+
<link rel="apple-touch-icon" sizes="57x57" href="./images/favicon/apple-icon-57x57.png">
21+
<link rel="apple-touch-icon" sizes="60x60" href="./images/favicon/apple-icon-60x60.png">
22+
<link rel="apple-touch-icon" sizes="72x72" href="./images/favicon/apple-icon-72x72.png">
23+
<link rel="apple-touch-icon" sizes="76x76" href="./images/favicon/apple-icon-76x76.png">
24+
<link rel="apple-touch-icon" sizes="114x114" href="./images/favicon/apple-icon-114x114.png">
25+
<link rel="apple-touch-icon" sizes="120x120" href="./images/favicon/apple-icon-120x120.png">
26+
<link rel="apple-touch-icon" sizes="144x144" href="./images/favicon/apple-icon-144x144.png">
27+
<link rel="apple-touch-icon" sizes="152x152" href="./images/favicon/apple-icon-152x152.png">
28+
<link rel="apple-touch-icon" sizes="180x180" href="./images/favicon/apple-icon-180x180.png">
29+
<link rel="icon" type="image/png" sizes="192x192" href="./images/favicon/android-icon-192x192.png">
30+
<link rel="icon" type="image/png" sizes="32x32" href="./images/favicon/favicon-32x32.png">
31+
<link rel="icon" type="image/png" sizes="96x96" href="./images/favicon/favicon-96x96.png">
32+
<link rel="icon" type="image/png" sizes="16x16" href="./images/favicon/favicon-16x16.png">
3333
<link rel="manifest" href="./manifest.json">
3434
<meta name="msapplication-TileColor" content="#ffffff">
35-
<meta name="msapplication-TileImage" content="./images/ms-icon-144x144.png">
35+
<meta name="msapplication-TileImage" content="./images/favicon/ms-icon-144x144.png">
3636
<meta name="theme-color" content="#ffffff">
3737
</head>
38-
<body>
38+
<body>
39+
<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
40+
<button onclick="topFunction()" id="myBtn" title="Go to top">Top</button>
41+
<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
42+
<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~ script function: scrollFunction() ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
43+
<script>
44+
<!-- get the button -->
45+
var mybutton = document.getElementById("myBtn");
46+
47+
<!-- when the user scrolls down 10px from the top of the document, show the button -->
48+
window.onscroll = function() {scrollFunction()};
49+
50+
function scrollFunction() {
51+
if (document.body.scrollTop > 10 || document.documentElement.scrollTop > 10) {
52+
mybutton.style.display = "block";
53+
} else {
54+
mybutton.style.display = "none";
55+
}
56+
}
57+
<!-- when the user clicks on the button, scroll to the table of contents. -->
58+
// when the user clicks on the button, scroll to the table of contents near top of document.
59+
function topFunction() {
60+
document.getElementById('toc').scrollIntoView();
61+
}
62+
</script>
63+
<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
64+
<h1 id="#toc">Table of Contents - DOM (Document Object Model)</h1>
65+
<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
3966
<ol>
4067
<li><a href="#D01">01. JavaScript - How to Manipulate DOM Elements?</a></li>
4168
<li><a href="#D02">02. How to Add a <b><mark>Class</mark></b> to <b><mark>DOM Element</mark></b> in JavaScript?</a></li>
@@ -55,7 +82,6 @@
5582
<li><a href="#D16">16. JavaScript <b><mark>innerHTML</mark></b></a></li>
5683
</ol>
5784
<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
58-
<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ readme.md of dom ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
5985
<h1 align="center">DOM</h1>
6086
<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
6187
<h2 id="D01">01 JavaScript - How to Manipulate DOM Elements?</h2>

0 commit comments

Comments
 (0)