klapptext *gg*

W

Wanted

Grünschnabel
Ich ahbe zwar schon einen hier gefunden, nur wollt ich fragen, wie ich da den "klapp text" eingeben kann und jewels zum aufglappen nen "+" bekomme und zum zuklappen ein "-" =)

Ich weiss das das Thema "klapptext" hier schon oft war, nur hab ich für dieses Problem keine Lösung gefunden *schnief* Über Hilfe wäre ich dankbar !

Code: 
<html>
<script type="text/javascript" language="JavaScript1.2">
var angezeigt = false;

function versteckt() 
{ 
	if (angezeigt)
	{
		document.getElementById('ghost').style.display = 'none';
		angezeigt = false;
	}
	else
	{
		document.getElementById('ghost').style.display = 'block';
		angezeigt = true;
	}
} 
</script> 
<body>
<table cellspacing="2" cellpadding="2" border="0"> 
<tr> 
    <td> 
     Dieser Bereich ist sichtbar (immer). 
    <br><br>Und <a href="#" onclick="versteckt()"> hier</a> blenden wir einen "versteckten" Bereich ein und aus! 
    </td> 
</tr> 
<tr> 
    <td style="display : none" id="ghost">Dieser Bereich kann ein-/ausgeblendet werden!</td> 
</tr> 
</table>
</body></html>

Greetz me =)
 
Meinst du sowas in der Art, oder wo soll dein "+" hin?
HTML: 
<html>
 <script type="text/javascript" language="JavaScript1.2">
 var displayed = false;
 
 function swap(linkid,linkcaption,targetid){
 	if (displayed) {
 		document.getElementById(linkid).innerHTML = "+" + linkcaption;
 		document.getElementById(targetid).style.display = 'none';
 		displayed = false;
 	}
 	else {
 		document.getElementById(linkid).innerHTML = "- " + linkcaption;
 		document.getElementById(targetid).style.display = 'block';
 		displayed = true;
 	}
 }
 </script>
 <body>
 <table cellspacing="2" cellpadding="2" border="0">
 <tr>
 	<td>
 	 Dieser Bereich ist sichtbar (immer).
 	<br><br>Und <a id="link" href="#" onclick="swap('link','hier','ghost')">+ hier</a> blenden wir einen "versteckten" Bereich ein und aus!
 	</td>
 </tr>
 <tr>
 	<td style="display : none" id="ghost">Dieser Bereich kann ein-/ausgeblendet werden!</td>
 </tr>
 </table>
 </body></html>
 
ja so in etwa nur die Zeichen als Bilder.

z.B.
collapse.gif

expand.gif


Und wie kann ich da den text des klapptmechanismuss eingeb ? Brauch den klapptext für phpkit News. =)) Falls da schon jemand nen tipp hat, bin ich gern mit nem offenen ohr da
 
Zuletzt bearbeitet:
Oh mann, such doch einfach mal nach den Text im script und schau, was passiert wenn du ihn erstzt. Ein bisschen selber denken schadet nicht. Sorry muss jetzt weg, wenn ich heute Nacht nochmal Zeitfinde schreib ich dir das mit den Images auch noch oder du denkst mal selber... http://de.selfhtml.org/
 
Zuletzt bearbeitet:
Kann mir wer sagen wie ich das hier einbauen muss? Nehmet einfach irgendeinen text also Platzhalter der dann unten aufpopt, ich checke das nämlich nicht so ganz. Am besten mit diesen + und - Bildern, wie macht man denn das die sich dann auch ändern?


HTML: 
                  <div class="news"> 
                    <p style="margin-top: 0pt; margin-bottom: 0pt;"><span class="newsheadline">Minstrantenplan</span> 
                      <span class="typo_date">&raquo; 20 November 2004</span> 
                    </p>
                    <p class="typo_fliesstext01" style="margin-top: 0pt;">Ab jetzt 
                      werden wir euch auf dieser Seite immer den neuersten Ministrantenplan 
                      zum download anbieten. Ihr findett ihn im Ministranten-Bereich. 
                      &Uuml;ber Updates k&ouml;nnt ihr euch immer auf der Neuigkeitenseite 
                      bei &quot;Last Update&quot; (oben rechts) informieren</p>                    
                </div>          
				<div class="newsbalken"></div>
 
Zuletzt bearbeitet:
War es in etwas das, was du suchst?
HTML: 
<html><head>
     
     <script type="text/javascript"><!--
     	function swap(id) {
     		NewsObj = document.getElementById("News" + id);
     		ImgObj = document.getElementById("NewsImg" + id);
     		if (NewsObj.style.display == "none") {
     			ImgObj.src = "[URL ZUM MINUSBILD]";
     			ImgObj.setAttribute("alt", "weniger", "false");
     			NewsObj.style.display = "block";
     		} else {
     			ImgObj.src = "[URL ZUM PLUSBILD]";
     			ImgObj.setAttribute("alt", "mehr", "false");
     			NewsObj.style.display = "none";
     		}
     	}
     //--></script>
     
     </head><body>
     
     	<div>
 		<p><a href="#" onClick="swap('1')"><img id="NewsImg1" src="[URL ZUM PLUSBILD]" border="0"></a>Minstrantenplan &raquo; 20 November 2004
     		</p>
 		<p id="News1" class="typo_fliesstext01" style="display:none; margin-top:0pt;">
 			Ab jetzt werden wir euch auf dieser Seite immer den neuersten Ministrantenplan zum download anbieten. Ihr findett ihn im Ministranten-Bereich. &Uuml;ber Updates k&ouml;nnt ihr euch immer auf der Neuigkeitenseite bei &quot;Last Update&quot; (oben rechts) informieren
     	    </p>			    
     	</div>
     	<div>
 		<p><a href="#" onClick="swap('2')"><img id="NewsImg2" src="plus.gif" border="0"></a>Vielleicht Minstrantenplan hier &raquo; 10 November 2004
     		</p>
     		<p id="News2" style="display:none;">
 			Wir denken darüber nach euch den neusten Minstratenplan zum Download anzubieten.
     	    </p>			    
     	</div>
     	
     </body></html>
Vergiss nicht das [URL ZUM PLUSBILD] bzw. [URL ZUM MINUSBILD] durch die richtigen URLs zu ersetzten und jeder einzelnen news eine eigene id zu geben (hier "News1") und jedem einzelnen Bildauch (hier "NewsImg1") und auch im onclick einzutragen.
 
Zuletzt bearbeitet:
Ich weiss, alte Threads werden "hier oben" nicht gerne gesehen, aber ich wollte mich einfach mal kurz bei con-f-use bedanken, das hat der Fragesteller wohl vergessen.

Also Danke, war genau das was ich gesucht habe :)
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück