DevTrain Startseite SharePoint Camp ? In 5 Tagen zum SharePoint Profi!  
  
  
SUCHEN:  
ARTIKEL ONLINE: 525   

Kategorien
.NET
Datenbanken
Web
XML

Allgemein
Camp
Foren
Events
Persönliche Einstellungen
Registrieren
Prämien Shop
Kontakt
Impressum
Über DevTrain

Autoren



 

Forum: JavaScript | Thema: Re: position:relative | Von: G. Guest ( 30.09.2003 20:59)

danke für die antworten. hab es jetzt geschafft, dass das gröbste verhindert wird indem ich die navigation in eine table innerhalb eines tds gesetzt habe. d.h. die width funktioniert jetzt, aber der abstand vom hauptmenubutton zum submenu scheint 2px zu betragen und ich weiß nicht wie ich die wegbekomme. schick mal den quelltext:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>

<style type="text/css">
div.extra
{
width: 285px;
height: 252px;
overflow:auto;

}
</style> <SCRIPT language="JavaScript1.2">
<!--
schlossImage = new Image();
schlossImage.src = "themes/Odyssey/bilder/schloss.jpg";
schlossImage_HL = new Image();
schlossImage_HL.src = "themes/Odyssey/bilder/schloss.jpg";
downloadsImage = new Image();
downloadsImage.src = "downloads.gif";
downloadsImage_HL = new Image();
downloadsImage_HL.src = "downloads_hl.gif";
linksImage = new Image();
linksImage.src = "links.gif";
linksImage_HL = new Image();
linksImage_HL.src = "links_hl.gif";

var menuOpacity = new Array();
var hideAllowed = new Array();

// global configuration
var deltaX = 30
var deltaY = 16
var x0 = 5
var y0 = 5
var defaultTarget = 'fileList'

var browserName = navigator.appName;
var browserVersion = parseInt(navigator.appVersion);
var isIE = false;
var isNN = false;
var isDOM = false;
var isDomIE = false;
var isDomNN = false;
var layerok = false;

var isIE = browserName.indexOf("Microsoft Internet Explorer" )==-1?false:true;
var isNN = browserName.indexOf("Netscape")==-1?false:true;
var isOpera = browserName.indexOf("Opera")==-1?false:true;
var isDOM = document.getElementById?true:false;
var isDomNN = document.layers?true:false;
var isDomIE = document.all?true:false;

if ( isNN && browserVersion>=4 ) layerok=true;
if ( isIE && browserVersion>=4 ) layerok=true;
if ( isOpera && browserVersion>=5 ) layerok=true;

function Init()
{
}

function ChangeImage(objectName, newObjectName)
{
var image = document.getElementById(objectName);
eval("image.src = " + newObjectName + ".src;");
}

function ChangeImage_old(Nr, Obj)
{
window.document.images[Nr].src = Obj.src;
}

function hideLayer(layerName)
{
if (isDOM)
document.getElementById(layerName + "SubMenu").style.visibility="hidden"
else if (isDomIE)
document.all[layerName + "SubMenu"].style.visibility="hidden";
else if (isDomNN)
document.layers[layerName + "SubMenu"].visibility="hidden";
}

function slowHideLayer(layerName)
{
// do not call allowHide as this would call slowHideLayer (stack overflow ;-)=
hideAllowed[layerName] = true;

ChangeImage(layerName + "Menu", layerName + "Image");
setTimeout("fadeOut('" + layerName + "')", 100);
}

function fadeOut(layerName)
{
/* var text = "";
for (var entry in hideAllowed)
{
text = text + entry + "(" + hideAllowed[entry] + "), ";
}
document.title = text;
*/

if (hideAllowed[layerName] == false)
{
menuOpacity[layerName] = 80;

if (isIE == true)
eval(layerName + "SubMenu.filters.alpha.opacity=menuOpacity[layerName];");

return;
}

if (isIE == true)
eval(layerName + "SubMenu.filters.alpha.opacity=menuOpacity[layerName];");

menuOpacity[layerName] = menuOpacity[layerName] - 1;
if (menuOpacity[layerName] <= 0)
{
hideLayer(layerName);
}
else
setTimeout("fadeOut('" + layerName + "')", 10);
}

function allowHide(layerName)
{
hideAllowed[layerName] = true;
slowHideLayer(layerName);
}

function preventHide(layerName)
{
hideAllowed[layerName] = false;
}

function showLayer(layerName)
{
preventHide(layerName);

if (isDOM)
document.getElementById(layerName + "SubMenu").style.visibility="visible"
else if (isDomIE)
document.all[layerName + "SubMenu"].style.visibility="visible";
else if (isDomNN)
document.layers[layerName + "SubMenu"].visibility="visible";

menuOpacity[layerName] = 80;
if (isIE == true)
eval(layerName + "SubMenu.filters.alpha.opacity=menuOpacity[layerName];");

ChangeImage(layerName + "Menu", layerName + "Image_HL");
}

