PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : Content bei <div> ändern


Gast
2004-05-30, 22:08:51
Hallo!

Ich habe meine erste vernünftige Seite CSS fertig bekommen. Das Ganze gefällt mir sehr gut, nachdem ich das Prinzip verstanden habe. Ich habe jetzt nur noch ein letztes Problem. Und zwar auf meiner Seite einen Layer mit
<div id="content">
blabla
</div>

gemacht. Wie kann ich jetzt, wenn ich im linken Navigationsmenü einen Punkt anklicke(bsp. "News") diesen content ändern? ich stelle mir das so vor, das ich eine Text-datei namens news.txt habe und der Browser dann die Seite neulädt mit dem geänderten content.

Ich hoffe Ihr versteht was ich will und das ist überhaupt möglich.

Vielen Dank für Eure Hilfe!

Gruß,
Gast

-=sUn's*shAdoW=-
2004-05-30, 22:15:39
hm... ich denke, das was du willst ist nur mit irgendeiner Form des dynamischen htmls möglich. Ich würde dazu php verwenden, das relativ einfach ist, aber auch durchaus komplex werden kann ;)

ansonsten ist mir eigentlich keine Methode dazu bekannt ( außer Frames O.O )

cu

Aqualon
2004-05-30, 23:08:07
Das geht auch ohne PHP, wenn man Javascript einsetzt. Du musst dazu für jeden Inhalt einen eigenen div-Layer definieren:

<div id="inhalt1">Inhalt</div>
<div id="inhalt2">Inhalt</div>
...

Diese kannst du in CSS standardmäßig auf visibility:hidden setzen, damit sie alle unsichtbar sind. Nur den div-Layer, der beim ersten Aufruf zu sehen sein soll, musst du auf visibility:visible setzen.

In der Navigation kannst du dann mit Javascript den jeweils gewünschten div-Layer auf visibility="visible" schalten und die restlichen auf visibility="false":

/* Layer einblenden */
function fix(element)
{
unfixfb();
document.getElementById(element).style.visibility = "visible";
}

/* Layer ausblenden */
function unfixfb()
{for(i=1;i<6;i++)
{element_unfix='inhalt'+i;
document.getElementById(element_unfix).style.visibility = "hidden";
}
}

Dieses Skript rufst du dann in deiner Navigation auf.

<a href="javascript:fix('inhalt1');">Navipunkt1</a>
<a href="javascript:fix('inhalt2');">Navipunkt2</a>
...

Damit werden zuerst alle Inhalts-Layer auf unsichtbar gesetzt und dann der gewünschte auf sichtbar (i<6 bedeutet, dass es 5 Inhalts-Layer gibt, dieser Wert muss natürlich entsprechend angepasst werden).

Kleiner Nachteil an dem ganzen ist, dass alle div-Layer beim ersten Aufruf der Seite geladen werden müssen. Großer Vorteil ist, dass beim umschalten keine Ladezeit anfällt und die Seite deswegen sehr flott rüberkommt.

Aqua

Gast
2004-05-30, 23:41:21
Das ist zwar ein guter Tipp, aber bei meiner Seite fallen schon größere Mengen an Daten an, deswegen suche ich halt eine Möglichkeit externe Textdateien in die aktuelle Seite einzubinden.

Hier ist das Problem was ich habe:


<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="de" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Workshop - Drei Spalten</title>
<!-- <link rel="stylesheet" type="text/css" href="../css/mager.css"> -->
<style type="text/css">
<!--
@import url("workshop.css");
@import url("dreispalten.css");
-->
</style>
</head>
<body>

<div id="header">
<h1>Griechische Mythologie</h1>
</div>

<div id="linkespalte">
<div id="schalter1">
<p>
<a href="../test3.html">Troja</a> <span class="nix">|</span>
<a href="../test3.html">Atlantis</a> <span class="nix">|</span>
<a href="../test3.html">Sparta</a> <span class="nix">|</span>

<a href="../test3.html">Rom</a> <span class="nix">|</span>
<a href="../test3.html">Archilles</a> <span class="nix">|</span>
<a href="../test3.html">Hektor</a> <span class="nix">|</span>
<a href="../test3.html">Paris</a>
</p>
</div>

</div>

<div id="rechtespalte">
<!-- Teaserblock -->
<div id="t-box">
<h4>Mitteilungen</h4>

<div class="teaser">
<div class="t-head">
<strong>Troja</strong>

</div>
<div class="t-txt">
Was passierte w&auml;hrend des 10-j&auml;hrigen trojanischen Krieges?
</div>
</div>

<div class="teaser">
<div class="t-head">
<strong>Atlantis</strong>

</div>
<div class="t-txt">
Gab es diesen sagenumwobenen Kontinent wirklich?
</div>
</div>

<div class="teaser">
<div class="t-head">
<strong>Umfrage</strong>

</div>
<div class="t-txt">
Troja: Soll eine neue Dokumentation im ZDF laufen?
</div>
</div>

<div class="teaser">
<div class="t-head">
<strong>Neue Mitglieder</strong>

</div>
<div class="t-txt">
Dr. T ist als neues Mitglied unserem Verein beigetreten
</div>
</div>

</div>
<!-- End Teaserblock -->
</div>


