Ein/Ausbenden

[Christian_N]

Hallo,
wer kennt sich mit JS den etwas aus?
Ich wollte eigentlich es haben das wenn ich auf "Anzeigen!" klicken z.B. er mir dann von "display : none" was default mäßig also ausgeblendet wird angezeigt wird und des Wort "Anzeigen! sich in "Verbergen!" umwandeln tun.
So wie bei www.spielmit.com es der Fall ist, muss man leider aber auch eingeloggt sein dort um es zu sehen was ich meine.

Habe schon im Quelltext etc. geschaut und auch schon soweit hinbekommen das er wenn ich auf "Anzeigen! klicke er mir den Block anzeigt aber er wandelt den Text nicht in "Verbergen!" um und der Cookie wird auch nicht wie dort gespeichert so das nach erneuten Aufruf der Block angezeigt bleibt. (Cookiegültigkeit ist dort auf 365Tage gestellt, bevor der Block autom. wieder ins Default geht, oder durch erneuten klicken wird dort der Cookie gelöscht)

Hatte auch das hat wenigste funktioniert es so wie hier mit beim Posting Formular mit die Option geregelt gehabt. Aber da hab ich auch nicht rausgefunden wie man statt die Grafik Text benutzen kann statt "Grüner Pfeil nach unten für Anzeigen" sollte als Text dann "Anzeigen" stehn oder bei dem "Rote Pfeil nach oben für Verbergen" sollte als Text "Verbergen" stehn, wenn jemand etwas mehr Ahnung von JS wäre gut wenn man ggf. diese Script umschreibt, den das mit die Cookies muss nicht unbedingt sein, hätte nur gern es mit den Text.

Gruß Chris

[oxpus]

Ich habe das mit den Pfeilen hier auf dem Topic Calender entnommen.
Dieser leifert eine "toggle.js" mit, die Funktionen für den Aufruf mitliefert und gleichzeitig Änderungen an den benannten Elementen wie auch der Grafikänderung durchführt.
Ist recht einfach zu verwenden, kannst dazu auch gerne bei mit den Quelltext anschauen, was wie gemacht wird.
Und auch Texte für Button oder Links sind damit änderbar.
Wäre nur wenige Erweiterungen in den JS-Scripten...

[Christian_N]

Also wie bereits erwähnt, habe ich bzw. hatte ich es Haar genau so wie du hier.
Aber will es ja auch bei der Funktion auch nicht so kopiert aussehen haben und wollt es daher wie beschrieben haben das "Anzeigen" und "Verbergen" steht statt die 2 verschiedenen Grafiken.

Nur kenne mich in JS leider überhaupt nicht aus und weiss echt nicht wie ich es anpassen könnte jetzt deshalb.

Gruß Chris

[oxpus]

Dann poste doch mal den Code für die Button und häng Deine toggle_display.js an.

[Christian_N]

Ist zwar der selbe wie du ihn hier für die Optionen benutzen tust, aber hier ist der dann mal
Hoffe habe nichts vergessen

Code: Alles auswählen

	<tr>
		<td colspan="2" class="row3"><img src="templates/subSilver/images/bot.gif" id="post_options_open_close" border="0" alt="" title="" />&nbsp;<input type="button" class="liteoption" value="{L_OPTIONS}" onclick="hdr_toggle('post_options','post_options_open_close', 'templates/subSilver/images/bot.gif', 'templates/subSilver/images/top.gif'); return false;" />&nbsp;<span class="gensmall">[ {HTML_STATUS} | {BBCODE_STATUS} | {SMILIES_STATUS} ]</span></td>
	</tr>
