xxx.html im div anzeigen lassen

tokoop · 16. September 2005

Hallo an alle!

Mein Problem mit dem "Ein Link mehrer Frames zu steuern", habe ich als erledigt makiert.

Frames ist ja wohl nicht mehr so propper wenn man sich hier mal im Forum so umschaut.

Ich habe also jetzt versucht alles mit div zu bauen. Tolle Sache. Habe auch einiges im Forum gefunden und umgebaut (vielen Dank an dieser Stelle).
Das sieht im Browser ja auch alles soweit ganz gut aus, in Dreamwaver allerdings nicht. Also eben nur Code.

Jetzt möchte ich am liebsten die alten Frames in die div-Elemente importieren. Das scheint aber wohl nicht so ganz einfach zu sein, wenn man sich mit Css und php so garnicht auskennt. D.h. also jede einzelne Seite neu mit div-Elementen aufbauen wenn ich das richtig gelesen habe.

Also weiter gesucht wie das mit php oder css .

Ich gebe es auf!

das ist zu heftig für mich. Zu umfassend in der kürzre der Zeit.

Kann mir jemand helfen um die alten Frames im div anzeigen zu lassen?
Ich will ja garnicht alles gemacht bekommen, bischen basteln ist ja auch schön (aber man muss eben auch wissen wann man nicht mehr kann

)

Nochmal zum Hintergrund:
Ich habe eine Seite mit Frames gebaut. Dann einiges hier gelesen.
Meine Seite sieht ganz gut aus, und das war es dann auch schon.
Jetzt möchte ich das langsam mit fundiertem Code unterlegen um dabei einen Einblick in die Materie zu bekommen.

Zu Guter letzt schon an alle die sich die Mühe mache das alles zu lesen ein fettes Dankeschön!
Michael

und das, was ich die letzten Nächte fabriziert habe

Code:

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS-Beispiel 2: position_fixed</title>
<style type="text/css">
<!--
html, body {
        width: 100%;
        height: 100%;
        margin: 0;
        border: 0;
        padding: 0;
}
body {
        background-color: #cfc;
        overflow: hidden;  /* Scrollbalken im Fenster unterbinden */
}
#mitte {
        position: absolute;
        top: 131px;             /* Abstand zum oberen Fensterrand */
        left: 20px;            /* Abstand zum linken Fensterrand */
        background-color: #cff;
		bottom: 15px;           /* Abstand zum unteren Fensterrand */
        right: 0px;           /* Abstand zum rechten Fensterrand */
        overflow: auto;         /* Scrollbalken, falls notwendig */
}
* html #mitte {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-top-width: 0px;        /* = Kopfzeilenhöhe */
        border-left-width: 0px;       /* = Spaltenbreite links */
        border-bottom-width: 0px;      /* = Fußzeilenhöhe */
        border-right-width: 0px;      /* = Spaltenbreite rechts */
        border-style: solid;
}
#mitte .inhaltDiv {
        margin: 20px;           /* Abstand des Inhalts zum Blockrand */
}
#n1 {
        position: absolute;
        top: 100px;                 /* Abstand zum oberen Fensterrand */
		width: 100%;
        left: 20px;                /* Abstand zum linken Fensterrand */
        height: 15px;          /* Blockhöhe */
        padding: 0;             /* Interpretation Boxmodell! */
        background-color: #FFCC00;
        overflow: hidden;       /* Scrollbalken unterbinden */
        z-index: 5;             /* höchste z-Ebene! */
}
* html #n1 {
        width: 100px;
        height: 15px;
}
#n1 .inhaltDiv {
        margin: 0px;           /* Abstand des Inhalts zum Blockrand */
}

#n2 {
        position: absolute;
        top: 115px;                 /* Abstand zum oberen Fensterrand */
		width: 100%;
        left: 20px;                /* Abstand zum linken Fensterrand */
        height: 16px;          /* Blockhöhe */
        padding: 0;             /* Interpretation Boxmodell! */
        background-color: #FFCC00;
        overflow: hidden;       /* Scrollbalken unterbinden */
        z-index: 5;             /* höchste z-Ebene! */
}
* html #n2 {
        width: 100px;
        height: 16px;
}
#n2 .inhaltDiv {
        margin: 0px;           /* Abstand des Inhalts zum Blockrand */
}


