Hallo erstmal,
unten seht ihr ein Script, welches ein Inhaltsverzeichnis vom rechten Fensterrand einschiebt und wieder zurückschiebt. Desweiteren wird es immer "nachgezogen" wenn man hoch-bzw runterscrollt.
Zum Problem:
da das Inhaltsverzeichnis von rechts nach links eingerückt wird, wird der Layer in dem es liegt zu den 100% Fensterbreite addiert, sodass unten leider ein Scrollbalken ensteht.
Ich habe versucht mit css(overflow..) im body das Problem zu lösen, jedoch leider ohne Erfolg!
Ich hoffe ihr habt die Problematik verstanden und könnt mir weiterhelfen!
Das script stammt nicht von mir, sollte dazu gesagt werden...
Am besten mal in eine html einbinden, dann sieht man das Problem direkt.
<SCRIPT language="JavaScript1.2">
<!--
NS6 = (document.getElementById&&!document.all)
IE = (document.all)
NS = (navigator.appName=="Netscape" && navigator.appVersion.charAt(0)=="4")
moving=setTimeout('null',1)
function moveOut() {
if ((NS6 && parseInt(ssm.right)<0)||(IE && ssm.style.pixelRight<0)||(NS && document.ssm.right<0)) {
clearTimeout(moving);moving = setTimeout('moveOut()', slideSpeed)
if (NS6) {ssm.right = parseInt(ssm.right)+10+"px";}
if (IE) {ssm.style.pixelRight += 10;}
if (NS) {document.ssm.right += 10;}}
else {clearTimeout(moving);moving=setTimeout('null',1)}};
function moveBack() {
clearTimeout(moving);moving = setTimeout('moveBack1()', waitTime)}
function moveBack1() {
if ((NS6 && parseInt(ssm.right)>(-menuWidth))||(IE && ssm.style.pixelRight>(-menuWidth))||(NS && document.ssm.right>(-menuWidth))) {
clearTimeout(moving);moving = setTimeout('moveBack1()', slideSpeed);
if (NS6) {ssm.right = parseInt(ssm.right)-10+"px";}
if (IE) {ssm.style.pixelRight -= 10;}
if (NS) {document.ssm.right -= 10;}}
else {clearTimeout(moving);moving=setTimeout('null',1)}};
lastY = 0;
function makeStatic() {
if (NS6) {winY = window.pageYOffset;}
if (IE) {winY = document.body.scrollTop;var NM=document.all('ssm').style}
if (NS) {winY = window.pageYOffset;var NM=document.ssm}
if (NS6||IE||NS) {
if (winY!=lastY&&winY>YOffset-staticYOffset) {
smooth = .2 * (winY - lastY - YOffset + staticYOffset);}
else if (YOffset-staticYOffset+lastY>YOffset-staticYOffset) {
smooth = .2 * (winY - lastY);}
else {smooth=0}
if(smooth > 0) smooth = Math.ceil(smooth);
else smooth = Math.floor(smooth);
if (NS6) ssm.top=parseInt(ssm.top)+smooth+"px"
if (IE) NM.pixelTop+=smooth;
if (NS) NM.top+=smooth;
lastY = lastY+smooth;
setTimeout('makeStatic()', 1)}}
function initSlide() {
if (NS6){
ssm=document.getElementById("ssm").style
ssm.visibility="visible";
ssm.right = -menuWidth -2;}
else if (IE) {
ssm.style.visibility = "visible"
ssm.style.pixelRight = -menuWidth -2;}
else if (NS) {
document.ssm.right = -menuWidth -2;
document.ssm.visibility = "show"}
if (menuIsStatic=="no") makeStatic();}
function startMenu(menuHeader, barText) {
if (IE||NS6) {document.write('<DIV ID="ssm" style="visibility:hidden;Position : Absolute ;right : 0px ;Top : '+YOffset+' ;Z-Index : 20;width:1px" onmouseover="moveOut()" onmouseout="moveBack()">')}
if (NS) {document.write('<LAYER visibility="hide" top="'+YOffset+'" name="ssm" bgcolor="'+menuBGColor+'" right="0" onmouseover="moveOut()" onmouseout="moveBack()">')}
if (NS6){document.write('<table border="0" cellpadding="0" cellspacing="0" width="'+(menuWidth+barWidth+2)+'" bgcolor="'+menuBGColor+'"><TR><TD>')}
tempBar=""
for (i=0;i<barText.length;i++) {
tempBar+=barText.substring(i, i+1)+"<BR>"}
document.write('<img src="209oben.gif" style="width:238px;height:12px;margin-left:0px;margin-bottom:0;"><table border="0" cellpadding="0" cellspacing="0" width="'+(menuWidth+barWidth+2)+'" bgcolor="'+menuBGColor+'"><tr><td align="center" rowspan="100" width="'+barWidth+'" bgcolor="'+barBGColor+'" valign="'+barVAlign+'"><p align="center"><font face="'+barFontFamily+'" Size="'+barFontSize+'" COLOR="'+barFontColor+'"><B>'+tempBar+'</B></font></p></TD><td bgcolor="#999999" WIDTH="'+(menuWidth-1)+'" HEIGHT="'+hdrHeight+'" ALIGN="'+hdrAlign+'" VALIGN="'+hdrVAlign+'"> <center><font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"><b>'+menuHeader+'</b></font></center></td></tr>')}
function addItem(text, link, target) {
document.write('<TR><TD BGCOLOR="'+linkBGColor+'" onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="'+(menuWidth-1)+'"><ILAYER><LAYER onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%" ALIGN="'+linkAlign+'"><DIV ALIGN="'+linkAlign+'"><FONT face="'+linkFontFamily+'" Size="'+linkFontSize+'"> <A HREF="'+link+'" CLASS="ssmItems" target="'+target+'">'+text+'</DIV></LAYER></ILAYER></TD></TR>')}
function addExItem(text, link, target) {
document.write('<TR id="inhalt2"><TD BGCOLOR="'+linkBGColor+'" onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="'+(menuWidth-1)+'"><ILAYER><LAYER onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%" ALIGN="'+linkAlign+'"><DIV ALIGN="'+linkAlign+'"><FONT face="'+linkFontFamily+'" Size="'+linkFontSize+'"> <A HREF="'+link+'" target="'+target+'" CLASS="ssmItems">'+text+'</DIV></LAYER></ILAYER></TD></TR>')}
function addExPic(text, link, target) {
document.write('<TR><TD cellpadding="2" BGCOLOR="'+linkBGColor+'" onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="'+(menuWidth-1)+'"><ILAYER><LAYER onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%" ALIGN="'+linkAlign+'"><DIV ALIGN="'+linkAlign+'"> <A HREF="'+link+'" target="'+target+'" CLASS="ssmItems"><img src="'+text+'" border="0"></A></DIV></LAYER></ILAYER></TD></TR>')}
function addHdr(text, link, target) {
document.write('<tr id="addhdr"><td bgcolor="#666666" onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\'#666666\'" WIDTH="'+(menuWidth-1)+'"><ILAYER><LAYER onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%" ALIGN="'+linkAlign+'"><DIV ALIGN="'+linkAlign+'"><FONT face="'+linkFontFamily+'" Size="'+linkFontSize+'"> <A HREF="'+link+'" target="'+target+'" CLASS="ssmItems">'+text+'</DIV></LAYER></ILAYER></td></tr></div>')}
function endMenu() {
document.write('</table><img src="209unten.gif" style="width:238px;height:12px;margin-left:0px;margin-top:0;">')
if (NS6){document.write('</TD></TR></TABLE>')}
if (IE||NS6) {document.write('</DIV>')}
if (NS) {document.write('</LAYER>')}
if (NS6||IE||NS) setTimeout('initSlide();', 100)}
YOffset=20;
staticYOffset=20;
slideSpeed=15;
waitTime=100;
menuBGColor="#333333";
menuIsStatic="no";
menuWidth=216;
hdrFontFamily="Verdana, Arial";
hdrFontSize="2";
hdrFontColor="#cccccc";
hdrBGColor="#666666";
hdrAlign="left";
hdrVAlign="center";
hdrHeight="1";
linkFontFamily="Verdana, Arial";
linkFontSize="2";
linkBGColor="#999999";
linkOverBGColor="#808080";
linkAlign="left";
barBGColor="#666666";
barFontFamily="Verdana, Arial";
barFontSize="2";
barFontColor="#cccccc";
barVAlign="center";
barWidth=20;
startMenu("Inhaltsverzeichnis", "INHALT");
addHdr("Hauptkapitel","","_self");
addExItem(" - Unterkapitel","","_self");
endMenu();
//-->
</SCRIPT>
unten seht ihr ein Script, welches ein Inhaltsverzeichnis vom rechten Fensterrand einschiebt und wieder zurückschiebt. Desweiteren wird es immer "nachgezogen" wenn man hoch-bzw runterscrollt.
Zum Problem:
da das Inhaltsverzeichnis von rechts nach links eingerückt wird, wird der Layer in dem es liegt zu den 100% Fensterbreite addiert, sodass unten leider ein Scrollbalken ensteht.
Ich habe versucht mit css(overflow..) im body das Problem zu lösen, jedoch leider ohne Erfolg!
Ich hoffe ihr habt die Problematik verstanden und könnt mir weiterhelfen!
Das script stammt nicht von mir, sollte dazu gesagt werden...
Am besten mal in eine html einbinden, dann sieht man das Problem direkt.
<SCRIPT language="JavaScript1.2">
<!--
NS6 = (document.getElementById&&!document.all)
IE = (document.all)
NS = (navigator.appName=="Netscape" && navigator.appVersion.charAt(0)=="4")
moving=setTimeout('null',1)
function moveOut() {
if ((NS6 && parseInt(ssm.right)<0)||(IE && ssm.style.pixelRight<0)||(NS && document.ssm.right<0)) {
clearTimeout(moving);moving = setTimeout('moveOut()', slideSpeed)
if (NS6) {ssm.right = parseInt(ssm.right)+10+"px";}
if (IE) {ssm.style.pixelRight += 10;}
if (NS) {document.ssm.right += 10;}}
else {clearTimeout(moving);moving=setTimeout('null',1)}};
function moveBack() {
clearTimeout(moving);moving = setTimeout('moveBack1()', waitTime)}
function moveBack1() {
if ((NS6 && parseInt(ssm.right)>(-menuWidth))||(IE && ssm.style.pixelRight>(-menuWidth))||(NS && document.ssm.right>(-menuWidth))) {
clearTimeout(moving);moving = setTimeout('moveBack1()', slideSpeed);
if (NS6) {ssm.right = parseInt(ssm.right)-10+"px";}
if (IE) {ssm.style.pixelRight -= 10;}
if (NS) {document.ssm.right -= 10;}}
else {clearTimeout(moving);moving=setTimeout('null',1)}};
lastY = 0;
function makeStatic() {
if (NS6) {winY = window.pageYOffset;}
if (IE) {winY = document.body.scrollTop;var NM=document.all('ssm').style}
if (NS) {winY = window.pageYOffset;var NM=document.ssm}
if (NS6||IE||NS) {
if (winY!=lastY&&winY>YOffset-staticYOffset) {
smooth = .2 * (winY - lastY - YOffset + staticYOffset);}
else if (YOffset-staticYOffset+lastY>YOffset-staticYOffset) {
smooth = .2 * (winY - lastY);}
else {smooth=0}
if(smooth > 0) smooth = Math.ceil(smooth);
else smooth = Math.floor(smooth);
if (NS6) ssm.top=parseInt(ssm.top)+smooth+"px"
if (IE) NM.pixelTop+=smooth;
if (NS) NM.top+=smooth;
lastY = lastY+smooth;
setTimeout('makeStatic()', 1)}}
function initSlide() {
if (NS6){
ssm=document.getElementById("ssm").style
ssm.visibility="visible";
ssm.right = -menuWidth -2;}
else if (IE) {
ssm.style.visibility = "visible"
ssm.style.pixelRight = -menuWidth -2;}
else if (NS) {
document.ssm.right = -menuWidth -2;
document.ssm.visibility = "show"}
if (menuIsStatic=="no") makeStatic();}
function startMenu(menuHeader, barText) {
if (IE||NS6) {document.write('<DIV ID="ssm" style="visibility:hidden;Position : Absolute ;right : 0px ;Top : '+YOffset+' ;Z-Index : 20;width:1px" onmouseover="moveOut()" onmouseout="moveBack()">')}
if (NS) {document.write('<LAYER visibility="hide" top="'+YOffset+'" name="ssm" bgcolor="'+menuBGColor+'" right="0" onmouseover="moveOut()" onmouseout="moveBack()">')}
if (NS6){document.write('<table border="0" cellpadding="0" cellspacing="0" width="'+(menuWidth+barWidth+2)+'" bgcolor="'+menuBGColor+'"><TR><TD>')}
tempBar=""
for (i=0;i<barText.length;i++) {
tempBar+=barText.substring(i, i+1)+"<BR>"}
document.write('<img src="209oben.gif" style="width:238px;height:12px;margin-left:0px;margin-bottom:0;"><table border="0" cellpadding="0" cellspacing="0" width="'+(menuWidth+barWidth+2)+'" bgcolor="'+menuBGColor+'"><tr><td align="center" rowspan="100" width="'+barWidth+'" bgcolor="'+barBGColor+'" valign="'+barVAlign+'"><p align="center"><font face="'+barFontFamily+'" Size="'+barFontSize+'" COLOR="'+barFontColor+'"><B>'+tempBar+'</B></font></p></TD><td bgcolor="#999999" WIDTH="'+(menuWidth-1)+'" HEIGHT="'+hdrHeight+'" ALIGN="'+hdrAlign+'" VALIGN="'+hdrVAlign+'"> <center><font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"><b>'+menuHeader+'</b></font></center></td></tr>')}
function addItem(text, link, target) {
document.write('<TR><TD BGCOLOR="'+linkBGColor+'" onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="'+(menuWidth-1)+'"><ILAYER><LAYER onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%" ALIGN="'+linkAlign+'"><DIV ALIGN="'+linkAlign+'"><FONT face="'+linkFontFamily+'" Size="'+linkFontSize+'"> <A HREF="'+link+'" CLASS="ssmItems" target="'+target+'">'+text+'</DIV></LAYER></ILAYER></TD></TR>')}
function addExItem(text, link, target) {
document.write('<TR id="inhalt2"><TD BGCOLOR="'+linkBGColor+'" onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="'+(menuWidth-1)+'"><ILAYER><LAYER onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%" ALIGN="'+linkAlign+'"><DIV ALIGN="'+linkAlign+'"><FONT face="'+linkFontFamily+'" Size="'+linkFontSize+'"> <A HREF="'+link+'" target="'+target+'" CLASS="ssmItems">'+text+'</DIV></LAYER></ILAYER></TD></TR>')}
function addExPic(text, link, target) {
document.write('<TR><TD cellpadding="2" BGCOLOR="'+linkBGColor+'" onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="'+(menuWidth-1)+'"><ILAYER><LAYER onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%" ALIGN="'+linkAlign+'"><DIV ALIGN="'+linkAlign+'"> <A HREF="'+link+'" target="'+target+'" CLASS="ssmItems"><img src="'+text+'" border="0"></A></DIV></LAYER></ILAYER></TD></TR>')}
function addHdr(text, link, target) {
document.write('<tr id="addhdr"><td bgcolor="#666666" onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\'#666666\'" WIDTH="'+(menuWidth-1)+'"><ILAYER><LAYER onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%" ALIGN="'+linkAlign+'"><DIV ALIGN="'+linkAlign+'"><FONT face="'+linkFontFamily+'" Size="'+linkFontSize+'"> <A HREF="'+link+'" target="'+target+'" CLASS="ssmItems">'+text+'</DIV></LAYER></ILAYER></td></tr></div>')}
function endMenu() {
document.write('</table><img src="209unten.gif" style="width:238px;height:12px;margin-left:0px;margin-top:0;">')
if (NS6){document.write('</TD></TR></TABLE>')}
if (IE||NS6) {document.write('</DIV>')}
if (NS) {document.write('</LAYER>')}
if (NS6||IE||NS) setTimeout('initSlide();', 100)}
YOffset=20;
staticYOffset=20;
slideSpeed=15;
waitTime=100;
menuBGColor="#333333";
menuIsStatic="no";
menuWidth=216;
hdrFontFamily="Verdana, Arial";
hdrFontSize="2";
hdrFontColor="#cccccc";
hdrBGColor="#666666";
hdrAlign="left";
hdrVAlign="center";
hdrHeight="1";
linkFontFamily="Verdana, Arial";
linkFontSize="2";
linkBGColor="#999999";
linkOverBGColor="#808080";
linkAlign="left";
barBGColor="#666666";
barFontFamily="Verdana, Arial";
barFontSize="2";
barFontColor="#cccccc";
barVAlign="center";
barWidth=20;
startMenu("Inhaltsverzeichnis", "INHALT");
addHdr("Hauptkapitel","","_self");
addExItem(" - Unterkapitel","","_self");
endMenu();
//-->
</SCRIPT>