Größe des Fensters bei lab.js-Aufgabe

Question

Hallo!

Ich habe nochmal mit den Größeneinstellungen bei lab.js-Einbindung rumprobiert. Bei sehr hohen lab-js-Aufgaben hatte ich immer noch das Problem, dass der Inhalt unten überhängt (z.b. über das Impressum), egal welche Darstellungsform und Seitenverhältnisse ich wähle.
Eine halbe Lösung, die ich gefunden habe, ist die Höhe der "container s2background" Klasse auf "max-content" zu stellen. Dadurch passt sich das lab.js-Feld automatisch der Größe des lab.js-Inhalts an. Einziges Problem dabei noch: Die Position des Impressums bleibt fix und je nach Größe verschwindet es dann unter dem Inhalt.

1. Ist das eine sinnvolle Lösung oder fliegt mir das bei der Erhebung irgendwie um die Ohren?
2. Gibt es eine Möglichkeit, dass das Impressum mitwandert?

Vielen Dank!

Comments

Mache das über Javascript

---

Möchten Sie mal einen Pretest-Link direkt zu der Seite mit der lab.js-Einbindung posten? Wir hatten zwar viel getestet, aber offenbar haben wir noch nicht alle Eventualitäten abgedeckt.

Was hatten Sie denn als Angabe für das Seitenverhältnis ausprobiert?

---

Hier der Link: https://www.soscisurvey.de/meta-hd2/?act=qCrHgjiG8CDkHzNgxzb96UiI

Im Link zweimal auf Weiter klicken, dann erscheint eine der längeren labjs-Seiten. Wenn man das Fenster schmaler macht, dann hängt der Text unten über - daran erkennbar, dass das Impressum nicht mehr sichtbar ist.

Seitenverhältnisse habe ich von 100:60 bis 100:999 ausprobiert, ohne Effekt. Für die Seite habe ich das Presenter-Layout aktiviert. Ich bin mit meiner aktuellen Lösung einigermaßen zufrieden (bis auf das überschattete Impressum), aber es wäre vielleicht gut, wenn es eine allgemeine Lösung gibt, bei der das für lab-js vorgesehene Fenster sich automatisch an dessen Inhalt anpasst.

Der JavaScript-Code auf der Seite ist folgender:

document.getElementById('ME01_container').style.height = "max-content";
document.getElementById('ME01_container').style["min-height"] = "100%";

---

Ich sehe gerade, dass das Impressum verschwindet, sobald ich das Fenster nicht auf voller Größe habe.

---

Ich hake hier nochmal nach: Könnte ich für die Datenerhebung das Layout erstmal so verwenden, wie ich es jetzt habe inklusive dem JS-Teil?

---

Urlaubsbedingt habe ich mir die Details noch nicht ansehen können. Aber statt JavaScript könnten Sie das CSS auch einfach direkt in die Seite einbinden:

pageCSS('
  #ME01_container {
    height: max-content;
    min-height: 100%;
  }
');

Mit "max-content" habe ich bisher kaum gearbeitet, sodass ich weder zur Browser-Unterstützung noch zu eventuellen Fallstricken etwas sagen kann.

---

Vielen Dank für die Antwort aus dem Urlaub und den Hinweis auf CSS.

Ich recherchiere mal, ob max-content ein Problem werden könnte. Im Moment sieht es für mich so aus, als sei das die beste Lösung. Danke!

---

Die Kompatibilität von max-content ist wohl nicht so toll. Schade! Vielleicht eine Lösung für die Zukunft.

---

Möchten Sie mir die ZIP-Datei Ihres lab.js-Experiments vielleicht an die info@soscisurvey.de zukommen lassen? Das würde die Behebung des Problems ein wenig beschleunigen, weil ich dann kein Test-Experiment anlegen muss.

---

Habe es Ihnen gerade geschickt.

Answer 1

Danke für Pretest-Link und Übermittlung der ZIP-Datei.

Mittlerweile konnte ich die Problematik ein wenig eingrenzen. Es kommen hier drei Sachverhalte zusammen:

1) Sie zeigen das lab.js-Experiment nicht im Vollbild sondern (Voreinstellung) innerhalb des Fragebogens und

2) Sie haben für die Seite ein Layout gewählt, welches die gesamte Bildschirmbreite nutzt. Auch das ist im Prinzip sinnvoll.

3) Ihr lab.js-Experiment definiert eine maximale Breite von 800 Pixeln. Das haben Sie - glaube ich - noch nachträglich direkt auf der Fragebogen-Seite ergänzt.

main {
  width: 90%;
  max-width: 800px;
  margin: 0 auto;
  font-size: 13px;
  background-color: white;
}

Nun ist es aber so, dass die Standardvorgabe für die lab-js-Frage ist, dass sie die verfügbare Breite und dazu eine Höhe im 16:9-Verhältnis nutzt. Das heißt: Es wird für das Experiment der gesamte BIldschirmplatz genutzt, eine Kopfleiste und ein Impressum sind da nicht mehr vorgesehen bzw. sollen aus dem sichtbaren Bereich gescrollt werden.

Nun schreiben Sie aber, dass Sie das Impressum gerne anzeigen würden. Dafür würde es nun im Prinzip helfen, wenn Sie das Seitenverhältnis auf einen Wert von z.B. 40% festlegen. Aber dann reicht es wieder nicht, wenn das Fenster schmaler wird.

Ohnehin ist ist lab-js-Experiment recht untypisch, weil es die Elemente nicht mit der Seite skaliert, sondern einfach klassisch Fließtext verwendet, sodass das Seitenverhältnis je nach Bildschirm (oder Mobilgerät) variiert. Für diesen Anwendungsfall bietet die lab.js-Einbindung nun auf www.soscisurvey.de bei "Vollbild" eine zusätzliche Option, welche kein Seritenverhältnis vorgibt. Ich denke, damit sollten Sie eine Darstellung passend zu Ihrem Experiment bekommen?

Comments

Vielen Dank für die ausführliche Hilfe! Ich habe auf jeden Fall eine Option gefunden, mit der ich sehr gut leben kann. Danke! Was müsste ich bei folgenden lab.js-Experimenten denn anders machen, damit das mit der Darstellung einfacher passt? Bezüglich "recht untypisch"

---

Wenn Sie mir der aktuellen Darstellung glücklich sind, müssen Sie gar nichts anders machen :)

Typischerweise laufen psychologische Experimente als Vollbild und so, wie man es im Labor vor Ort hätte: Also mit fester Bildschirmgröße oder zumindest mit festem Seitenverhältnis, überlicherweise 16:9. Und dann sind die Elemente eben kein Fließtext mit variabler Größe, sondern z.B. geometrische Formen, die immer einen festen Anteil des BIldschirms einnehmen und evtl. mit der BIldschirmgröße skalieren.

Wie gesagt, so sieht der Hintergrund aus, den ich für psychologische Experimente kenne. Aber da lab.js super flexibel ist und SoSci Survey auch, spricht natürlich nichts dagegen, das man die traditionellen Grenzen überschreitet.

---

Achso, ich verstehe. Für mein aktuelles Experiment spielt das tatsächlich eine untergeordnete Rolle. Danke für den Hinweis! :)