Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- de:create:popup [19.01.2016 17:51] – [Tooltip bei Berührung I] soz13hud
+++ de:create:popup [24.06.2022 10:10] – [Tooltip bei Berührung I] lamour.julia
@@ Zeile 1: / Zeile 1: @@
 ====== Informationen per Mausklick einblenden ======
-Mitunter ist es hilfreich, wenn der Teilnehmer zusätzliche Informationen((einen kurzen Text wie diesen hier)) bei Bedarf einblenden kann.
+Mitunter ist es hilfreich, wenn der Teilnehmer zusätzliche Informationen((einen kurzen Text wie diesen hier)) bei Bedarf einblenden kann. Je nach Anwendung sind dafür unterschiedliche Lösungen geeignet:
-**Tipp:** Umfangreichere Informationen können mittels ''[[:de:create:functions:textlink|textlink()]]'' auch in einem eigenen PopUp-Fenster geöffnet werden. Allerdings weiß man in diesem Fall nie, ob der Teilnehmer auch wieder zum Fragebogen zurück findet.
+  - Einzelne Wörter erklären Sie am einfachsten mit einem Tooltip (s. unten)
+  - Wenn es darum geht, Textpassagen auf einen Mausklick hin anzuzeigen, verwenden Sie die [[:de:create:accordion|Akkordeon-Funktion]].
+  - Wenn Sie einen umfangreichen Text als Zusatzinformation verfügbar machen möchten, können Sie diesen mittels ''[[:de:create:functions:textlink|textlink()]]'' in einem eigenen PopUp-Fenster öffnen.
+Darüber hinaus können Sie mittels [[:de:create:javascript|JavaScript]] nach Belieben Texte, Informationen, Items oder ganze Fragen auf einen Klick des Befragten hin einblenden. Auch können Sie im Datensatz speichern, ob eine solche Information angeklickt wurde.
@@ Zeile 14: / Zeile 18: @@
   ((Titel|Erklärung))
-Wird als Titel ein Asterisk (''*'') eingetragen, wird ein Info-Symbol angezeigt. Den in folgenden Beispielen reagiert einmal das Wort "erklärungsbedürftiges" auf die Mausberührung, und einmal ein Info-Symbol hinter dem Satz.
+Wird als Titel ein Asterisk (''*'') eingetragen, wird ein Info-Symbol angezeigt. In den folgenden Beispielen reagiert einmal das Wort "erklärungsbedürftiges" auf die Mausberührung, und einmal ein Info-Symbol hinter dem Satz.
 <code txt>
@@ Zeile 25: / Zeile 29: @@
 Das Info-Symbol und die Formatierung der Information können im Fragebogen-Layout mittels CSS-Anweisungen im HTML-Template angepasst werden. Dazu werden die CSS-Anweisungen im Bereich //Tooltip// aus dem Fragebogen-Stylesheet überschrieben.
+===== Tooltip bei Berührung II =====
+Eine weitere Lösung besteht darin, das HTML-Attribut //title// für zusätzliche Informationen zu verwenden. Hierbei wird ebenfalls eine kurze Information angezeigt, wenn der Teilnehmer mit der Maus über einem Wort verweilt -- allerdings erst nach einer kurzen Verzögerung. Das Wort selbst kann ggf. mittels ''style''-Attribut visuell hervorgehoben werden.
+<code html>
+<p>Hier ist der Text mit einem <span title="Ein Wort, dessen Bedeutung nicht direkt ersichtlich ist" style="border-bottom: 1px dotted">erklärungsbedürftigen</span> Wort.</p>
+</code>
+Wenn die Information direkt in einem Item erscheinen soll, setzen Sie das ''<span>''-Tag einfach direkt in den Itemtext an die passende Stelle.
+<code html>
+Bei Sonnenschein bin ich lieber <span title="Mit &quot;draußen&quot; ist gemeint, dass Sie sich außerhalb geschlossener Räume aufhalten" style="border-bottom: 1px dotted">draußen</span> als dass ich an Onlinebefragungen teilnehme.
+</code>
+**Hinweis:** Die Darstellung der ''title''-Information obliegt dem Browser des Teilnehmers. Sie haben keinen Einfluss darauf, wie schnell die Information angezeigt wird und in welcher Formatierung.
 ===== Information per Mausklick =====