+ Antworten
Ergebnis 1 bis 5 von 5

Thema: Spoiler-Script - mehrmals untereinander!

  1. 13.01.2007 19:23 #1
    Patrick29
    Patrick29 ist offline
    Neu an Board
    Registriert seit
    29.09.2006
    Beiträge
    19
    Bedankte sich
    5
    Erhielt 0 Danksagungen
    in 0 Beiträgen

    Frage Spoiler-Script - mehrmals untereinander!

    Hi@all!

    Ich wollte gerne ein Spoiler Script auf meine Seite einbauen. Dies funktioniert auch. Aber wenn ich das Script 2 mal auf die gleiche Seite setzte (also untereinander) wird immer das obere Tab geöffnet (also das vom 1. Spoiler) Kann mir da einer weiterhelfen?

    Code:
    <a onClick="if (this.parentNode.getElementsByTagName('div')[0].style.display != '') { this.parentNode.getElementsByTagName('div')[0].style.display = '';  window.document.spoilergfx.src=' HIER KOMMT DIE GRAFIK ZUM RAUFKLICKEN ';} else { this.parentNode.getElementsByTagName('div')[0].style.display = 'none';  window.document.spoilergfx.src=' HIER KOMMT DIE GRAFIK ZUM RAUFKLICKEN '; }" style="font-weight:bold; color:#CC0000;cursor:pointer;vertical-align:middle;" alt="Vorsicht, Spoiler!!" title="Vorsicht, Spoiler!!"><img src=" HIER KOMMT DIE GRAFIK ZUM RAUFKLICKEN " name="spoilergfx" border="0" style="vertical-align:middle;">&nbsp;   HIER DIE ÜBERSCHRIFT   </a><br>

					<div id="spoiler" style="background-color:#efefef; color:#000000; width:330px; display: none; padding-left:2px; padding-right:3px;">    HIER DER TEXT FÜR DEN INHALT    </div></div>

				<br />
    Zitieren Zitieren
  2. 13.01.2007 21:36 #2
    dot°NETt
    dot°NETt ist offline
    Verbringt hier viel Zeit Avatar von dot°NETt
    Registriert seit
    07.11.2004
    Beiträge
    570
    Bedankte sich
    3
    Erhielt 216 Danksagungen
    in 187 Beiträgen

    Standard

    1. Der <div>-Container wird 2 mal geschlossen:
    <div id="spoiler" style="background-color:#efefef; color:#000000; width:330px; display: none; padding-left:2px; padding-right:3px;"> HIER DER TEXT FÜR DEN INHALT </div></div>

    2. Für den 2. Spoiler würde ich schreiben:
    Code:
    <a onClick="if (this.parentNode.getElementsByTagName('div')[1].style.display != '') { this.parentNode.getElementsByTagName('div')[1].style.display = '';  window.document.spoilergfx.src=' HIER KOMMT DIE GRAFIK ZUM RAUFKLICKEN ';} else { this.parentNode.getElementsByTagName('div')[1].style.display = 'none';  window.document.spoilergfx.src=' HIER KOMMT DIE GRAFIK ZUM RAUFKLICKEN '; }" style="font-weight:bold; color:#CC0000;cursor:pointer;vertical-align:middle;" alt="Vorsicht, Spoiler!!" title="Vorsicht, Spoiler!!"><img src=" HIER KOMMT DIE GRAFIK ZUM RAUFKLICKEN " name="spoilergfx" border="0" style="vertical-align:middle;">&nbsp;   HIER DIE ÜBERSCHRIFT   </a> <!-- ... -->
    mfG
    dot°NETt
    Zitieren Zitieren

  3. Erhielt Danksagungen von:

    Patrick29
  4. 27.03.2011 12:33 #3
    2andahalfmen
    2andahalfmen ist offline
    Neu an Board
    Registriert seit
    27.03.2011
    Beiträge
    1
    Bedankte sich
    0
    Erhielt 0 Danksagungen
    in 0 Beiträgen

    Standard

    Ich muss auf meiner HP insgesamt 12 Spiler einfügen. Wie mach ich das? Wenn ich die beiden Codes nehme funktionieren halt die ersten beiden und wenn ich für den dritten usw. den zweiten code nehme, geht wieder der zweite auf. kann mir jemand helfen?
    Geändert von 2andahalfmen (27.03.2011 um 12:39 Uhr)
    Zitieren Zitieren
  5. 27.03.2011 13:06 #4
    progandy
    progandy ist offline
    Hat hier eine Zweitwohnung Avatar von progandy
    Registriert seit
    25.06.2007
    Beiträge
    1.939
    Bedankte sich
    13
    Erhielt 640 Danksagungen
    in 577 Beiträgen

    Standard

    Da ja sowieso schon mootools geladen wird, kannst du das gleich verwenden.
    In den Head kommt das:
    Code:
    <style type="text/css">
   div.hidden {
      display: none;
   }
</style>
<script type="text/javascript">
window.addEvent('domready', function() {
$$("a.spoiler-toggle").addEvent('click', function(){
	var s = $(this).getParent.getSiblings("div.spoiler-content")[0];
	s.toggleClass("hidden");
	if (s.hasClass("hidden")) {
		$(this).set('text', 'Zeigen');
	} else {
		$(this).set('text', 'Verbergen');
	}
});
});
</script>
    Und ein Spoiler sieht so aus:
    Code:
    <div class="spoiler">
	<div class="spoiler-caption">
		<a class="spoiler-toggle" href="javascript:void(0);">Zeigen</a>
	</div>
	<div class="spoiler-content hidden">
		INHALT
	</div>
</div>
    PS: Ich habs jetzt nicht getestet
    Suche und FAQ helfen bei Problemen oft weiter!
    Zitieren Zitieren
  6. 27.03.2011 13:15 #5
    Kubik-Rubik
    Kubik-Rubik ist offline
    Wohnt hier Avatar von Kubik-Rubik
    Registriert seit
    20.10.2005
    Ort
    Kubik-Rubik.de
    Beiträge
    2.737
    Bedankte sich
    177
    Erhielt 1.059 Danksagungen
    in 793 Beiträgen

    Standard

    Wie wäre es damit? http://joomla-extensions.kubik-rubik...joomla-spoiler

    Gruß
    Joomla! Extensions by Kubik-Rubik.de
    Keine Beantwortung von Supportanfragen per PN

    Joomla! braucht Dich!
    Zitieren Zitieren
+ Antworten
« Vorheriges Thema | Nächstes Thema »

Ähnliche Themen

  1. Joomlaboard deutsche Sprachunterstützung aktivieren
    Von willi1 im Forum Joomla Komponenten
    Antworten: 26
    Letzter Beitrag: 19.02.2007, 12:37
  2. Editor geht, oder doch nur halb, oder gar nicht?
    Von Parallan im Forum Allgemeine Fragen zu Joomla
    Antworten: 14
    Letzter Beitrag: 25.06.2006, 16:51
  3. PHP Script in AJAX darstellen und als Modul Box einbinden?
    Von BadFriend im Forum Joomla Module
    Antworten: 1
    Letzter Beitrag: 26.05.2006, 09:38
  4. Backup aller Daten per Rootserver -> mein kleines script
    Von muLio im Forum Joomla Komponenten
    Antworten: 0
    Letzter Beitrag: 08.03.2006, 15:29
  5. Eigenes Java Script verwenden ?
    Von fire im Forum Allgemeine Fragen zu Mambo
    Antworten: 1
    Letzter Beitrag: 02.08.2005, 14:14

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein

Foren-Regeln