Navigation in eigener datei ablegen...

midnight · 14. Jan. 2003

Hi,

ist es möglich eine bestimmte Datei (z.B. Navigation) in ein html Dokument einzubinden?¿

<html>
<body>
<eingebundene Navigation>
Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text
</body>
</html>

C.K. · 14. Jan. 2003

Hallo,

wie meinst du das, in html einbinden? Die Navigation ist dorch i.d.R. im Quelltext. Falls du da eine externe Datei auslagern willst, was für ein Format ist das denn?

Gruß,
Colja

midnight · 14. Jan. 2003

Ja richtig...

Ich will die Navigation (die bis jetzt noch im Quelltext ist) auslagern...

als html- oder txt- oder mir_doch_egal-Datei

C.K. · 14. Jan. 2003

Aha,

ginge wahrscheinlich mit nem iframe. Anleitung dazu gibts hier.
Was ist denn das für ne Navigation, dass du die unbedingt aus dem Quelltext auslagern willst?

Gruß,
Colja

midnight · 14. Jan. 2003

mit iframe sieht man aber nen rahmen

Hier ist die Navigation die ich auslagern will

Grinsemann · 14. Jan. 2003

Alles was zwischen:

  
  <script language="JavaScript">

und

  </script>
  

steht ohne die sämtlichen <script language="JavaScript"> und </script> in eine externe Datei. Dann bindest du diese per:

  <script type="text/javascript" language="JavaScript" scr="navigation.js"></script>

in deine HTML-Datei ein.

Müsste funktionieren.

.marc · 14. Jan. 2003

wenn du es mit einem iframe machen willst schreib im iframe tag folgendes: frameborder=0

C.K. · 14. Jan. 2003

Ja,

die Version von Grinsemann ist auch meiner Meinung nach die Beste. Sollten dir die iframes besser gefallen, schau dir mal den Anhang an, hab dir das mal kurz fertig gemacht.

Gruß,
Colja

.marc · 14. Jan. 2003

meiner meinung nach ist ein iframe nicht sinvoll, da koennte man ja gleich ein frameset defienieren.

kasimir83 · 14. Jan. 2003

Auslagern ist absolut simpel:

lagere dein Menu ohne Kopfdaten als htmlcode in eine *.html aus, und binde sie im Zieldocument mit
<!-#include virtual="*.html"->
ein.
Das Zieldocument muss dafür aber die endung Shtml haben, damit der Server weiß, dass da ssi-Befehle drin sind die er zu parsen hat.
Vorraussetzung: dein Server kann das.

midnight · 14. Jan. 2003

@ Grinsemann

Vorschlag gefällt mir sehr gut geht aber nicht...

@ kasimir83

geht auch nicht

kasimir83 · 14. Jan. 2003

Das ssi nur online funktioniert weißt du...?

midnight · 14. Jan. 2003

ich habs doch hoch geladen (link im vorigen post)

kasimir83 · 14. Jan. 2003

schreib nochmal ein slash vor nav.html sonst isses halt 'n schlechter Server...

Grinsemann · 14. Jan. 2003

Zeig nochmal die navigation.js Datei.

midnight · 14. Jan. 2003

@ grinsemann

<script language="JavaScript">
//Top Nav Bar I v2- By Constantin Kuznetsov Jr. (script@esolutiononline.com)

var keepstatic=1 //specify whether menu should stay static 0=non static (works only in IE4+)
var menucolor="#00C0ff" //specify menu color
var submenuwidth=150 //specify sub menus' color

if (document.all) {n=0;ie=1;ns6=0;fShow="visible";fHide="hidden";}
if (document.getElementById&&!document.all) {n=0;ie=0;ns6=1;fShow="visible";fHide="hidden";}
if (document.layers) {n=1;ie=0;ns6=0;fShow="show";fHide="hide";}

//Top Nav bar script v2- http://www.dynamicdrive.com/dynamicindex1/sm/index.htm

opr6=ie&&navigator.userAgent.indexOf("Opera")!=-1

//window.onerror=new Function("return true")
////////////////////////////////////////////////////////////////////////////
// Function Menu() //
////////////////////////////////////////////////////////////////////////////
rightX = 0;
function Menu()
{
this.bgColor = menucolor;
if (ie) this.menuFont = "bold 12px Arial";
if

this.menuFont = "bold 12px Verdana";
this.fontColor = "black";

this.addItem = addItem;
this.addSubItem = addSubItem;
this.showMenu = showMenu;
this.mainPaneBorder = 0;
this.subMenuPaneBorder = 0;

this.subMenuPaneWidth = submenuwidth;

lastMenu = null;

rightY = 0;
leftY = 0;
leftX = 0;

HTMLstr = "";
HTMLstr += "\n";
HTMLstr += "\n";
if (ie||ns6) HTMLstr += "<div id='MainTable' style='position:relative;top:0'>\n";
// if

HTMLstr += "<layer name='MainTable'>\n";
HTMLstr += "<table width='100%' bgcolor='"+this.bgColor+"' border='"+this.mainPaneBorder+"'>\n";
HTMLstr += "<tr>";
if

HTMLstr += "<td>_";
HTMLstr += "\n";
HTMLstr += "\n";
HTMLstr += "\n";
if

HTMLstr += "</td>";
HTMLstr += "</tr>\n";
HTMLstr += "</table>\n";
HTMLstr += "\n";
HTMLstr += "\n";
HTMLstr += "\n";
HTMLstr += "\n";
HTMLstr += "\n";
if (ie||ns6) HTMLstr+= "</div>\n";
// if

HTMLstr+= "</layer>\n";
HTMLstr += "\n";
}

