"Erweiterungs-" Script...?

C

Chip

Grünschnabel
Schönen guten Morgen alle zusammen!

Ich suche schon seit längerem ein ganz besonderes Script für meine Homepage...

Wisst ihr, ob es irgendwo solch ein (Java - ) Script gibt, das man auf seiner HP einbaut und mit dem man dann einen Link anklicken kann, es sich aber kein POPUP öffnet, sondern die Seite sich "erweitert"...

Ich meine, d.h., man klickt auf den Link oder so und es wird einfach ein Teil auf der Seite eingeblendet... Sonst ist er aus

Solch eine Funktion gibt es beispielsweise auch in Word.
Wenn man über "F1" die Hilfe aufruft und z.B. Tabelle eingibt und dann von den Vorschlägen "Tabelle kopieren" geht, steht dann in der Erklärung unter dem ersten Punkt das blau - unterlegte Wort "Seitenlayoutansicht".
Wenn man dieses Wort anklickt, dann erscheint in Klammer ein eingeblendeter grüner Text....

Gibt es solch ein Script und geht sowas, wie es in WORD möglich ist?!

Ich bin für jeden Tipp und jede Antwort schon im Voraus dankbar

Chip
 
Du kööntest Dir solche Bereiche durch die "Eigenschaft" :

· display: none/block
· visibility: hidden/show

schaffen. Suche "oder" googel dazu mal, wenn Du dann weitere Hilfe brauchst, dan kanst DU gerne wieder fragen!
 
· display: none/block
· visibility: hidden/show

Was sind denn das für Bereiche?
Wie kann man die einbauen?!
Und wo finde ich ein ganzes Script dafür?!

Ich bin nämlich totaler Newbie und hab keine besondere Ahnung von der Programmierung mit Java...

Wäre für ne Erklärung sehr dankbar!

Chip
 
Hier mal ein kleine Beispiel, gucke es Dir an und mach was draus :) und ich rate Dir bei SelfHTML vorbeizuschauen, da bekommst DU noch mehr Hilfe!

Beispiel:

Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<script type="text/javascript" language="JavaScript1.2">
function versteckt(status)
{
document.getElementById('ghost').style.display = status
}
</script>
	<title>Untitled</title>
</head>

<body>
<table cellspacing="2" cellpadding="2" border="0">
<tr>
    <td>
	Dieser Bereich ist sichtbar (immer).
	<br><br>Und <a href="#" onclick="versteckt('block')"> hier</a> blenden wir "versteckten" einen Bereich ein!
	</td>
	<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td style="display : none" id="ghost">Dieser Bereich kann ein-/ausgeblendet werden! <a href="#" onclick="versteckt('none')">AUSCHALTEN!</a></td>
</tr>
</table>



</body>
</html>
 
@ Thomas Lindner:

Ok, vielen Dank für das Script...
Das war es, was ich gesucht hatte.....

Aber:
Mein Problem nun ist, dass ich zwei Tabellen einbauen möchte, die unabhängig von einander "funktionieren" sollen....

Leider klappt das nicht ganz, denn nur die erste Tabelle, die ich eingegeben habe, wird auch beim 2. angezeigt....

Ich setze mal mein "Ergebnis" hier rein, also mein Script...:

Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<script type="text/javascript" language="JavaScript1.2">
function versteckt(status)
{
document.getElementById('ghost').style.display = status
}
</script>
	<title>Untitled</title>
</head>

<body>
Dieser Bereich ist sichtbar (immer).
	<br><br>Und <a href="#" onclick="versteckt('block')"> hier</a> blenden wir "versteckten" einen Bereich ein!

	So, hier ist dann die 1. Tabelle....

 <a href="#" onclick="versteckt('none')">Abschalten!</a> 
</table>



<script type="text/javascript" language="JavaScript1.2">
function versteckt(status)
{
document.getElementById('ghost').style.display = status
}
</script>

Und <a href="#" onclick="versteckt('block')"> hier</a> blenden wir "versteckten" einen Bereich ein!
<table cellspacing="2" cellpadding="2" border="0">
  <tr> 
    <td style="display : none" id="ghost" height="172"> 

	So, hier ist dann die 2. Tabelle....

	<a href="#" onclick="versteckt('none')">Abschalten!</a> 
</table>
</body>
</html>

Ich entdeckte grad den Fehler, muss wohl am Verlinken mit "#" liegen, oder?!
Aber wie kann ich das ändern.....?!

MfG und danke im Voraus,
Chip
 
Hallo,

ich vermute mal das Problem liegt hier:
Code: 
document.getElementById('ghost').style.display = status
Eine Id - hier ghost - darf im ganzen Dokument nur einmal vorkommen. Da die ID hier "fest" ist, wird es nur das erste Element mit der jeweiligen Id aus/einblenden. Wenn das Script leicht erweitert wird, sollte es aber dann kein problem mehr darstellen:

Code: 
<html>
<head>
<script type="text/javascript" language="JavaScript1.2">
function versteckt(element, status)
{
    document.getElementById(element).style.display = status
}
</script>
</head>
<body>
<table cellspacing="2" cellpadding="2" border="0">
<tr>
    <td> Dieser Bereich ist sichtbar (immer).	<br>
      Und <a href="#" onclick="versteckt('ghost','block')"> hier</a> blenden wir "versteckten" einen Bereich ein,<br>
      Und <a href="#" onclick="versteckt('trallala','block')"> hier</a> den anderen!
	</td>
    <td style="display : none" id="ghost">Dieser Bereich kann ein-/ausgeblendet werden! <a href="#" onclick="versteckt('ghost','none')">AUSCHALTEN</a></td>
    <td style="display : none; background-color:#dedede" id="trallala">Dieser Bereich kann ein-/ausgeblendet werden! <a href="#" onclick="versteckt('trallala','none')">AUSCHALTEN</a></td>
</tr>
</table>
</body>
</html>
Wir übergeben also beim Aufruf der Funktion "versteckt()" noch die betreffende ID, damit der Context wieder stimmt... Du darfst nur nicht vergessen, das die ID einzigartig sein MUSS

bye
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück