Menü soll nachrücken

d4k4

Erfahrenes Mitglied
Also ich hab eine Seite die horizontal durch Anker gesteuert wird. Oben drüben sind dann auf der Startseite die Links zu den Ankern. Nur wenn ich jetzt einen Anker anspreche und zu dem Punkt springe, fehlt mir ja oben das Menü. Ich weiß das es eine Möglichkeit gibt etwas mit JS "mitzurücken". Kann mir da wer weiterhelfen?
 
Schonmal im DHTML-Kapitel von SelfHTML geblättert?

Wenn dir das zu zeitaufwändig ist, dann streng doch mal eine Suchmaschine deiner Wahl an, dort wird auf einem der JavaScript-Archive sicherlich was zu finden sein.

Geist
 
ok
ich dacht nur jemand könnt da ein bissl code posten. aber scheint ja doch aufwendiger zu sein.
 
Zuletzt bearbeitet:
so hab was gefunden und für meine Bedürfnisse umgeschrieben. Nur unter Netscape scheint es nicht zu funktionieren.

PHP:
<html>
<head>
<title>title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel=stylesheet type="text/css" href="t1000.css" />
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
</head>

<body style="overflow:hidden;">
<div id="Layer1" style="position:absolute; left:1012px; top:41px; width:396px; height:97px; z-index:1; background-color: #CCCCCC; layer-background-color: #CCCCCC; border: 1px none #000000;"> 
  <p align="left" style="padding-left: 12px;" ><font color="#FF0000" size="3"> 
    Produktidee / Produktentwicklung</font><br /><br />Die Produktidee nimmt durch die 
    Hand des Konstrukteurs im 3D-CAD-System erste Gestalt an. Das Datenmodell 
    bildet die Grundlage des Produktes und begleitet seinen Werdegang durch alle 
    Entstehungsphasen.</p>
  </div>
<div id="Layer3" style="position:absolute; left:1411px; top:43px; width:300px; height:300px; z-index:3; background-color: #CCCCCC; layer-background-color: #CCCCCC; border: 1px none #000000;"><img src="Bilder/4.4.jpg" width="150" height="150" /><img src="Bilder/4.5.jpg" width="150" height="150" /><img src="Bilder/4.6.jpg" width="150" height="150" /><img src="Bilder/4.7.jpg" width="150" height="150" /></div>
<font size="2">
<div id="Layer2" style="position:absolute; left:2010px; top:18px; width:38px; height:32px; z-index:2"><a name="Entwicklung" id="Entwicklung"></a></div>
<table width="3120" height="340" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td></td>
  </tr>
  <tr>
    <span ID="slide"><td height="10" bgcolor="#666666">
      <p class="ueber"><a href="#Entwicklung">Entwicklung </a> - <a href="#produkt">Produktion</a> 
        - <a href="#unter">Unternehmen</a></p>
      </td></span>
  </tr>
  <tr>
    <td height="10" background="back.gif"></td>
  </tr>
  <tr>
    <td height="300" background="Bilder/back.gif"><a name="Tech" id="Tech"></a> 
    </td>
  </tr>
  <tr>
    <td height="10" bgcolor="#666666">&nbsp;</td>
  </tr>
  <tr>
    <td height="10">&nbsp;</td>
  </tr>
</table>
</font>

<script LANGUAGE="JavaScript"> 
self.onError=null; 
currentX = currentY = 0; 
whichIt = null; 
lastScrollX = 0; lastScrollY = 0; 
NS = (document.layers) ? 1 : 0; 
IE = (document.all) ? 1: 0; 

function heartBeat() { 

if(IE) { diffY = self.pageYOffset; diffX = document.body.scrollLeft; }
if(NS) { diffY = self.pageYOffset; diffX = self.pageXOffset; } 

if(diffY != lastScrollY) { 
percent = .1 * (diffY - lastScrollY); 
if(percent > 0) percent = Math.ceil(percent); 
else percent = Math.floor(percent); 
if(IE) document.all.slide.style.pixelTop += percent; 
if(NS) document.slide.top += percent; 
lastScrollY = lastScrollY + percent; 
} 
if(diffX != lastScrollX) { 
percent = .1 * (diffX - lastScrollX); 
if(percent > 0) percent = Math.ceil(percent); 
else percent = Math.floor(percent); 
if(IE) document.all.slide.style.pixelLeft += percent; 
if(NS) document.slide.left += percent; 
lastScrollX = lastScrollX + percent; 
} 
} 