<tbody id="post_options" style="display:none">
	<tr> 
	  <td class="row2" colspan="2">
		<table cellspacing="0" cellpadding="1" border="0">
		  <!-- BEGIN switch_html_checkbox -->
		  <tr> 
			<td> 
			  <input type="checkbox" name="disable_html" {S_HTML_CHECKED} />
			</td>
			<td><span class="gen">{L_DISABLE_HTML}</span></td>
		  </tr>
		  <!-- END switch_html_checkbox -->
		  <!-- BEGIN switch_bbcode_checkbox -->
		  <tr> 
			<td> 
			  <input type="checkbox" name="disable_bbcode" {S_BBCODE_CHECKED} />
			</td>
			<td><span class="gen">{L_DISABLE_BBCODE}</span></td>
		  </tr>
		  <!-- END switch_bbcode_checkbox -->
		  <!-- BEGIN switch_smilies_checkbox -->
		  <tr> 
			<td> 
			  <input type="checkbox" name="disable_smilies" {S_SMILIES_CHECKED} />
			</td>
			<td><span class="gen">{L_DISABLE_SMILIES}</span></td>
		  </tr>
		  <!-- END switch_smilies_checkbox -->
		  <!-- BEGIN switch_delete_checkbox -->
		  <tr> 
			<td> 
			  <input type="checkbox" name="delete" />
			</td>
			<td><span class="gen">{L_DELETE_POST}</span></td>
		  </tr>
		  <!-- END switch_delete_checkbox -->
		</table>
	  </td>
	</tr>
</tbody>

und dann noch die toggle_display.js im Anhang.

Schon mal Danke.

Gruß Chris

[oxpus]

Also:
Die Zeile

Code: Alles auswählen

		<td colspan="2" class="row3"><img src="templates/subSilver/images/bot.gif" id="post_options_open_close" border="0" alt="" title="" />&nbsp;<input type="button" class="liteoption" value="{L_OPTIONS}" onclick="hdr_toggle('post_options','post_options_open_close', 'templates/subSilver/images/bot.gif', 'templates/subSilver/images/top.gif'); return false;" />&nbsp;<span class="gensmall">[ {HTML_STATUS} | {BBCODE_STATUS} | {SMILIES_STATUS} ]</span></td>

sollte zunächst durch

Code: Alles auswählen

		<td colspan="2" class="row3"><img src="templates/subSilver/images/bot.gif" id="post_options_open_close" border="0" alt="" title="" />&nbsp;<input type="button" class="liteoption" value="{L_OPTIONS}" id="opt_button" onclick="hdr_toggle('post_options','post_options_open_close', 'templates/subSilver/images/bot.gif', 'templates/subSilver/images/top.gif', '{L_OPTIONS}', 'Verstecken', 'opt_button'); return false;" />&nbsp;<span class="gensmall">[ {HTML_STATUS} | {BBCODE_STATUS} | {SMILIES_STATUS} ]</span></td>

ersetzt werden.
Dann in der toggle_display.js die Funktion

Code: Alles auswählen

function hdr_toggle(object, open_close, open_icon, close_icon)
{
	var object = hdr_ref(object);
	var icone = hdr_ref(open_close);

	if( !object.style )
	{
		return false;
	}

	if( object.style.display == 'none' )
	{
		object.style.display = '';
		icone.src = close_icon;
	}
	else
	{
		object.style.display = 'none';
		icone.src = open_icon;
	}
}

ersetzen durch

Code: Alles auswählen

function hdr_toggle(object, open_close, open_icon, close_icon, open_txt = '', close_txt = '', button = '')
{
	var object = hdr_ref(object);
	var icone = hdr_ref(open_close);
	if ( button )
	{
	   var opt_button = hdr_ref(button);
    }

	if( !object.style )
	{
		return false;
	}

	if( object.style.display == 'none' )
	{
		object.style.display = '';
		icone.src = close_icon;
		if ( button )
		{
		   opt_button.value = close_txt;
        }
	}
	else
	{
		object.style.display = 'none';
		icone.src = open_icon;
		if ( button )
		{
		   opt_button.value = open_txt;
        }
	}
}

und der Änderung des Button Namens sollte nichts im Wege stehen...

[Christian_N]

Danke habe ich gemacht, jetzt wenn ich auf den Button klicke wird der <tbody>-Teil nicht angezeigt mehr, ausserdem steht da nach wie vor auch nur "Optionen" statt "Anzeigen" bzw. "Optionen anzeigen". Muss die ID im dem <tbody>-Tag geändert werden? Die lautet momentan id="post_options"

Gruß Chris

[oxpus]

Nein, eigentlich sollte da alles weiter funktionieren, wie gehabt.
Ich werde das mal bei mir probieren.
Logisch gesehen ist hier kein Fehler drinnen...

[Christian_N]

Ok danke, werde auch es gleich nochmal zurück wie vorher es war machen, ob es überhaupt ging oder ich ggf. vielleicht was heute mittag kurz vor 14Uhr vergessen haben an Code zu posten, oder es liegt wohl wieder wie es bei mir schon mal war das er die JS Datei nicht einlesen tut und somit kann die Funktion auch dann nicht ausgeführt werden logischerweise, melde mich ggf. jedenfalls wenn es mit dem alten Code geht und man ausschließen kann das ich was vergessen haben bzw. die JS Datei nicht eingelesen wird.

