@bebranded/bb-contents 1.1.12 → 1.1.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bb-contents.js +59 -7
- package/package.json +1 -1
package/bb-contents.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* BeBranded Contents
|
|
3
3
|
* Contenus additionnels français pour Webflow
|
|
4
|
-
* @version 1.1.
|
|
4
|
+
* @version 1.1.14
|
|
5
5
|
* @author BeBranded
|
|
6
6
|
* @license MIT
|
|
7
7
|
* @website https://www.bebranded.xyz
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
'use strict';
|
|
11
11
|
|
|
12
12
|
// Version du script
|
|
13
|
-
const BB_CONTENTS_VERSION = '1.1.
|
|
13
|
+
const BB_CONTENTS_VERSION = '1.1.14';
|
|
14
14
|
|
|
15
15
|
// Créer l'objet temporaire pour la configuration si il n'existe pas
|
|
16
16
|
if (!window._bbContentsConfig) {
|
|
@@ -289,7 +289,41 @@
|
|
|
289
289
|
const s = scope || document;
|
|
290
290
|
return s.querySelector(bbContents._attrSelector('marquee')) !== null;
|
|
291
291
|
},
|
|
292
|
-
|
|
292
|
+
|
|
293
|
+
// Détecte si un bloc contient des dropdowns (Webflow ou structure similaire)
|
|
294
|
+
_hasDropdownInBlock: function(block) {
|
|
295
|
+
if (!block || !block.querySelector) return false;
|
|
296
|
+
return block.querySelector('.w-dropdown') !== null ||
|
|
297
|
+
block.querySelector('[class*="dropdown"]') !== null;
|
|
298
|
+
},
|
|
299
|
+
|
|
300
|
+
// Active le comportement hover pour les dropdowns dans un bloc du marquee (items indépendants)
|
|
301
|
+
_enableMarqueeDropdowns: function(block) {
|
|
302
|
+
if (!block || !block.querySelectorAll) return;
|
|
303
|
+
const items = block.querySelectorAll('.bb-marquee_item, [role="listitem"]');
|
|
304
|
+
const itemList = items.length ? items : block.querySelectorAll(':scope > *');
|
|
305
|
+
itemList.forEach(function(item) {
|
|
306
|
+
const dropdowns = item.querySelectorAll('.w-dropdown, [class*="dropdown"]');
|
|
307
|
+
dropdowns.forEach(function(dropdown) {
|
|
308
|
+
const list = dropdown.querySelector('.w-dropdown-list, [class*="dropdown-list"], [class*="dropdown_list"]');
|
|
309
|
+
if (!list) return;
|
|
310
|
+
item.style.overflow = 'visible';
|
|
311
|
+
dropdown.style.overflow = 'visible';
|
|
312
|
+
list.style.zIndex = '10';
|
|
313
|
+
let leaveTimer;
|
|
314
|
+
dropdown.addEventListener('mouseenter', function() {
|
|
315
|
+
clearTimeout(leaveTimer);
|
|
316
|
+
dropdown.classList.add('w--open');
|
|
317
|
+
});
|
|
318
|
+
dropdown.addEventListener('mouseleave', function() {
|
|
319
|
+
leaveTimer = setTimeout(function() {
|
|
320
|
+
dropdown.classList.remove('w--open');
|
|
321
|
+
}, 150);
|
|
322
|
+
});
|
|
323
|
+
});
|
|
324
|
+
});
|
|
325
|
+
},
|
|
326
|
+
|
|
293
327
|
init: function(root) {
|
|
294
328
|
const scope = root || document;
|
|
295
329
|
if (scope.closest && scope.closest('[data-bb-disable]')) return;
|
|
@@ -334,7 +368,7 @@
|
|
|
334
368
|
(parentOverflowX === 'visible' || parentOverflowX === '') &&
|
|
335
369
|
(parentOverflowY === 'visible' || parentOverflowY === '');
|
|
336
370
|
const mainContainerOverflow = isParentOverflowVisible ? 'visible' : 'hidden';
|
|
337
|
-
|
|
371
|
+
|
|
338
372
|
mainContainer.style.cssText = `
|
|
339
373
|
position: relative;
|
|
340
374
|
width: 100%;
|
|
@@ -361,7 +395,9 @@
|
|
|
361
395
|
|
|
362
396
|
const mainBlock = document.createElement('div');
|
|
363
397
|
mainBlock.innerHTML = originalHTML;
|
|
364
|
-
|
|
398
|
+
const hasDropdowns = this._hasDropdownInBlock(mainBlock);
|
|
399
|
+
if (hasDropdowns) mainContainer.style.overflow = 'visible';
|
|
400
|
+
|
|
365
401
|
// Précharger toutes les images avant clonage
|
|
366
402
|
const preloadAllImagesFirst = function(block) {
|
|
367
403
|
return new Promise(function(resolve) {
|
|
@@ -652,7 +688,14 @@
|
|
|
652
688
|
if (itemHeight > maxHeight) maxHeight = itemHeight;
|
|
653
689
|
});
|
|
654
690
|
if (maxHeight === 0) maxHeight = mainBlock.offsetHeight || scrollContainer.offsetHeight;
|
|
655
|
-
if (maxHeight > 0)
|
|
691
|
+
if (maxHeight > 0) {
|
|
692
|
+
mainContainer.style.height = maxHeight + 'px';
|
|
693
|
+
}
|
|
694
|
+
if (hasDropdowns) {
|
|
695
|
+
this._enableMarqueeDropdowns(mainBlock);
|
|
696
|
+
this._enableMarqueeDropdowns(repeatBlock1);
|
|
697
|
+
this._enableMarqueeDropdowns(repeatBlock2);
|
|
698
|
+
}
|
|
656
699
|
});
|
|
657
700
|
});
|
|
658
701
|
} else {
|
|
@@ -660,6 +703,11 @@
|
|
|
660
703
|
scrollContainer.appendChild(repeatBlock1);
|
|
661
704
|
scrollContainer.appendChild(repeatBlock2);
|
|
662
705
|
mainContainer.appendChild(scrollContainer);
|
|
706
|
+
if (hasDropdowns) {
|
|
707
|
+
this._enableMarqueeDropdowns(mainBlock);
|
|
708
|
+
this._enableMarqueeDropdowns(repeatBlock1);
|
|
709
|
+
this._enableMarqueeDropdowns(repeatBlock2);
|
|
710
|
+
}
|
|
663
711
|
}
|
|
664
712
|
element.innerHTML = '';
|
|
665
713
|
element.appendChild(mainContainer);
|
|
@@ -706,7 +754,11 @@
|
|
|
706
754
|
element.innerHTML = '';
|
|
707
755
|
element.appendChild(mainContainer);
|
|
708
756
|
element.setAttribute('data-bb-marquee-processed', 'true');
|
|
709
|
-
|
|
757
|
+
if (hasDropdowns) {
|
|
758
|
+
this._enableMarqueeDropdowns(mainBlock);
|
|
759
|
+
this._enableMarqueeDropdowns(repeatBlock1);
|
|
760
|
+
this._enableMarqueeDropdowns(repeatBlock2);
|
|
761
|
+
}
|
|
710
762
|
const initDelay = isVertical ? 500 : 300;
|
|
711
763
|
setTimeout(() => {
|
|
712
764
|
this.initAnimation(element, scrollContainer, mainBlock, {
|