Added loadCSS(). Now css links are no longer required for both footer and navbar.
This commit is contained in:
parent
b234e14298
commit
58c108a229
7 changed files with 17 additions and 19 deletions
|
@ -6,16 +6,14 @@
|
|||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
|
||||
<script src="lib/anime.min.js"></script>
|
||||
<script src="js/base.js"></script>
|
||||
<script src="../lib/anime.min.js"></script>
|
||||
<script src="../js/base.js"></script>
|
||||
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
||||
rel="stylesheet">
|
||||
<link href="css/base.css" rel="stylesheet">
|
||||
<link href="css/navbar.css" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
|
@ -14,8 +14,6 @@
|
|||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
||||
rel="stylesheet">
|
||||
<link href="../css/base.css" rel="stylesheet">
|
||||
<link href="../css/navbar.css" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
|
@ -14,8 +14,6 @@
|
|||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
||||
rel="stylesheet">
|
||||
<link href="../css/base.css" rel="stylesheet">
|
||||
<link href="../css/navbar.css" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
|
@ -14,9 +14,6 @@
|
|||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
||||
rel="stylesheet">
|
||||
<link href="css/base.css" rel="stylesheet">
|
||||
<link href="css/navbar.css" rel="stylesheet">
|
||||
<link href="css/footer.css" rel="stylesheet">
|
||||
<link href="css/index.css" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
|
|
|
@ -14,8 +14,6 @@
|
|||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
||||
rel="stylesheet">
|
||||
<link href="../css/base.css" rel="stylesheet">
|
||||
<link href="../css/navbar.css" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
|
@ -14,8 +14,6 @@
|
|||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
||||
rel="stylesheet">
|
||||
<link href="../css/base.css" rel="stylesheet">
|
||||
<link href="../css/navbar.css" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
19
js/base.js
19
js/base.js
|
@ -20,7 +20,7 @@ function load(urlHTML, elementHTML, urlJS, elementJS) {
|
|||
})
|
||||
.catch(
|
||||
function (err) {
|
||||
console.warn('Could not load the Navbar.', err)
|
||||
console.warn('Could not load '+urlHTML+': Add the correct tag ?', err);
|
||||
}
|
||||
);
|
||||
}
|
||||
|
@ -32,7 +32,7 @@ function loadHTML(url, element) {
|
|||
element.innerHTML = htmltext;
|
||||
}).catch(
|
||||
function (err) {
|
||||
console.warn('Could not load the Navbar.', err)
|
||||
console.warn('Could not load '+url+': Add the correct tag ?', err);
|
||||
}
|
||||
);
|
||||
}
|
||||
|
@ -43,6 +43,13 @@ function loadJS(url, element) {
|
|||
element.appendChild(scriptTag);
|
||||
}
|
||||
|
||||
function loadCSS(url, element) {
|
||||
var linkTag = document.createElement('link');
|
||||
linkTag.rel = "stylesheet";
|
||||
linkTag.href = url;
|
||||
element.appendChild(linkTag);
|
||||
}
|
||||
|
||||
function ready(callback) {
|
||||
// in case the document is already rendered
|
||||
if (document.readyState != 'loading') callback();
|
||||
|
@ -88,7 +95,11 @@ function concatPath(slashNum, basePath)
|
|||
/* main */
|
||||
/****************************************/
|
||||
|
||||
var headTag = document.getElementsByTagName("head")[0];
|
||||
window.addEventListener('load', function () {
|
||||
load(urlStr+"components/navbar.html", document.getElementsByTagName("Navbar")[0], urlStr+"js/navbar.js", this.document.getElementsByTagName("head")[0]);
|
||||
load(urlStr+"components/footer.html", document.getElementsByTagName("Footer")[0], urlStr+"js/footer.js", this.document.getElementsByTagName("head")[0]);
|
||||
loadCSS(urlStr+"css/base.css", headTag);
|
||||
loadCSS(urlStr+"css/navbar.css", headTag);
|
||||
load(urlStr+"components/navbar.html", document.getElementsByTagName("Navbar")[0], urlStr+"js/navbar.js", headTag);
|
||||
loadCSS(urlStr+"css/footer.css", headTag);
|
||||
load(urlStr+"components/footer.html", document.getElementsByTagName("Footer")[0], urlStr+"js/footer.js", headTag);
|
||||
})
|
Loading…
Add table
Reference in a new issue