EDIT: Also habe nochmal alles wie es vorher war eingebaut, da ging es, also habe ich kein Codeteil vergessen zu Posten und auch die JS Datei wird geladen, kann man schon mal diese Fehler ausschließen.
Dann bin ich mal gespannt wie des Ergebnis bei dir aussieht.

Gruß Chris

[oxpus]

Eigentlich hätte ich es wissen müssen, daß Javascript Funktionsparameter immer etwas anders behandelt, als PHP.
Die Lösung ist auch recht einfach:
Ersetze in der toggle_display.js die Zeile

Code: Alles auswählen

function hdr_toggle(object, open_close, open_icon, close_icon, open_txt = '', close_txt = '', button = '')

einfach durch

Code: Alles auswählen

function hdr_toggle(object, open_close, open_icon, close_icon, open_txt, close_txt, button)

und leere den Browser Cache.
Dann funktioniert das Script wieder und der Button wird auch umbenannt.

Testen kannst Du das hier im Posting-Formular mit den Optionen.
Ist der Block geöffnet, wechselt der Button den Text in "Optionen Verstecken"...

[Christian_N]

Ok danke funktioniert hier, werde es dann mal ausprobieren, hoffe das ich den rest dann noch hinbekomme, den hätte Default "Optionen anzeigen" und ggf. die Grafik weg.
Melde mich dann ggf. nochmal.
Danke viel mals schon bis hierher

EDIT Funktioniert bestens und das mit dem Grafik entfernen war nun auch nun ein Kinderspiel.

Tausend dank für die Anpassung, den hätte nicht gedacht das es mit ein paar Zeilen getan wär

Eigentlich hätte ich es wissen müssen, daß Javascript Funktionsparameter immer etwas anders behandelt, als PHP.

Verstehe ich es richtig das JS ziemlich gleich wie PHP arbeitet mit nur ein paar Ausnahmen?
Also wäre des script in PHP gewesen hätte ich die paar Zeilen womöglich auch selbst hinzufügen können, aber bei JS hab ich mich nicht so ran getaut *g*

Gruß Chris

[oxpus]

Jein.
Javascript verwendet z. B. nur Variablennamen, PHP braucht hier ein $ davor, um diese von Funktionen und anderen Befehlen zu unterscheiden.
Auch kann man in Funktionsdefinitionen, also der Parameterzeile, keine Default-Werte vorgeben, wie das mit PHP geht.

Und vieles mehr.
Aber beide Sprachen sind dennoch sehr ähnlich, man muss also nicht soooo viel umlernen...

[Christian_N]

Danke für die Info, dann lohnt es sich einfach wenn man PHP lernen tun, da dann man fast schon mit JS umgehen kann dann einfach nur etwas umlernen (umdenken) und es sollte klappen.

Ehrlich gesagt die Grafik aus dem Script zu nehmen und damit statt Optionen dann auch noch Anzeigen steht, war ja leicht gewesen.

Gruß Chris

[oxpus]

Naja, Javascript basiert aber auf den Elementen einer Webseite und da muss man den Quelltext schon verstehen und die Ebenen kennen, bevor man irgendwelche Aktionen darauf loslässt.
Klar kann Javascript auch einfach nur etwas auslösen, aber gedacht ist es, um Inhalte einer Webseite zu manipulieren und das, nachdem die Webseite eben erstellt und angezeigt wird.

Hier bekommen dann die meisten einen Knoten ...

[HammerBe]

Chris ich habe dar eine mod gefunden vileicht ist das was du suchst.

##############################################################
## MOD Title: Follow me Forum Side navigation Bar using Javascript
## MOD Author: ShadowKnyght < forum@cyber-mag.com > (James B) http://forum.cyber-mag.com
## MOD Description: Allows you to quickly navigate to any chosen location on your site
## MOD Version: 1.2.0

Meine english reicht dar für nicht

[Christian_N]

Danke, hat sich doch aber schon längst erledigt mit die Anpassung von Oxpus und ne Teil Anpassung von mir, so das es jetzt nun so ist wie ich es haben wollt

Gruß Chris