<div id="content">

<h1>Troja</h1>


<?PHP
echo "ffffffffffffffffff";
?>

<p><a href="#main">Seitenanfang</a></p>

</div>


<div id="footer">
<p>
<a href="../impressum.html" class="sub">Impressum</a>
</p>
</div>
</body>
</html>

------------------------------------------
<?PHP
echo "ffffffffffffffffff";
?>
----------------------------------
Dieser Abschnitt funktioniert nicht, wie er soll. Wenn ich das in eine eigene Datei schreibe und die test.php oder test.html nenne, gibt mir der Browser fffffffffff aus, aber im obigen Quelltext zeigt er nix an. Wo liegt der Fehler?

-=sUn's*shAdoW=-
2004-05-31, 00:01:38
Original geschrieben von Gast
Das ist zwar ein guter Tipp, aber bei meiner Seite fallen schon größere Mengen an Daten an, deswegen suche ich halt eine Möglichkeit externe Textdateien in die aktuelle Seite einzubinden.

Hier ist das Problem was ich habe:


<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="de" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Workshop - Drei Spalten</title>
<!-- <link rel="stylesheet" type="text/css" href="../css/mager.css"> -->
<style type="text/css">
<!--
@import url("workshop.css");
@import url("dreispalten.css");
-->
</style>
</head>
<body>

<div id="header">
<h1>Griechische Mythologie</h1>
</div>

<div id="linkespalte">
<div id="schalter1">
<p>
<a href="../test3.html">Troja</a> <span class="nix">|</span>
<a href="../test3.html">Atlantis</a> <span class="nix">|</span>
<a href="../test3.html">Sparta</a> <span class="nix">|</span>

<a href="../test3.html">Rom</a> <span class="nix">|</span>
<a href="../test3.html">Archilles</a> <span class="nix">|</span>
<a href="../test3.html">Hektor</a> <span class="nix">|</span>
<a href="../test3.html">Paris</a>
</p>
</div>

</div>

<div id="rechtespalte">
<!-- Teaserblock -->
<div id="t-box">
<h4>Mitteilungen</h4>

<div class="teaser">
<div class="t-head">
<strong>Troja</strong>

</div>
<div class="t-txt">
Was passierte w&auml;hrend des 10-j&auml;hrigen trojanischen Krieges?
</div>
</div>

<div class="teaser">
<div class="t-head">
<strong>Atlantis</strong>

</div>
<div class="t-txt">
Gab es diesen sagenumwobenen Kontinent wirklich?
</div>
</div>

<div class="teaser">
<div class="t-head">
<strong>Umfrage</strong>

</div>
<div class="t-txt">
Troja: Soll eine neue Dokumentation im ZDF laufen?
</div>
</div>

<div class="teaser">
<div class="t-head">
<strong>Neue Mitglieder</strong>

</div>
<div class="t-txt">
Dr. T ist als neues Mitglied unserem Verein beigetreten
</div>
</div>

</div>
<!-- End Teaserblock -->
</div>


<div id="content">

<h1>Troja</h1>


<?PHP
echo "ffffffffffffffffff";
?>

<p><a href="#main">Seitenanfang</a></p>

</div>


<div id="footer">
<p>
<a href="../impressum.html" class="sub">Impressum</a>
</p>
</div>
</body>
</html>

------------------------------------------
<?PHP
echo "ffffffffffffffffff";
?>
----------------------------------
Dieser Abschnitt funktioniert nicht, wie er soll. Wenn ich das in eine eigene Datei schreibe und die test.php oder test.html nenne, gibt mir der Browser fffffffffff aus, aber im obigen Quelltext zeigt er nix an. Wo liegt der Fehler?

kann es sein, dass dein webspace oder server kein php unterstützt?

cu

Gast
2004-05-31, 00:09:25
Doch tut er. sonst würde das kurze Script ja auch nicht funktionieren.
<?PHP
echo "ffffffffffffffffff";
?>
Das klappt ohne weiteres, aber wenn es in der langen HTML-Datei steht, klappt es halt nicht,aber warum?

Aqualon
2004-05-31, 00:15:42
Edit: Fehler gefunden, der PHP-Parser kommt wahrscheinlich mit der ersten Zeile nicht zurecht. Versuch es mal folgendermaßen:

<?php echo('<?xml version="1.0" encoding="UTF-8"?>');?>

Aqua

-=sUn's*shAdoW=-
2004-05-31, 00:16:26
Original geschrieben von Gast
Doch tut er. sonst würde das kurze Script ja auch nicht funktionieren.
<?PHP
echo "ffffffffffffffffff";
?>
Das klappt ohne weiteres, aber wenn es in der langen HTML-Datei steht, klappt es halt nicht,aber warum?

ich dachte du testest es zu hause ;)

der einzige Grund der mir einfällt wäre, dass du xhtml verwendest, mit welchem ich mich noch überhaupt nicht befasst habe.

Probiere doch mal das miniscript in eine stinknormale html-seite einzubauen.

cu

/edit: genau, hör auf Aqualon - das wird es eher sein ^^

Gast
2004-05-31, 00:55:01
Autsch, klar jetzt leuchtet es mir auch ein.
Danke für die Hilfe.
PHP kann ja nix mit HTML anfangen.