function addItem(idItem, text, hint, location, altLocation)
{
var Lookup = "";
if (HTMLstr.indexOf(Lookup) != -1)
{
alert(idParent + " already exist");
return;
}
var MENUitem = "";
MENUitem += "\n\n";
if

{
MENUitem += "<ilayer name="+idItem+">";
MENUitem += "<a href='.' class=clsMenuItemNS onmouseover=\"displaySubMenu('"+idItem+"')\" onclick=\"return false;\">";
MENUitem += "|_";
MENUitem += text;
MENUitem += "</a>";
MENUitem += "</ilayer>";
}
if (ie||ns6)
{
MENUitem += "<td>\n";
MENUitem += "<div id='"+idItem+"' style='position:relative; font: "+this.menuFont+";'>\n";
MENUitem += "<a ";
MENUitem += "class=clsMenuItemIE ";
// MENUitem += "style='text-decoration: none; font: "+this.menuFont+"; color: "+this.fontColor+"; cursor: hand;' ";
if (hint != null)
MENUitem += "title='"+hint+"' ";
if (location != null)
{
MENUitem += "href='"+location+"' ";
MENUitem += "onmouseover=\"hideAll()\" ";
}
else
{
if (altLocation != null)
MENUitem += "href='"+altLocation+"' ";
else
MENUitem += "href='.' ";
MENUitem += "onmouseover=\"displaySubMenu('"+idItem+"')\" ";
MENUitem += "onclick=\"return false;\" "
}
MENUitem += ">";
MENUitem += "|_\n";
MENUitem += text;
MENUitem += "</a>\n";
MENUitem += "</div>\n";
MENUitem += "</td>\n";
}
MENUitem += "\n\n";
MENUitem += "\n";

HTMLstr = HTMLstr.replace("\n", MENUitem);
}

function addSubItem(idParent, text, hint, location)
{
var MENUitem = "";
Lookup = "";
if (HTMLstr.indexOf(Lookup) == -1)
{
alert(idParent + " not found");
return;
}
Lookup = "";
if (HTMLstr.indexOf(Lookup) == -1)
{
if

{
MENUitem += "\n";
MENUitem += "<layer id='"+idParent+"submenu' visibility=hide bgcolor='"+this.bgColor+"'>\n";
MENUitem += "<table border='"+this.subMenuPaneBorder+"' bgcolor='"+this.bgColor+"' width="+this.subMenuPaneWidth+">\n";
MENUitem += "\n";
MENUitem += "</table>\n";
MENUitem += "</layer>\n";
MENUitem += "\n";
}
if (ie||ns6)
{
MENUitem += "\n";
MENUitem += "<div id='"+idParent+"submenu' onmouseout=operahide() style='position:absolute; visibility: hidden; z-index:100; width: "+this.subMenuPaneWidth+"; font: "+this.menuFont+"; top: -300;'>\n";
MENUitem += "<table border='"+this.subMenuPaneBorder+"' bgcolor='"+this.bgColor+"' width="+this.subMenuPaneWidth+">\n";
MENUitem += "\n";
MENUitem += "</table>\n";
MENUitem += "</div>\n";
MENUitem += "\n";
}
MENUitem += "\n";
HTMLstr = HTMLstr.replace("\n", MENUitem);
}

Lookup = "\n";
if

MENUitem = "<tr><td><a class=clsMenuItemNS title='"+hint+"' href='"+location+"'>"+text+"</a><br></td></tr>\n";
if (ie||ns6) MENUitem = "<tr><td><a class=clsMenuItemIE title='"+hint+"' href='"+location+"'>"+text+"</a><br></td></tr>\n";
MENUitem += Lookup;
HTMLstr = HTMLstr.replace(Lookup, MENUitem);

}

function showMenu()
{
document.writeln(HTMLstr);
}