#oben {
        position: absolute;
        top: 0;                 /* Abstand zum oberen Fensterrand */
		width: 100%;
        left: 20px;                /* Abstand zum linken Fensterrand */
        height: 100px;          /* Blockhöhe */
        padding: 0;             /* Interpretation Boxmodell! */
        background-color: #FFFFFF;
        overflow: hidden;       /* Scrollbalken unterbinden */
        z-index: 4;             /* höchste z-Ebene! */
}
* html #oben {
        width: 100px;
        height: 100px;
}
#oben .inhaltDiv {
        margin: 10px;           /* Abstand des Inhalts zum Blockrand */
}

#unten {
        position: absolute;
        left: 20px;            /* Abstand zum linken Fensterrand */
        bottom: 0;              /* Abstand zum unteren Fensterrand */
        right: 0;               /* Abstand zum rechten Fensterrand */
        height: 16px;           /* Blockhöhe */
        padding: 0;             /* Interpretation Boxmodell! */
        background-color: #fcf;
        overflow: hidden;       /* Scrollbalken unterbinden */
        z-index: 2;
}
* html #unten {
        left: 0;
        width: 100%;
        height: 16px;
        border-top-width: 0;
        border-left-width: 0px;       /* = Spaltenbreite links */
        border-bottom-width: 0;
        border-right-width: 0;
        border-style: solid;
}
#unten .inhaltDiv {
        margin: 10px;           /* Abstand des Inhalts zum Blockrand */
}
#links {
	position: absolute;
	top: 0px;
	bottom: 0px;
	width: 20px;
	hight: 100%
        padding;
	background-color: #FFCC66;
: 0;             /* Interpretation Boxmodell! */
        background-color: #ccf;
        overflow: hidden;       /* Scrollbalken unterbinden */
        z-index: 1;
}
* html #links {
        top: 0;
        width: 20px;
        height: 100%;
        border-top-width: 0px;        /* = Kopfzeilenhöhe */
        border-left-width: 0;
        border-bottom-width: 0px;      /* = Fußzeilenhöhe */
      
        border-style: solid;
}
#links .inhaltDiv {
        margin: 10px;           /* Abstand des Inhalts zum Blockrand */
}
-->
</style>
<script language="JavaScript" type="text/JavaScript">
<!--


function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_nbGroup(event, grpName) { //v6.0
  var i,img,nbArr,args=MM_nbGroup.arguments;
  if (event == "init" && args.length > 2) {
    if ((img = MM_findObj(args[2])) != null && !img.MM_init) {
      img.MM_init = true; img.MM_up = args[3]; img.MM_dn = img.src;
      if ((nbArr = document[grpName]) == null) nbArr = document[grpName] = new Array();
      nbArr[nbArr.length] = img;
      for (i=4; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
        if (!img.MM_up) img.MM_up = img.src;
        img.src = img.MM_dn = args[i+1];
        nbArr[nbArr.length] = img;
    } }
  } else if (event == "over") {
    document.MM_nbOver = nbArr = new Array();
    for (i=1; i < args.length-1; i+=3) if ((img = MM_findObj(args[i])) != null) {
      if (!img.MM_up) img.MM_up = img.src;
      img.src = (img.MM_dn && args[i+2]) ? args[i+2] : ((args[i+1])? args[i+1] : img.MM_up);
      nbArr[nbArr.length] = img;
    }
  } else if (event == "out" ) {
    for (i=0; i < document.MM_nbOver.length; i++) {
      img = document.MM_nbOver[i]; img.src = (img.MM_dn) ? img.MM_dn : img.MM_up; }
  } else if (event == "down") {
    nbArr = document[grpName];
    if (nbArr)
      for (i=0; i < nbArr.length; i++) { img=nbArr[i]; img.src = img.MM_up; img.MM_dn = 0; }
    document[grpName] = nbArr = new Array();
    for (i=2; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
      if (!img.MM_up) img.MM_up = img.src;
      img.src = img.MM_dn = (args[i+1])? args[i+1] : img.MM_up;
      nbArr[nbArr.length] = img;
  } }
}
//-->
</script>
</head>

<body onload="MM_preloadImages('../bilder/_btn/btn_n1_nl_1_02.gif','../bilder/_btn/btn_n1_nl_1_03.gif','../bilder/_btn/btn_n1_nl_1_04.gif','../bilder/_btn/ecke_l.gif','../bilder/_btn/btn_n1_nl_2_01.gif','../bilder/_btn/ecke_r.gif')">
<div id="mitte"><div class="inhaltDiv">
<h1>#mitte:</h1>
<p>
mitte
</p>
</div></div>

