Polarisierte Darstellung auf dem Handy

Question

Liebes Team,
Es geht um die polarisierte Darstellung von Items auf dem Smartphone. Die Darstellung auf dem Desktop/Laptop ist optimal (Bild 1). Leider ist die Darstellung auf dem Handy nicht optimal (Bild 2). Was kann ich tun um dieses Problem zu beheben?
Vielen Dank.
Bild 1
Bild 2

Auf einem tablet läuft es auch unproblematisch wie auf PC/laptop

Vielen Dank

Answer 1

Was kann ich tun um dieses Problem zu beheben?

Wenn der Platz nicht ausreicht, können Sie wenig tun - dann muss SoSci Survey eine Darstellung verwenden, die den verfügbaren Platz nutzt. Auf dem Screenshot sieht es so aus, dass (selbst) im Querformat der Platz "grade so" nicht ausreicht.

Sie könnten also die Auswahlpunkte näher zusammenrücken lassen. Und wenn Sie einen Pretest-Link direkt (!) zur betroffenen Seite als Kommentar posten, dann prüfe ich gerne nochmal, wo genau es mit der Breite hakt.

Comments

Vielen Dank, hier ist der Pre-test link:

https://www.soscisurvey.de/anmki-advice2/?act=WqpU5oe9FMHPmVbMmZCVHZXZ

, die Seite wird nur bei zwei von vier Teilnehmer aufgerufen (KI-Gruppe). Also wenn es um die ANM Seite geht. Vielen Dank

---

Der Link scheint auf die erste Seite zu verweisen, nicht auf die Seite mit der betroffenen Frage?

---

OK ich habe es herausgefunden, wie ich den Pretest zu der Seite verweise, das müsse der Link sein : https://www.soscisurvey.de/anmki-advice2/?act=Pju0bbUZy0G2J40VrMwD8y1R
Ich hoffe sehr es klappt mit diesem Link

---

Danke für den Link. Ich habe Ihnen etwas entsprechendes gebaut: https://support.soscisurvey.de/?qa=53417/polarisierte-darstellung-auf-dem-handy&show=53476#a53476

Das Umschalten können Sie auch am PC ausprobieren, wenn Sie das Fenster einfach schmaler schieben.

Answer 2

Sie können das Umschalten in den "schmalen" Modus durch folgende Ergänzung auf der Seite auf eine kleinere Breite einstellen:

pageCSS('
    div.s2items#AM01_tab div.s2item {
      flex-flow: nowrap;
    }
    #AM01_tab div.s2item > div.s2label.s2layoutMatrix.s2polarLeft,
    #AM01_tab div.s2item > div.s2label.s2layoutMatrix.s2polarRight {
      min-width: 80px !important;
      flex: 1 0 80px;
    }
');

html('
<script>
window.addEventListener("load", function() {
    SoSciTools.ResponsiveS2Items("AM01_tab", 580, 320);
});
</script>
');

Wenn Sie es gerne noch schmaler hätten, müssten Sie die Abstände der Auswahlpunkte noch reduzieren und dann die 580 in der Zeile mit ResponsiveS2Items() ebenfalls kleiner einstellen.

Comments

danke sehr, damit ist das Problem in der horizintalen Ansicht auf dem Handy gelöst.:)