Bitte geben Sie einen Grund für die Verwarnung an
Der Grund erscheint unter dem Beitrag.Bei einer weiteren Verwarnung wird das Mitglied automatisch gesperrt.
Bitte um Hilfe für meine Problem mit dem Swop Ein- und Ausklapp-Text

Hallo liebes Forum,
ich bin in HTML und CSS absoluter Anfänger. Nun möchte ich gerne auf meiner allerersten Jimdo-Seite einen Ausklapp-Text als eine Art Frage+Antwort Spiel.
Der Code für so ein »Swap-Dings« hab ich im Internet gefunden. Ich konnte ihn inzwischen weitgehend an meine Vorstellungen anpassen, bis auf 2 Probleme:
Ich hätte gern die beiden „Buttons“
»zur Antwort« und »Antwort einklappen«
mittig unter der jeweiligen Frage und oberhalb der Abgrenzungslinie.
Jetzt sitzen diese »Buttons« leider am linken Ende der »Frage« und sind noch dazu 2-Zeilig :-((
Die beiden „Buttons“ (»zur Antwort« und »Antwort einklappen«) sollten sich farblich wie alle anderen Links der Seite verhalten:
Linkfarbe = rgb 255, 0, 0 und aktiv (MouseOver) = rgb 155, 0, 0.
Ich habe den ganzen Sonntag getüftelt und schaff es nicht :-((
Kann mir bitte jemand helfen?
Der Link zur Seite:
http://spielplatz3000.jimdo.com/
Liebe Grüße und vielen Dank ans Forum
Christine
PS: Wenn es sinnvoll ist, dass ich den benutzten Code rein kopiere, gebt mir bitte bescheid. Danke.


Gratulation zur gelungenen Akkordeon-Umsetzung! Dazu gibt es hier auch schon ein paar Artikel. Gib mal im Suchen-Feld "Akkordeon" ein!
Die Antwort auf Deine Frage ist wahrscheinlich folgende Codezeile:
2
3
a {color: red !important;}
LG, az
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html

Zuerst mal Danke für das Stichwort "Akkorden".
Jetzt weiß ich wenigstens wie das Aufklapp-Dingens heißt
Bin einen Schritt weiter gekommen … aber nicht dass ich jetzt wüsste was ich tu’!
War pures Try and Error Stochern. Immerhin ist die Frage von Button „Antwort“ getrennt (2-Zeilig) und die Buttons „Antwort“ und „Ausblenden“ stehen auf Mittelachse.
-> http://spielplatz3000.jimdo.com/#swap
@ az:
Das Problem der „Farbe“ konnte ich nicht lösen.
Ich möchte "nur", dass sich die beiden Buttons ("Antwort" und "Ausblenden") farblich wie alle anderen "Links" auf der Seite verhalten. Habs versucht, aber leider keinen blassen Schimmer wo ich die Codezeile
a {color: red !important;}
einfügen soll, bzw ob das die richtige ist.
Ich stell' jetzt einfach mal den Code hier rein. Vielleicht kannst Du mir ja weiterhelfen – so dass ich es auch kapier … ?
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<hr />
<h3> Warum ist die Banane krumm? </h3>
<script type="text/javascript">
//<![CDATA[
function swap(openlink,closelink, linkid, dataid)
{
if( document.getElementById(dataid).style.display == 'none')
{
document.getElementById(dataid).style.display='inline';
document.getElementById(linkid).firstChild.nodeValue=closelink;
} else
{
document.getElementById(dataid).style.display='none';
document.getElementById(linkid).firstChild.nodeValue=openlink;
}
}
//]]>
</script>
<table class="tab24" align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
<tr bgcolor="#FFFFFF">
<td align="center" width="34%" style="padding-left:0px; padding-right:0px;">
<a href="#swap" onclick="javascript:swap('Antwort','Ausblenden', 'swaplink1', 'hideme1')" id="swaplink1" onfocus="this.blur()" name="swaplink1">Antwort</a>
</td>
</tr>
<tr style=" text-align: left; font-size: 16px; font-weight: normal; background-color:">
<td colspan="3" style="padding-left:0px; padding-right:0px;">
<div id="hideme1" style="display:none">
<br />
<div align="left">
</div>
<p>
Hier steht die Antwort auf die jeweiliege Frage.
</p>
</div>
</td>
</tr>
</table>
<hr />
L.G. Christine

...das sieht doch schon sehr gut aus!
die Code-Zeile setzt Du einfach unter Einstellungen > Head bearbeiten in den Editor ein. Näheres hier: http://www.redesign-berlin.de/jimdo-tutorials/css-formatierungen/
der komplette Code mit grauem Hover-Verhalten wäre dann dieser hier:
2
3
4
5
<style>
a {color: red !important;}
a:hover {color:grey !important;}
</style>
LG, az
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html

- Allgemeines
- Regeln für die Benutzung des Forums
- HowToDo ( = so geht´s)
- Jimdo User-Forum
- Eure Jimdo-Webseiten - Vorstellungsrunde
- Bugs, Workarounds und Anregungen
- Jimdo-Elemente
- Allgemeines
- Jimdo-Shop
- Jimdo-Specials (Tools, Widgets, HTML und CSS)
- Suchmaschinenoptimierung (SEO)
- Sonstiges
- Tutorials
- "OffTopic"-Themen
- "Übernahme" von Beiträgen aus dem offiziellen Jimdo-Forum...
- Nutzungsbedingungen und Haftungsausschluss
- Jimdo-Blog
Ähnliche Themen
Jetzt anmelden!
Jetzt registrieren!