Hallo,

Ich bin schon tagelang auf der Suche nach einer "Funktion" leider ohne erfolg.

Da es schwer ist das zu erklären was ich möchte ein kleines Bild was ich vorhabe.

Ich hoffe ihr versteht es und könnt mir helfen.

Danke

Hi,

sieht nach einem Layer (DIV-Box) aus, der mit einer höheren Schichtposition über die Seite gelegt (positioniert) wird, das wäre dann CSS.

Was sein Ein- und Ausblenden angeht, ist Javascript am Zug, um display:none in display:block, oder visibility:hidden in visibility:visible umzuwandeln.

Mit diesen Stichworten lassen sich über die Suchfunktion genügend Beispiele im Forum finden

mfg Maik

ok super ich danke dir. Mir haben eben die Stichworte gefehlt.

So nun bn ich einen Schritt weiter ABER wie bekomme ich es hin das wenn ich außerhalb der neuen ebene klicke diese wieder zu geht?

Momentan sieht mein Code so aus:

HTML-Code:

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

<a href="#" onclick="anzeigen('eins')">Ein / Aus</a>

<span id="eins" style="display: none;"> 


<div class="ro">
<div class="lo">
<div class="ru">
<div class="lu">

                              <div class="inhalt"> <?php include ("include/meinung.php"); ?> <br>
 </div>
</div>
 </div>
</div>
</div>

und die CSS :

Code :

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37

.ro {  background:url(roundedbox_ro.gif) top right no-repeat;  margin:0;  padding:0;   position: absolute;   left: 300px;   top: 250px;   z-index: 1;  }    .lo {  background:url(roundedbox_lo.gif) top left no-repeat;  margin:0;  padding:0;  }    .ru {  background:url(roundedbox_ru.gif) bottom right no-repeat;  margin:0;  padding:0;  }    .lu {  background:url(roundedbox_lu.gif) bottom left no-repeat;  margin:0;  padding:0;  }    .inhalt {  margin:0;  padding:2.5em 2.5em 3.5em 2.5em;  }    .inhalt p {  margin:0;  padding:0;  }