////////////////////////////////////////////////////////////////////////////
// Private declaration
function displaySubMenu(idMainMenu)
{
var menu;
var submenu;
if

{
submenu = document.layers[idMainMenu+"submenu"];
if (lastMenu != null && lastMenu != submenu) hideAll();
submenu.left = document.layers[idMainMenu].pageX;
submenu.top = document.layers[idMainMenu].pageY + 25;
submenu.visibility = fShow;

leftX = document.layers[idMainMenu+"submenu"].left;
rightX = leftX + document.layers[idMainMenu+"submenu"].clip.width;
leftY = document.layers[idMainMenu+"submenu"].top+
document.layers[idMainMenu+"submenu"].clip.height;
rightY = leftY;
} else if (ie||ns6) {
//alert(document.getElementById(idMainMenu+"submenu").id)
menu = ie? eval(idMainMenu) : document.getElementById(idMainMenu);
submenu = ie? eval(idMainMenu+"submenu.style") : document.getElementById(idMainMenu+"submenu").style;
submenu.left = calculateSumOffset(menu, 'offsetLeft');
// submenu.top = calculateSumOffset(menu, 'offsetTop') + 30;
submenu.top = menu.style.top+23;
submenu.visibility = fShow;
if (lastMenu != null && lastMenu != submenu) hideAll();

leftX = ie? document.all[idMainMenu+"submenu"].style.posLeft : parseInt(document.getElementById(idMainMenu+"submenu").style.left);
rightX = ie? leftX + document.all[idMainMenu+"submenu"].offsetWidth : leftX+parseInt(document.getElementById(idMainMenu+"submenu").offsetWidth);

leftY = ie? document.all[idMainMenu+"submenu"].style.posTop+
document.all[idMainMenu+"submenu"].offsetHeight : parseInt(document.getElementById(idMainMenu+"submenu").style.top)+parseInt(document.getElementById(idMainMenu+"submenu").offsetHeight);
rightY = leftY;
}
lastMenu = submenu;
}

function hideAll()
{
if (lastMenu != null) {lastMenu.visibility = fHide;lastMenu.left = 0;}
}

function calculateSumOffset(idItem, offsetName)
{
var totalOffset = 0;
var item = eval('idItem');
do
{
totalOffset += eval('item.'+offsetName);
item = eval('item.offsetParent');
} while (item != null);
return totalOffset;
}

function updateIt(e)
{
if (ie&&!opr6)
{
var x = window.event.clientX;
var y = window.event.clientY;

if (x > rightX || x < leftX) hideAll();
else if (y > rightY) hideAll();
}
if (n||ns6)
{
var x = e.pageX;
var y = e.pageY;

if (x > rightX || x < leftX) hideAll();
else if (y > rightY) hideAll();
}
}

function operahide(){
if (opr6){
if (!MainTable.contains(event.toElement))
hideAll()
}
}

if (ie||ns6)
{
document.body.onclick=hideAll;
document.body.onscroll=hideAll;
document.body.onmousemove=updateIt;
}
if (document.layers)
{
window.captureEvents(Event.MOUSEMOVE);
window.captureEvents(Event.CLICK);
window.onmousemove=updateIt;
window.onclick=hideAll;
}

function showToolbar()
{
// AddItem(id, text, hint, location, alternativeLocation);
// AddSubItem(idParent, text, hint, location);

menu = new Menu();
menu.addItem("home", "Home", "Home", "http://markusmayer.de", null);
menu.addItem("ueber_mich", "Über Mich", "Über Mich", null, null);
menu.addItem("kontakt", "Kontakt", "Kontakt", null, null);
menu.addItem("links", "Links", "Links", null, null);
menu.addItem("copy", "©", "©", null, null);

menu.addSubItem("ueber_mich", "Allgemeines", "Allgemeines", null);
menu.addSubItem("ueber_mich", "Bilder", "Bilder", null);

menu.addSubItem("links", "Lieblingsseiten", "Lieblingsseiten", null);
menu.addSubItem("links", "Freunde", "Freunde", null);

menu.showMenu();
}

showToolbar();

function UpdateIt(){
if (ie&&keepstatic&&!opr6)
document.all["MainTable"].style.top = document.body.scrollTop;
setTimeout("UpdateIt()", 200);
}
UpdateIt();

</script>

Grinsemann · 14. Jan. 2003

Sagte ich nicht zwischen <script language="JavaScript"> und </script>

C.K. · 14. Jan. 2003

Also,

ich hab das mit der externen js-Datei mal eben ausprobiert, funktioniert fehlerfrei.

Gruß,
Colja

kasimir83 · 14. Jan. 2003

Gratulation.
Das mit der include hab ich aber auch noch nie gebraucht, ich arbeite üblicherweise mit 'nem nav-frame.

midnight · 14. Jan. 2003

vielen dank

Navigation in eigener datei ablegen...

New member

Lounge-Member

New member

Lounge-Member

New member

New member

New member

Lounge-Member

Anhänge

New member

Lounge-Member

New member

Lounge-Member

New member

Lounge-Member

New member

New member

New member

Lounge-Member

Anhänge

Lounge-Member

New member