Fixed JS
This commit is contained in:
parent
325b94b815
commit
226746d2de
@ -1197,6 +1197,10 @@ section {
|
|||||||
transition: 0.5s;
|
transition: 0.5s;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* .cal-card:hover > #community-room {
|
||||||
|
visibility: visible !important;
|
||||||
|
} */
|
||||||
|
|
||||||
#fri {
|
#fri {
|
||||||
background-color: #18b14b65;
|
background-color: #18b14b65;
|
||||||
}
|
}
|
||||||
@ -1303,6 +1307,7 @@ section {
|
|||||||
padding: 3px;
|
padding: 3px;
|
||||||
height: 500px;
|
height: 500px;
|
||||||
border: 1px solid white;
|
border: 1px solid white;
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
#map {
|
#map {
|
||||||
@ -1310,15 +1315,26 @@ section {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
z-index: 0;
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
#map-iframe {
|
/* #community-room {
|
||||||
border: 0;
|
width: 100%;
|
||||||
|
height: 99%;
|
||||||
|
position: absolute;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
|
margin-top: 3px;
|
||||||
|
visibility: hidden;
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#com-room-img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
border-radius: 10px;
|
||||||
|
object-fit: contain;
|
||||||
|
} */
|
||||||
|
|
||||||
#rules-description {
|
#rules-description {
|
||||||
margin: 10px 20px;
|
margin: 10px 20px;
|
||||||
|
BIN
img/GL_Community_Room.jpg
Normal file
BIN
img/GL_Community_Room.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 48 KiB |
@ -411,6 +411,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div id="map-container">
|
<div id="map-container">
|
||||||
<div id="map"></div>
|
<div id="map"></div>
|
||||||
|
<!-- <div id="community-room"><img id="com-room-img" src="img/GL_Community_Room.jpg"></div> -->
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
</section>
|
</section>
|
||||||
|
@ -1,3 +1,4 @@
|
|||||||
|
// Creating an observer when the user views that element
|
||||||
const observer = new IntersectionObserver(entries => {
|
const observer = new IntersectionObserver(entries => {
|
||||||
// Loop over the entries
|
// Loop over the entries
|
||||||
entries.forEach(entry => {
|
entries.forEach(entry => {
|
||||||
@ -10,55 +11,40 @@ const observer = new IntersectionObserver(entries => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
const observer_prize_2 = new IntersectionObserver(entries => {
|
const observer_prize_2 = new IntersectionObserver(entries => {
|
||||||
// Loop over the entries
|
|
||||||
entries.forEach(entry => {
|
entries.forEach(entry => {
|
||||||
// If the element is visible
|
|
||||||
if (entry.isIntersecting) {
|
if (entry.isIntersecting) {
|
||||||
// Add the animation class
|
|
||||||
entry.target.classList.add('slide-animation-prize-2');
|
entry.target.classList.add('slide-animation-prize-2');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
const observer_prize_1 = new IntersectionObserver(entries => {
|
const observer_prize_1 = new IntersectionObserver(entries => {
|
||||||
// Loop over the entries
|
|
||||||
entries.forEach(entry => {
|
entries.forEach(entry => {
|
||||||
// If the element is visible
|
|
||||||
if (entry.isIntersecting) {
|
if (entry.isIntersecting) {
|
||||||
// Add the animation class
|
|
||||||
entry.target.classList.add('slide-animation-prize-1');
|
entry.target.classList.add('slide-animation-prize-1');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
const observer_prize_3 = new IntersectionObserver(entries => {
|
const observer_prize_3 = new IntersectionObserver(entries => {
|
||||||
// Loop over the entries
|
|
||||||
entries.forEach(entry => {
|
entries.forEach(entry => {
|
||||||
// If the element is visible
|
|
||||||
if (entry.isIntersecting) {
|
if (entry.isIntersecting) {
|
||||||
// Add the animation class
|
|
||||||
entry.target.classList.add('slide-animation-prize-3');
|
entry.target.classList.add('slide-animation-prize-3');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
const observer_team_img = new IntersectionObserver(entries => {
|
const observer_team_img = new IntersectionObserver(entries => {
|
||||||
// Loop over the entries
|
|
||||||
entries.forEach(entry => {
|
entries.forEach(entry => {
|
||||||
// If the element is visible
|
|
||||||
if (entry.isIntersecting) {
|
if (entry.isIntersecting) {
|
||||||
// Add the animation class
|
|
||||||
entry.target.classList.add('slide-animation-card-img');
|
entry.target.classList.add('slide-animation-card-img');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
const observer_team_desc = new IntersectionObserver(entries => {
|
const observer_team_desc = new IntersectionObserver(entries => {
|
||||||
// Loop over the entries
|
|
||||||
entries.forEach(entry => {
|
entries.forEach(entry => {
|
||||||
// If the element is visible
|
|
||||||
if (entry.isIntersecting) {
|
if (entry.isIntersecting) {
|
||||||
// Add the animation class
|
|
||||||
entry.target.classList.add('slide-animation-card-desc');
|
entry.target.classList.add('slide-animation-card-desc');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@ -74,26 +60,13 @@ const observer = new IntersectionObserver(entries => {
|
|||||||
observer_team_desc.observe(entry);
|
observer_team_desc.observe(entry);
|
||||||
});
|
});
|
||||||
|
|
||||||
observer.observe(document.querySelector('#description-heading'));
|
|
||||||
observer.observe(document.querySelector('#event-main-box'));
|
// Adding the class animations to these elements
|
||||||
observer.observe(document.querySelector('#timeline'));
|
let elements_id = ['#description-heading', '#event-main-box', '#timeline', '#signup-title', '#steps-card', '#sponsor-title', '#sponsor-container', '#map-article', '#rules-description', '#guidelines', '#code-of-conduct', '#photo-release-container', '#second-column', '#first-column', '#third-column', '#administration', '#logistics', '#outreach', '#tech', '#marketing'];
|
||||||
observer.observe(document.querySelector('#signup-title'));
|
elements_id.forEach(entry => {
|
||||||
observer.observe(document.querySelector('#steps-card'));
|
observer.observe(document.querySelector(entry));
|
||||||
observer.observe(document.querySelector('#sponsor-title'));
|
});
|
||||||
observer.observe(document.querySelector('#sponsor-container'));
|
|
||||||
observer.observe(document.querySelector('#map-article'));
|
|
||||||
observer.observe(document.querySelector('#rules-description'));
|
|
||||||
observer.observe(document.querySelector('#guidelines'));
|
|
||||||
observer.observe(document.querySelector('#code-of-conduct'));
|
|
||||||
observer.observe(document.querySelector('#photo-release-container'));
|
|
||||||
observer.observe(document.querySelector('#second-column'));
|
|
||||||
observer.observe(document.querySelector('#first-column'));
|
|
||||||
observer.observe(document.querySelector('#third-column'));
|
|
||||||
observer_prize_2.observe(document.querySelector('#second-place'));
|
observer_prize_2.observe(document.querySelector('#second-place'));
|
||||||
observer_prize_1.observe(document.querySelector('#first-place'));
|
observer_prize_1.observe(document.querySelector('#first-place'));
|
||||||
observer_prize_3.observe(document.querySelector('#third-place'));
|
observer_prize_3.observe(document.querySelector('#third-place'));
|
||||||
observer.observe(document.querySelector('#administration'));
|
|
||||||
observer.observe(document.querySelector('#logistics'));
|
|
||||||
observer.observe(document.querySelector('#outreach'));
|
|
||||||
observer.observe(document.querySelector('#tech'));
|
|
||||||
observer.observe(document.querySelector('#marketing'));
|
|
Loading…
Reference in New Issue
Block a user