Tutorial: Bubble-Breite passt sich dynamisch an Platz neben Modal an
Bubble wird auf verfuegbaren Platz (min 260px) verkleinert und immer auf der Seite mit mehr Platz positioniert. Kein top-Fallback mehr der die Bubble aus dem Bildschirm schiebt.
Dieser Commit ist enthalten in:
@@ -1566,17 +1566,21 @@ const Tutorial = {
|
||||
|
||||
if (isModalBubble) {
|
||||
// Fuer Modal-Steps: Platz links/rechts vom Modal pruefen
|
||||
var modalEl = document.querySelector(step.target);
|
||||
var mRect = modalEl ? modalEl.getBoundingClientRect() : rect;
|
||||
var modalEl2 = document.querySelector(step.target);
|
||||
var mRect = modalEl2 ? modalEl2.getBoundingClientRect() : rect;
|
||||
var spaceLeft = mRect.left;
|
||||
var spaceRight = vw - mRect.right;
|
||||
if (spaceRight >= bw + gap) {
|
||||
var bestSpace = Math.max(spaceLeft, spaceRight);
|
||||
// Bubble-Breite an verfuegbaren Platz anpassen (min 260px)
|
||||
var modalBw = Math.min(bw, bestSpace - gap - 8);
|
||||
modalBw = Math.max(modalBw, 260);
|
||||
bw = modalBw;
|
||||
bubble.style.width = bw + 'px';
|
||||
// Seite mit mehr Platz waehlen
|
||||
if (spaceRight >= spaceLeft) {
|
||||
pos = 'right';
|
||||
} else if (spaceLeft >= bw + gap) {
|
||||
pos = 'left';
|
||||
} else {
|
||||
// Kein Platz links/rechts: Bubble ueber dem Feld im Modal platzieren
|
||||
pos = 'top';
|
||||
pos = 'left';
|
||||
}
|
||||
} else {
|
||||
if (pos === 'bottom' && (visBottom + gap + bubbleHeight > vh)) pos = 'top';
|
||||
|
||||
In neuem Issue referenzieren
Einen Benutzer sperren