More actions
No edit summary |
No edit summary |
||
Line 13: | Line 13: | ||
card.addEventListener('click', function(event) { | card.addEventListener('click', function(event) { | ||
event.stopPropagation(); // Prevent event bubbling | event.stopPropagation(); // Prevent event bubbling | ||
// Collapse all other sub-cards first | // Collapse all other sub-cards first | ||
document.querySelectorAll('.sub-card').forEach(otherCard => { | document.querySelectorAll('.sub-card').forEach(otherCard => { | ||
Line 20: | Line 20: | ||
} | } | ||
}); | }); | ||
// Toggle the expanded state of the clicked card | // Toggle the expanded state of the clicked card | ||
const isExpanded = card.getAttribute('data-expanded') === 'true'; | const isExpanded = card.getAttribute('data-expanded') === 'true'; |
Revision as of 19:43, 22 December 2024
/* Any JavaScript here will be loaded for all users on every page load. */
$(function(){
$('.card').on('mouseenter', function(event){
event.preventDefault();
$(this).toggleClass('hovered');
});
$('.card').on('mouseleave', function(event){
event.preventDefault();
$(this).toggleClass('hovered');
});
});
document.querySelectorAll('.sub-card').forEach(card => {
card.addEventListener('click', function(event) {
event.stopPropagation(); // Prevent event bubbling
// Collapse all other sub-cards first
document.querySelectorAll('.sub-card').forEach(otherCard => {
if (otherCard !== card) {
otherCard.setAttribute('data-expanded', 'false');
}
});
// Toggle the expanded state of the clicked card
const isExpanded = card.getAttribute('data-expanded') === 'true';
card.setAttribute('data-expanded', isExpanded ? 'false' : 'true');
});
});
document.querySelectorAll('.card').forEach(card => {
card.addEventListener('mouseleave', function() {
// Collapse all sub-cards when mouse leaves the main card
document.querySelectorAll('.sub-card').forEach(subCard => {
subCard.setAttribute('data-expanded', 'false');
});
});
});