nicolo/fara-web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Test JS modules...

Browse Source
This commit is contained in:
Nicolò P 2021-08-01 00:58:58 +02:00
parent 2e27c692bd
commit 3a69ac878c
9 changed files with 68 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
img/fara_bg_10.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.3 MiB

BIN
img/fara_bg_11.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 266 KiB

BIN
img/fara_bg_6.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 MiB

BIN
img/fara_bg_7.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 MiB

BIN
img/fara_bg_8.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 376 KiB

BIN
img/fara_bg_9.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 921 KiB

59
index.html
View File

@ -4,7 +4,7 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="css/main.css"> <link rel="stylesheet" href="css/main.css">
<script src="" type="module"></script> <script src="js/ui.js" type="module"></script>
<title>Nel cielo di Fara</title> <title>Nel cielo di Fara</title>
</head> </head>
<body> <body>
@ -35,61 +35,4 @@
<p><img src="img/FESR_BARRA_BENEFICIARI_DEF.jpg" class="logos" alt="Loghi enti beneficiari"></p> <p><img src="img/FESR_BARRA_BENEFICIARI_DEF.jpg" class="logos" alt="Loghi enti beneficiari"></p>
</footer> </footer>
</body> </body>
<!-- MOOOVE AWAAAAAYY -->
<script type="text/javascript">
window.addEventListener('load', () => {
let navlinks = Array.from(document.querySelectorAll('#links a'));
navlinks.forEach(element => {
let ref = element.href.substr(element.href.lastIndexOf('/'), element.href.length);
if (window.location.href.includes(ref) || element.href.includes('index.html')) {
element.setAttribute('class', 'active');
}
});
let images = [
'img/fara_background.jpg',
'img/fara_bg_2.jpg',
'img/fara_bg_3.jpg',
'img/fara_bg_4.jpg',
'img/fara_bg_5.jpg',
];
let nextimage = 0;
let header = document.querySelector('header');
slider();
/**
* Fade in??
*/
function slider () {
opacity = 1;
if(nextimage >= images.length) {
nextimage = 0;
}
header.style =
'background-image : url("' +images[nextimage++] + '");';
setTimeout(slider, 3000);
}
});
window.addEventListener('scroll', event => {
let nav = document.querySelector('#nav');
let links = document.querySelector('#links');
if (window.pageYOffset !== 0) {
nav.classList.add('bg-white');
nav.classList.remove('text-gray');
links.classList.add('nav-dark');
links.classList.remove('nav-light');
}
else {
nav.classList.add('text-gray');
nav.classList.remove('bg-white');
links.classList.add('nav-light');
links.classList.remove('nav-dark');
}
});
</script>
</html> </html>

16
js/fara.js Normal file
View File

@ -0,0 +1,16 @@
//use strict;
export {Farapp};
const Farapp = {
slider : /*** Fade in??*/ function (element, nextimage) {
opacity = 1;
if(nextimage >= images.length) {
nextimage = 0;
}
element.style =
'background-image : url("' +images[nextimage++] + '");';
setTimeout(slider, 2000);
}
}

51
js/ui.js Normal file
View File

@ -0,0 +1,51 @@
//use strict;
import { Farapp } from "./fara";'fara.js';
window.addEventListener('load', () => {
let navlinks = Array.from(document.querySelectorAll('#links a'));
navlinks.forEach(element => {
let ref = element.href.substr(element.href.lastIndexOf('/'), element.href.length);
if (window.location.href.includes(ref) || element.href.includes('index.html')) {
element.setAttribute('class', 'active');
}
});
let images = [
'img/fara_background.jpg',
//'img/fara_bg_2.jpg',
'img/fara_bg_3.jpg',
'img/fara_bg_4.jpg',
'img/fara_bg_5.jpg',
//'img/fara_bg_6.jpg',
'img/fara_bg_7.jpg',
'img/fara_bg_8.jpg',
'img/fara_bg_9.jpg',
'img/fara_bg_10.png',
'img/fara_bg_11.jpg',
];
let nextimage = 0;
let header = document.querySelector('header');
Farapp.slider(header, nextimage);
});
window.addEventListener('scroll', event => {
let nav = document.querySelector('#nav');
let links = document.querySelector('#links');
if (window.pageYOffset !== 0) {
nav.classList.add('bg-white');
nav.classList.remove('text-gray');
links.classList.add('nav-dark');
links.classList.remove('nav-light');
}
else {
nav.classList.add('text-gray');
nav.classList.remove('bg-white');
links.classList.add('nav-light');
links.classList.remove('nav-dark');
}
});