function checkFocus(x,y) { 
var totalY, totalX; 
floatx = document.slide.pageX; 
floaty = document.slide.pageY; 
floatwidth = document.slide.clip.width; 
floatheight = document.slide.clip.height; 

if(0 == 0) totalY = floatheight; 
else totalY = 0; 
if(0 == 0) totalX = floatwidth; 
else totalX = 0; 
if( (x > floatx && x < (floatx+totalX)) && (y > floaty && y < (floaty+totalY))) return true; 
else return false; 
} 

function grabIt(e) { 
if(IE) { 
whichIt = event.srcElement; 
while (whichIt.id.indexOf("slide") == -1) { 
whichIt = whichIt.parentElement; 
if (whichIt == null) { return true; } 
} 
whichIt.style.pixelLeft = whichIt.offsetLeft; 
whichIt.style.pixelTop = whichIt.offsetTop; 
currentX = (event.clientX + document.body.scrollLeft); 
currentY = (event.clientY + document.body.scrollTop); 

if(0 == 0) totalY = whichIt.style.pixelHeight; 
else totalY = 0; 
if(0 == 0) totalX = whichIt.style.pixelWidth; 
else totalX = 0; 
if(!(event.clientX > whichIt.offsetLeft && event.clientX < whichIt.offsetLeft + totalX) || 
!(currentY > whichIt.offsetTop && currentY < whichIt.offsetTop + totalY)) whichIt = null; 
} else { 
window.captureEvents(Event.MOUSEMOVE); 
if(checkFocus (e.pageX,e.pageY)) { 
whichIt = document.slide; 
FloatTouchedX = e.pageX-document.slide.pageX; 
FloatTouchedY = e.pageY-document.slide.pageY; 
} 
} 
return true; 
} 

function moveIt(e) { 
if (whichIt == null) { return false; } 
if(IE) { 
newX = (event.clientX + document.body.scrollLeft); 
newY = (event.clientY + document.body.scrollTop); 
distanceX = (newX - currentX); distanceY = (newY - currentY); 
currentX = newX; currentY = newY; 
whichIt.style.pixelLeft += distanceX; 
whichIt.style.pixelTop += distanceY; 
if(whichIt.style.pixelTop < document.body.scrollTop) whichIt.style.pixelTop = document.body.scrollTop; 
if(whichIt.style.pixelLeft < document.body.scrollLeft) whichIt.style.pixelLeft = document.body.scrollLeft; 
if(whichIt.style.pixelLeft > document.body.offsetWidth - document.body.scrollLeft - whichIt.style.pixelWidth - 0) whichIt.style.pixelLeft = document.body.offsetWidth - whichIt.style.pixelWidth - 0; 
if(whichIt.style.pixelTop > document.body.offsetHeight + document.body.scrollTop - whichIt.style.pixelHeight - 0) whichIt.style.pixelTop = document.body.offsetHeight + document.body.scrollTop - whichIt.style.pixelHeight - 0; 
event.returnValue = false; 
} else { 
whichIt.moveTo(e.pageX-FloatTouchedX,e.pageY-FloatTouchedY); 
if(whichIt.left < 0+self.pageXOffset) whichIt.left = 0+self.pageXOffset; 
if(whichIt.top < 0+self.pageYOffset) whichIt.top = 0+self.pageYOffset; 
if( (whichIt.left + whichIt.clip.width) >= (window.innerWidth+self.pageXOffset-0)) whichIt.left = ((window.innerWidth+self.pageXOffset)-whichIt.clip.width)-0; 
if( (whichIt.top + whichIt.clip.height) >= (window.innerHeight+self.pageYOffset-0)) whichIt.top = ((window.innerHeight+self.pageYOffset)-whichIt.clip.height)-0; 
return false; 
} 
return false; 
} 

function dropIt() { 
whichIt = null; 
if(NS) window.releaseEvents (Event.MOUSEMOVE); 
return true; 
} 

if(NS) { 
window.captureEvents(Event.MOUSEUP|Event.MOUSEDOWN); 
window.onmousedown = grabIt; 
window.onmousemove = moveIt; 
window.onmouseup = dropIt; 
} 
if(IE) { 
document.onmousedown = grabIt; 
document.onmousemove = moveIt; 
document.onmouseup = dropIt; 
} 

if(NS || IE) action = window.setInterval("heartBeat()",1); 
</script>


</body>
</html>
 
Zurück