Auf Thema antworten 2026

Beitrag

<blockquote data-quote="enjoyHB" data-source="post: 2616445">Hallo liebe Community,ich komme bei einem, für viele von euch sehr einfachen, Problem nicht weiter.Ich möchte ein simples onclick event schalten bei dem sich ein Text ausklappt. Ein klassischer &quot;read more&quot; button also <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" class="smilie smilie--sprite smilie--sprite1" alt=":)" title="Smile&nbsp; &nbsp; :)" loading="lazy" data-shortname=":)" /> Der Text der ausklappt soll durch einen transition Effekt &quot;aufklappen&quot;.Mein Lösungsansatz:[code]&lt;p id=&quot;more-open&quot; style=&quot;display:none; transition:display 2s&quot;&gt;Viel Text.&lt;/p&gt;&lt;p onclick=&quot;document.getElementById(&#039;more-open&#039;).style.display=&#039;block&#039;&quot;&gt;Mehr lesen&lt;/p&gt;[/code]Das Anzeigen funktioniert so ohne Probleme. Der transition Befehl ist nur das Problem. Ich habe gelesen das transition nicht mit display funktioniert - sehr schade, warum eigentlich nicht?Deshalb bin ich zu dem folgenden alternativen Lösungsweg gekommen:[code]&lt;p id=&quot;more-open&quot; style=&quot;opacity:0; transition:opacity 2s&quot;&gt;Viel Text.&lt;/p&gt;&lt;p onclick=&quot;document.getElementById(&#039;more-open&#039;).style.opacity=&#039;1&#039;&quot;&gt;Mehr lesen&lt;/p&gt;[/code]Funktioniert! Aber das Problem wird euch schon aufgefallen sein. Der Text &quot;Viel Text&quot; nimmt jetzt schon Platz ein, obwohl dieser eben wie bei der display:none Eigenschaft nicht berücksichtigt werden soll, solange dieser nicht sichtbar ist.&nbsp; &quot;Visibility:hidden&quot; zu benutzen ist auch keine Alternative - gleiches Problem wie bei &quot;opacity&quot;.Wie könnte ich dieses Problem noch lösen? Angemerkt ich lerne derzeit noch Javascript und bin &quot;Anfänger&quot; - gebe aber mein bestes <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" class="smilie smilie--sprite smilie--sprite1" alt=":)" title="Smile&nbsp; &nbsp; :)" loading="lazy" data-shortname=":)" />.Ich hoffe ich konnte das Problem gut beschreiben, ich werde gerne auf Nachfragen eingehen und das Problem genauer beschreiben, falls nötig.Danke,LG</blockquote>

[QUOTE="enjoyHB, post: 2616445"] Hallo liebe Community, ich komme bei einem, für viele von euch sehr einfachen, Problem nicht weiter. Ich möchte ein simples onclick event schalten bei dem sich ein Text ausklappt. Ein klassischer "read more" button also :) Der Text der ausklappt soll durch einen transition Effekt "aufklappen". [U]Mein Lösungsansatz:[/U] [code]Viel Text. Mehr lesen[/code] Das Anzeigen funktioniert so ohne Probleme. Der transition Befehl ist nur das Problem. Ich habe gelesen das transition nicht mit display funktioniert - sehr schade, warum eigentlich nicht? [U]Deshalb bin ich zu dem folgenden alternativen Lösungsweg gekommen:[/U] [code]Viel Text. Mehr lesen[/code] Funktioniert! Aber das Problem wird euch schon aufgefallen sein. Der Text "Viel Text" nimmt jetzt schon Platz ein, obwohl dieser eben wie bei der display:none Eigenschaft nicht berücksichtigt werden soll, solange dieser nicht sichtbar ist. "Visibility:hidden" zu benutzen ist auch keine Alternative - gleiches Problem wie bei "opacity". Wie könnte ich dieses Problem noch lösen? Angemerkt ich lerne derzeit noch Javascript und bin "Anfänger" - gebe aber mein bestes :). Ich hoffe ich konnte das Problem gut beschreiben, ich werde gerne auf Nachfragen eingehen und das Problem genauer beschreiben, falls nötig. Danke, LG [/QUOTE]

Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.

Authentifizierung

Wenn ▲ = 5, ▼ = 2 und ■ = 7, was ist ▲ × ▼ + ■?