Text aufklappen und zuklappen

Hallo,

ich habe mir vor einigen Monaten dazu mal folgendes JavaScript gebastelt:

<script type="text/javascript" language="JavaScript">

function extendInfoBox( eID, eIDButton ) {
el = document.getElementById( eID );
eButton = document.getElementById(eIDButton);
newHeight = el.style.height == 'auto' ? '100px' : 'auto';
el.style.height = newHeight;
text = el.style.height == 'auto' ? 'verkleinern...' : 'Weiterlesen...';
eButton.innerHTML = text;
}

var popUpWin ;
var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1 ;
var is_opera = navigator.userAgent.toLowerCase().indexOf('opera') > -1 ;

function openPage (url) {
if (popUpWin && (is_chrome || is_opera))
{
popUpWin.close () ;
}
popUpWin = window.open(url,'popup','width=850,height=560') ;

if (window.focus) {
popUpWin.focus () ;
}
}
</script>

Verwendung folgt...

 

D.h. bei jedem Klick wird das CSS per JavaScript ausgetauscht. Hier ein Beispiel:

<div id="containerId_1" class="css_Start_Klasse">
</div>
<div id="buttonId_1" class="button_Klasse" onClick="extendInfoBox('containerId_1', 'buttonId_1');">Weiterlesen...</div>

Einfach mal ausprobieren.. Ich hoffe ich habe jetzt keine Ids vertauscht..

 

hallo

schau mal bei mir im testshop...startseite unten der text auf weiterlesen klicken.
wenn du das meinst kann ich dir die anleitung mailen.

http://test.elektro1a.de

benutzer: tester
pass: tester

 

hier meine kleine anleitung.

Folgenden Javascript-Code in templates/EyeCandy/javascript/gernerel.js.php nach dem ?> einfügen!

Code:

<script type="text/javascript">
function leuchten(das) {
 if (document.getElementById(das).style.display=='none') {
  document.getElementById(das).style.display='block';
 }
 else {
  document.getElementById(das).style.display='none';
 }
}
</script> 

Einen Text mit folgenden Werten erstellen (Muster):

Die H. Vollmer GmbH mit dem Label<strong> Heitronic&reg;</strong> wurde im Juni 1986 vom Firmeninhaber G&uuml;nter Vollmer in K&ouml;nigsbach-Stein gegr&uuml;ndet. Das Lieferspektrum umfasst Artikel f&uuml;r den Bereich <strong>Lichttechnik</strong>. Hierzu geh&ouml;ren haupts&auml;chlich Leuchtmittel, Einbaustrahler, Installationsmaterialen und weiteres Elektrozubeh&ouml;r. Das Programm wird erg&auml;nzt durch komplette Einbau-Sets f&uuml;r den Heimwerker und Dekoleuchten f&uuml;r den Innen- und Au&szlig;enbereich.*// Dieser Teil bindet das script ein //* <a title="leuchten" href="javascript:leuchten('heitronic');"><strong>weiterlesen &raquo;</strong></a>*//Ende //*
<p></p>
*// Dieser Teil bindet das script ein //* <div id="heitronic" style="display: none;">*//Ende //*Durch das dynamische Wachstum des inzwischen europaweit t&auml;tigen Unternehmens wurde der Neubau eines Verwaltungs- und Lagergeb&auml;udes im Industriegebiet K&ouml;nigsbach dringend erforderlich. Der Einzug erfolgte im Juli 2005. Mittlerweile besch&auml;ftigt Heitronic&reg; 60 engagierte Mitarbeiter, die mit umfassender Kentniss und einem prompten Lieferservice dazu beitragen, auch in Zukunft ein zuverl&auml;ssiger und leistungsstarker Lieferant von Qualit&auml;tsprodukten zu einem optimalen Preis-/ Leistungsverh&auml;ltnis zu sein.</div>

<a title="leuchten" href="javascript:leuchten('heitronic');"> in klammern "heitronic" kann für jeden conten ein anderer name frei vergeben werden.
<div id="heitronic" style="display: none;"> muss immer gleich sein wie oben. heitronic / heitronic oder was auch immer.

 

ich verstehe wieder nur bahnhof


-------------------------------------------
LG Tamay
Holzspielzeug Shop

 

Hallo Michael,
das ist GENIAL, Danke für die Anleitung.

 

auch hier http://www.homepage-total.de/css/text-verstecken-anzeigen.php zu finden und sehr einfach umzusetzen

 

Das kleine JS-Dingens muss doch "umzubauen" sein damit dies funktioniert - siehe hier...

PS: Die PHP-Version tuts es einfach nicht.