<div id="n1">
  <div class="inhaltDiv"> <img src="../bilder/_btn/spacer.gif" width="8" height="1" id="ev1" name="ev1"><a href="wein_nl.html" target="_top" onclick="MM_nbGroup('down','group1','btn_n1_nl_1_01','../bilder/_btn/btn_n1_nl_2_01.gif','ev1','../bilder/_btn/ecke_l.gif','en1','../bilder/_btn/ecke_r.gif',1)" onmouseout="MM_nbGroup('out')" onmouseover="MM_nbGroup('over','btn_n1_nl_1_01','../bilder/_btn/btn_n1_nl_2_01.gif','../bilder/_btn/btn_n1_nl_2_01.gif','ev1','../bilder/_btn/ecke_l.gif','../bilder/_btn/ecke_l.gif','en1','../bilder/_btn/ecke_l.gif','../bilder/_btn/ecke_l.gif',1)"><img alt="Weinproben, Philosophie" src="../bilder/_btn/btn_n1_nl_1_01.gif" border="0" name="btn_n1_nl_1_01"></a><img src="../bilder/_btn/spacer.gif" width="8" height="1" id="en1" name="en1"><a href="zimm_nl.html" target="_top" onclick="MM_nbGroup('down','group1','btn_n1_nl_2_02','../bilder/_btn/btn_n1_nl_1_02.gif',1)" onmouseout="MM_nbGroup('out')" onmouseover="MM_nbGroup('over','btn_n1_nl_2_02','../bilder/_btn/btn_n1_nl_1_02.gif','../bilder/_btn/btn_n1_nl_1_02.gif',1)"><img src="../bilder/_btn/btn_n1_nl_2_02.gif"  border="0" name="btn_n1_nl_2_02"><img src="../bilder/_btn/spacer.gif" width="8" height="1" id="en2" name="en2"></a><a href="kroe_nl.html" target="_top" onclick="MM_nbGroup('down','group1','btn_n1_nl_2_03','../bilder/_btn/btn_n1_nl_1_03.gif',1)" onmouseout="MM_nbGroup('out')" onmouseover="MM_nbGroup('over','btn_n1_nl_2_03','../bilder/_btn/btn_n1_nl_1_03.gif','../bilder/_btn/btn_n1_nl_1_03.gif',1)"><img alt="Informationen rund um Kr&ouml;v" src="../bilder/_btn/btn_n1_nl_2_03.gif" border="0" name="btn_n1_nl_2_03"><img src="../bilder/_btn/spacer.gif" width="8" height="1" id="en3" name="en3"></a><a href="../adre.html" target="_top" onclick="MM_nbGroup('down','group1','btn_n1_nl_2_04','../bilder/_btn/btn_n1_nl_1_04.gif',1)" onmouseout="MM_nbGroup('out')" onmouseover="MM_nbGroup('over','btn_n1_nl_2_04','../bilder/_btn/btn_n1_nl_1_04.gif','../bilder/_btn/btn_n1_nl_1_04.gif',1)"><img alt="Adresse, Lageplan" src="../bilder/_btn/btn_n1_nl_2_04.gif" border="0" name="btn_n1_nl_2_04"><img src="../bilder/_btn/spacer.gif" width="8" height="1" id="en4" name="en4"></a></div>
	</div>

<div id="n2"><div class="inhaltDiv">
n2
</div></div>

<div id="oben"><div class="inhaltDiv">
oben
</div></div>


<div id="links"><div class="inhaltDiv">
links
<p>links</p>
</div></div>

<div id="unten"><div class="inhaltDiv">
<h2>#unten</h2>
</div></div>

</body>
</html>

Maik · 16. September 2005

An dieser Stelle ein grundsätzlicher Tipp: Quellcode-Angaben solltest du in deinen Beiträgen mit einem der Tags [code], [code=html] oder [code=php] formatieren. Es liest sich irgendwie entspannter

Vielen Dank.

tokoop · 16. September 2005

Tschuldigung,

dachte aber das mit dem freundlichen Button in der Menüleiste getan zu haben.
Was war mein Fehler? Der SChluss TAG? Ich lerne eben minütlich dazu.

Danke michaelsinterface!!

Maik · 16. September 2005

Wieso willst du Frames in die DIVs importieren, wenn du doch ein CSS-Layout erstellt hast, das ein Frameset 'simuliert'

tokoop · 16. September 2005