function setyLayer(layerName, y) {
if (isDOM)
document.getElementById(layerName).style.top=y
else if (isDomIE)
document.all[layerName].style.top=y;
else if (isDomNN)
document.layers[layerName].top=y;
}

//-->
</SCRIPT>
<LINK REL="StyleSheet" HREF="themes/Odyssey/style/style.css" TYPE="text/css">


<LINK REL="StyleSheet" HREF="themes/Odyssey/scroll.css" TYPE="text/css">



</head>

<body onload="javascript:Init()" background="themes/Odyssey/bilder/bgvb.gif" text="#000000" link="#004080" vlink="#004080" alink="#004080" marginwidth="0" marginheight="0" leftmargin="0" topmargin="0"><table cellpadding="0" cellspacing="0" width="100%" height="100%" border="0">
<tr>
<td valign="top" align="center">
<table cellpadding="0" cellspacing="0" border="0" height="100%">
<tr>
<td valign="top" height="182">
<table cellpadding="0" cellspacing="0" height="182" border="0" >
<tr>
<td valign="top">
<table border="0" cellspacing="0" cellpadding="0" >
<tr>
<td valign="top"><!-- Anfang der Headerinhalte -->
<TABLE WIDTH=1024 BORDER=0 CELLPADDING=0 CELLSPACING=0>
<TR>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_01.jpg" WIDTH=52 HEIGHT=35 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_02.jpg" WIDTH=128 HEIGHT=35 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_03.jpg" WIDTH=88 HEIGHT=35 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_04.jpg" WIDTH=18 HEIGHT=35 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_05.jpg" WIDTH=46 HEIGHT=35 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_06.jpg" WIDTH=57 HEIGHT=35 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_07.jpg" WIDTH=10 HEIGHT=35 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_08.jpg" WIDTH=45 HEIGHT=35 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_09.jpg" WIDTH=71 HEIGHT=35 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_10.jpg" WIDTH=10 HEIGHT=35 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_11.jpg" WIDTH=75 HEIGHT=35 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_12.jpg" WIDTH=133 HEIGHT=35 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_13.jpg" WIDTH=179 HEIGHT=35 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_14.jpg" WIDTH=88 HEIGHT=35 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/spacer.gif" WIDTH=24 HEIGHT=35 ALT=""></TD>
</TR>
<TR>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_16.jpg" WIDTH=52 HEIGHT=99 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_17.jpg" WIDTH=128 HEIGHT=99 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_18.jpg" WIDTH=88 HEIGHT=99 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_19.jpg" WIDTH=18 HEIGHT=99 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_20.jpg" WIDTH=46 HEIGHT=99 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_21.jpg" WIDTH=57 HEIGHT=99 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_22.jpg" WIDTH=10 HEIGHT=99 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_23.jpg" WIDTH=45 HEIGHT=99 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_24.jpg" WIDTH=71 HEIGHT=99 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_25.jpg" WIDTH=10 HEIGHT=99 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_26.jpg" WIDTH=75 HEIGHT=99 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_27.jpg" WIDTH=133 HEIGHT=99 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_28.jpg" WIDTH=179 HEIGHT=99 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_29.jpg" WIDTH=88 HEIGHT=99 ALT=""></TD>
<TD> </TD>
</TR>
<TR>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_31.jpg" WIDTH=52 HEIGHT=27 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_32.jpg" WIDTH=128 HEIGHT=27 ALT=""></TD>
<TD COLSPAN=9 rowspan=2><table cellspacing=0 cellpadding=0><tr><td><img ID="schlossMenu" src="themes/Odyssey/bilder/schloss.jpg" width=106 height=27 border=0 onmouseover="javascript:showLayer('schloss')" onmouseout="javascript:slowHideLayer('schloss')" />
<div ID="schlossSubMenu" style="position:relative left:175; top:21; overflow:hidden; visibility:hidden; filter:alpha(opacity=50)" onmouseover="javascript:preventHide('schloss')" onmouseout="javascript:allowHide('schloss')" >
<table cellspacing=0 cellpadding=0><tr><TD>
<IMG SRC="themes/Odyssey/bilder/header_43.jpg" WIDTH=88 HEIGHT=21 border=0 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/raeume.jpg" WIDTH=64 HEIGHT=21 border=0 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/kueche.jpg" WIDTH=57 HEIGHT=21 border=0 ALT=""></TD>
<TD COLSPAN=2>
<IMG SRC="themes/Odyssey/bilder/keller.jpg" WIDTH=54 HEIGHT=21 border=0 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/catering.jpg" WIDTH=71 HEIGHT=21 border=0 ALT=""></TD>
<TD COLSPAN=2>
<IMG SRC="themes/Odyssey/bilder/spez.jpg" WIDTH=85 HEIGHT=21 border=0 ALT=""></TD></tr></table>
</div></TD></tr></table></td>
<!-- <TD COLSPAN=3>
<IMG SRC="themes/Odyssey/bilder/restaurant.jpg" WIDTH=113 HEIGHT=27 ALT=""></TD>
<TD COLSPAN=3>
<IMG SRC="themes/Odyssey/bilder/kultur.jpg" WIDTH=126 HEIGHT=27 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/kontakt.jpg" WIDTH=75 HEIGHT=27 ALT=""></TD> -->
<TD>
<IMG SRC="themes/Odyssey/bilder/header_37.jpg" WIDTH=133 HEIGHT=27 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_38.jpg" WIDTH=179 HEIGHT=27 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_39.jpg" WIDTH=88 HEIGHT=27 ALT=""></TD>
<TD> </TD>
</TR>
<TR>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_41.jpg" WIDTH=52 HEIGHT=21 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_42.jpg" WIDTH=128 HEIGHT=21 ALT=""></TD>
<!--
<TD COLSPAN=2>
<IMG SRC="themes/Odyssey/bilder/will01.jpg" WIDTH=64 HEIGHT=21 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/will02.jpg" WIDTH=57 HEIGHT=21 ALT=""></TD>
<TD COLSPAN=2>
<IMG SRC="themes/Odyssey/bilder/will03.jpg" WIDTH=55 HEIGHT=21 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/will04.jpg" WIDTH=71 HEIGHT=21 ALT=""></TD>
<TD COLSPAN=2>
<IMG SRC="themes/Odyssey/bilder/will05.jpg" WIDTH=85 HEIGHT=21 ALT=""></TD> -->
<TD>
<IMG SRC="themes/Odyssey/bilder/header_49.jpg" WIDTH=133 HEIGHT=21 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_50.jpg" WIDTH=179 HEIGHT=21 ALT=""></TD>
<TD>
<IMG SRC="themes/Odyssey/bilder/header_51.jpg" WIDTH=88 HEIGHT=21 ALT=""></TD>
<TD> </TD>
</TR>
</TABLE><!-- Ende der Headerinhalte -->


Betreff Von Datum
Re: position:relative
wie kann ich sonst noch eine navigation realisieren, bei der ich submenus aufklappen lassen kann, außer mit javascript und kostenlos. oder ist es sinnvoll eine möglichkeit einzubauen, wenn der user...
G. Guest 30.09.2003 21:05
Re: position:relative
du verwendest js nur für die submenüs? das ist dann natürlich legitim! dachte die gesamte nav ist mit js realisiert..... sorry!<br>du solltest aber auf jeden fall noch eine alternative navigation...
Oskar Bayer 30.09.2003 22:28
Re: position:relative
hab grad gesehen du hast den code gepostet. seh ich mir bei gelegenheit mal an, vielleicht kann ich dir dann noch tipps geben....<br>
Oskar Bayer 30.09.2003 22:37
Re: position:relative
danke. hab noch zwei fragen. kann ich das java-problem umgehen wenn ich ein dhtml menü verwende? und worauf muss ich dabei achten?<br>2. wie kann ich einen zeilenumbruch von gifs verhindern ohne eine...
G. Guest 01.10.2003 11:33
Re: position:relative
1. also bei allen rollover-, ausklapp-, slidemenüs usw werden ebenen ein- und ausgeblendet oder bilder gewechselt. das kann nur mit javascript gelöst werden. spricht auch nix dagegen, wenn man eine...
Oskar Bayer 01.10.2003 12:15
Re: position:relative
Die 2 Px kommen aus dem Body Tag, das ist Styles mäßig nicht ganz richtig deklariert.<br><body style="margin-top:0; margin-left:0; margin-right:0; margin-bottom:0;"><br>So wäre es richtig, berücksichtigt...
Sven Buhk 02.10.2003 02:12

Antworten Vorsicht bei der Eingabe: Die Zeichen ' oder -- sind nicht erlaubt!

 Betreff:
 Nachricht: Den Beitrag finden Sie nun unter: http://beta.devtrain.de/foren Die Benutzerdaten und Foreninhalte von beta.devtrain.de und www.devtrain.de sind die selben.
Sie können sich dort sogar per RSS über neue Inhalte informieren lassen.
Bei Problemen bitte direkt Mail an asp [AT] ppedv.de.

 Signatur:

  



Login
Username:


Passwort:






Passwort vergessen?

Visual Studio 1 Magazin
© Copyright 2003 ppedv AG