Habe mich da vielleicht nicht richtig ausgedrückt 8is eben nicht mein Metier):

Ich möchte nicht die Frames importieren, sondern deren Inhalt.

Die Seite habe ich ja schon mal mit Frames erstellt. Jetz möchte ich den Inhalt der Frames, also die HTML-seiten im Div-Element anzeigen lassen.

Code:

zB:
"top.html"    im 

<div id="oben"><div class="inhaltDiv">
oben
</div></div>

Ist das jetzt besser / verständlicher für Leute vom Fach
:-(

hpvw · 16. September 2005

Zunächst dürfen Deine alten Frame-Seiten natürlich keine vollständigen HTML-Seiten mehr sein. Übrig bleiben sollte nur das, was zwischen <body> und </body> steht. Dann kannst Du diese Seiten mit PHP an der Stelle einfügen, wo jetzt Dein "Frame-Ersatz-div" ist.
Wie das geht, zeigt Dir das Tutorial Navigation über die URL.

Gruß hpvw

tokoop · 16. September 2005

Das sieht wieder richtig gut aus;-)

Ich knie mich da mal gerade rein, melde mich dann wieder wenn ich ein Resultat oder eine zwei drei vier Fragen habe.

An dieser Stelle nochmal ein

fettes Dankschön!!

tokoop · 16. September 2005

Da binich schon wieder.

Das sieht eigentlich wirklich nicht kompliziert aus, aber wohin kommt der PHP-code aus dem Tutorial und wohin der Code?

Ich denke der Code

Code:

<a href="inhalt.php?section=home">Home</a>

steht direkt im div-Element und der

PHP-Code:

Code:

<?php 
//config.php

$dateien = array(); //Erstellt einen neuen Array $dateien 
$dateien['home'] = "home.php"; //für jede Section ein neue Variable 
$dateien['news'] = "news.php";  //usw. 
$dateien['error'] = "error.php"; 
?>

im head

Richtig?

hpvw · 16. September 2005

Die 'config.php' wird eine eigene Datei.
Der von Dir dargestellte Link kommt ins Menü.
Der eigentliche, im Tutorial dargestellte Code, kommt an die Stelle, an der später der Inhalt im HTML-Code stehen soll.

Gruß hpvw

tokoop · 16. September 2005

Hallo noch mal,

ich habe mich mal durch die Grundlagen PHP gelesen. Jetzt kann ich so ein bischen nachvollziehen was hier passiert.

Nur zum Verständnis:
1. Dieser Code muss nicht zwingen in eine komplette HTML-Datei (ich meine mit head +body) steht ,er kann ach komplett alleine in einer Datei stehen

Code:

<?php
//config.php

$dateien = array(); 
$dateien['oben'] = "oben.php";
$dateien['n1'] = "n1.php";
$dateien['n2'] = "n2.php";
$dateien['mitte'] = "mitte.php";
$dateien['bottom'] = "bottom.php";
?>

und wird in einer Datei config.php im selben Verzeichnis gespeichert wie die inhalt.php. Wert müssen für array() nicht eingetragen werden da hierfür die Variablen $dateien stehen. Richtig?

2. Der Code

Code:

<div id="oben">
  <div class="inhaltDiv">
  <?php 
//inhalt.php 
include('config.php'); 

if(isset($_GET['section']) AND isset($dateien[$_GET['section']])) 
{ 
//Ist eine $_GET Variable vorhanden wird PHP angewiesen 
//zu prüfen ob die Datei existiert und diese dann zu laden 

if(!file_exists($dateien[$_GET['section']])) echo "Die Datei ist nicht vorhanden."; 

include $dateien[$_GET['section']]; 
} 
else 
{ 
//Wenn keine Variable oder Definition vorhanden ist 
//lade die Fehlerseite bzw. die Indexseite 
include $dateien['error']; 
} 
?></div></div>

wird in der Datei inhalt.php an der Stelle eingebunden, an der die Referenz-HTML erscheinen soll.

Was ich hier wo einzutragen habe, habe ich nicht herausbekommen.

Was ist isset und was muss ich section eintragen?

Über weitere Hilfe würde ich mich freuen
Michael

xxx.html im div anzeigen lassen

tokoop

Mitglied

Maik

tokoop

Mitglied

Maik

tokoop

Mitglied

hpvw

Erfahrenes Mitglied

tokoop

Mitglied

tokoop

Mitglied

hpvw

Erfahrenes Mitglied

tokoop

Mitglied

Neue Beiträge