// Tim Reeves JavaScript for 94% / fixed height, Stand 2011-03-14 // with xml-compliant code to insert an img node for the counter // FAUSTREGEL: READ an attribute and SET a style (with a text string) !!! // CONFIG (these values used both in 94% and fixed height) var intMinSiteWidth = window.g_minSiteWidth; var intMinSiteHeight = window.g_minSiteHeight; // END CONFIG // Recognise IE 6 - 9 var isIE = false, isIE6 = false, isIE7 = false, isIE8 = false, isIE9 = false; function getElemId(ident) { var Elem; if (document.getElementById) { // DOM; IE5, NS6, Mozilla, Opera if (typeof document.getElementById(ident) == "object") Elem = document.getElementById(ident); else Elem = void(0); } else if (document.all) { // Proprietary DOM; IE4 if (typeof document.all[ident] == "object") Elem = document.all[ident]; else Elem = void(0); } else if (document[ident]) { //Netscape alternative Elem = document[ident]; } else Elem = void(0); return(Elem); } function neuAufbau() { var objHtml = getElemId(window.g_htmlTagId); var objBody = getElemId('mybody'); var objSite = getElemId('website'); var objMain = getElemId('main'); var objKopf = getElemId('kopf'); var objFuss = getElemId('fuss'); var objHeader = getElemId('header'); var objFooter = getElemId('footer'); // 1: IE6 stupidly reduces the size of the element... if (isIE6) { objBody.style.height = objHtml.clientHeight + 'px'; objBody.style.width = objHtml.clientWidth + 'px'; } // 2: For div.website height 100% most browsers take objBody.offsetHeight // But we must modify this to objBody.clientHeight - or the min-height // This also cures the "old browser" problem of min-height not obeyed. var currViewHeight = objBody.clientHeight; var currSiteHeight = objSite.offsetHeight; var useHeight = (currViewHeight > intMinSiteHeight) ? currViewHeight : intMinSiteHeight; if (currSiteHeight != useHeight) { objSite.style.height = useHeight + 'px'; currSiteHeight = useHeight; } // 2b: Same game for div.website width var currViewWidth = objBody.clientWidth; var currSiteWidth = objSite.offsetWidth; var useWidth = (currViewWidth > intMinSiteWidth) ? currViewWidth : intMinSiteWidth; if (currSiteWidth != useWidth) { objSite.style.width = useWidth + 'px'; currSiteWidth = useWidth; } if (objHeader && objHeader.offsetHeight == 0) { // FIXED HEIGHT: The header is present but set to display:none if (window.g_vertCentering) { // Perform vertical centering. // Degrading mode has a top margin on div.main // Just overwrite that with (browser - main) / 2 (but not less than zero) var intMainHeight = objMain.offsetHeight; if (intMainHeight+1 < currSiteHeight) { var intMainTopMargin = Math.floor( (currSiteHeight - intMainHeight) / 2 ); } else { var intMainTopMargin = 0; } objMain.style.marginTop = intMainTopMargin + 'px'; // Report back to Server via XHR ajaxWindowSize('mainTopMargin', intMainTopMargin + ''); } } // fixed else { // 94% HEIGHT (or 97% if header is not present) // 3: Feature-Workaround - WebKit and IE8 calculate %-heights // to nearest enclosing Fixed height (NOT % height) (here: Viewport). // W3C: "Percentage intrinsic heights are evaluated with respect to // the containing block's height, if that height is specified // explicitly," - open to interpretation if percent is explicit. // Avoid rounding errors which may lead to

being too short or long // Correct rounding up on Header/Footer to rounding down (e.g. for IE7) // Since browsers differ a lot simply ALWAYS do it ourselves !!! // offsetHeight is the height including any margins, padding and borders var intMainHeight = objMain.offsetHeight; // Should be 94% of 'website' var intAvailForHdrFtr3pc = Math.floor( currSiteHeight * 0.03 ); var intAvailForMainBySubtractAvailHdrFtr = (objHeader) ? currSiteHeight - (2 * intAvailForHdrFtr3pc) : currSiteHeight - intAvailForHdrFtr3pc; var intCurrFooter = objFooter.offsetHeight, intCurrHeader = 0; if (objHeader) intCurrHeader = objHeader.offsetHeight; /*alert('availHdrFtr3pc=' + intAvailForHdrFtr3pc + ', currHeader=' + intCurrHeader + ', currFooter=' + intCurrFooter); alert('siteHeight=' + currSiteHeight + ', mainHeight=' + intMainHeight + ', AMBSAHF=' + intAvailForMainBySubtractAvailHdrFtr );*/ if (intCurrHeader > 0 && intCurrHeader != intAvailForHdrFtr3pc) { objHeader.style.height = intAvailForHdrFtr3pc + 'px'; } if (intCurrFooter != intAvailForHdrFtr3pc) { objFooter.style.height = intAvailForHdrFtr3pc + 'px'; } if (intMainHeight != intAvailForMainBySubtractAvailHdrFtr) { intMainHeight = intAvailForMainBySubtractAvailHdrFtr; objMain.style.height = intMainHeight + 'px'; } // 4: Set content scroller height // var objExtra = getElemId('extra'); var intKopfHeight = objKopf.offsetHeight; var intFussHeight = objFuss ? objFuss.offsetHeight : 0; var intScrollerHeight = intMainHeight - intKopfHeight - intFussHeight; if (intScrollerHeight < 0) intScrollerHeight = 0; // alert(intMainHeight + ' / ' + intKopfHeight + ' / ' + intFussHeight + ' / ' + intScrollerHeight); var objScroller = getElemId('scroller'); objScroller.style.height = intScrollerHeight + 'px'; // 5: Report back to Server via XHR var strVarSizeValues = intAvailForHdrFtr3pc + '-' + intMainHeight + '-' + intScrollerHeight; ajaxWindowSize('varSizeValues', strVarSizeValues); } // 94% // 5: IE fixes - sigh... if (isIE6) { // alert('IE6'); // Add any IE6 fix here } if (isIE7) { // alert('IE7'); // Add any IE7 fix here } return; } // This is called by the onload-event of every page function startUp(testforjavascript) { window.g_reportWindowSize = testforjavascript; // Recognise IE versions (store in global variables) if (navigator.appName.indexOf('Microsoft') >= 0) { var ua = navigator.userAgent.toLowerCase(); // alert(ua); isIE = true; // Test ua for higher versions first - may contain lower as compatible if (ua.indexOf('msie 9') != -1) isIE9 = true; else if (ua.indexOf('msie 8') != -1) isIE8 = true; else if (ua.indexOf('msie 7') != -1) isIE7 = true; else if (ua.indexOf('msie 6') != -1) isIE6 = true; } // First we deal with the client height topic var objMain = getElemId('main'); if (objMain != null && typeof objMain.clientHeight == 'number') { if (isIE6) { // IE6 has some crazy css styles for degrading mode; reset them var objHtml = getElemId('myhtml'); if (!objHtml) objHtml = getElemId('plmwide'); var objBody = getElemId('mybody'); var objSite = getElemId('website'); objHtml.style.overflow = 'hidden'; objBody.style.overflow = 'auto'; objBody.style.height = '100%'; objBody.style.width = '100%'; objSite.style.width = '100%'; } neuAufbau(); // IE6+7 benötigen einen 2. Aufruf für die richtige Höhe von div.scroller if (isIE6 || isIE7) neuAufbau(); window.onresize = neuAufbau; } // Perform the ajax-based test for JavaScript if (testforjavascript) { ajaxStartUp(); } // Look if the page contains an Email-Adress if (getElemId('email1')) { ajaxOnload(); } // Note initial website entry var re = new RegExp('^' + window.g_win_name, ''); if (! re.test(window.name)) { // It IS the initial website entry - set the window name // alert('Setting window.name to: ' + window.g_win_name); window.name = window.g_win_name; // And do whatever else you may need ... } // Caveat: Since hardly any site sets the window name, it tends to stay this way // meaning that subsequent visits - even hours later - are not noted // Display the font size selection elements if (typeof setUserOptions == 'function') setUserOptions(); // Zeige "Nach oben" wenn die Seite diesen Absatz enthält var objNachOben = getElemId('nachoben'); if (objNachOben != null) objNachOben.style.display = 'block'; // Preload onmouseover images to prevent initial response lag if (window.g_preload) { var bi = new Array; for (l=0; l'; } } function ignoreevent(e) { } // 2: http://blogs.korzh.com/progtips/2008/05/28/absolute-coordinates-of-dom-element-within-document.html // Many thanks to Sergiy Khorz ! function __getIEVersion() { var rv = -1; // Return value assumes failure. if (navigator.appName == 'Microsoft Internet Explorer') { var ua = navigator.userAgent; var re = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})"); if (re.exec(ua) != null) rv = parseFloat(RegExp.$1); } return rv; } function __getOperaVersion() { var rv = 0; // Default value if (window.opera) { var sver = window.opera.version(); rv = parseFloat(sver); } return rv; } var __userAgent = navigator.userAgent; var __isIE = navigator.appVersion.match(/MSIE/) != null; var __IEVersion = __getIEVersion(); var __isIENew = __isIE && __IEVersion >= 8; var __isIEOld = __isIE && !__isIENew; var __isFireFox = __userAgent.match(/firefox/i) != null; var __isFireFoxOld = __isFireFox && ((__userAgent.match(/firefox\/2./i) != null) || (__userAgent.match(/firefox\/1./i) != null)); var __isFireFoxNew = __isFireFox && !__isFireFoxOld; var __isWebKit = navigator.appVersion.match(/WebKit/) != null; var __isChrome = navigator.appVersion.match(/Chrome/) != null; var __isOpera = window.opera != null; var __operaVersion = __getOperaVersion(); var __isOperaOld = __isOpera && (__operaVersion < 10); function __parseBorderWidth(width) { var res = 0; if (typeof(width) == "string" && width != null && width != "" ) { var p = width.indexOf("px"); if (p >= 0) { res = parseInt(width.substring(0, p)); } else { //do not know how to calculate other values (such as 0.5em or 0.1cm) correctly now //so just set the width to 1 pixel res = 1; } } return res; } //returns border width for some element function __getBorderWidth(element) { var res = new Object(); res.left = 0; res.top = 0; res.right = 0; res.bottom = 0; if (window.getComputedStyle) { //for Firefox var elStyle = window.getComputedStyle(element, null); res.left = parseInt(elStyle.borderLeftWidth.slice(0, -2)); res.top = parseInt(elStyle.borderTopWidth.slice(0, -2)); res.right = parseInt(elStyle.borderRightWidth.slice(0, -2)); res.bottom = parseInt(elStyle.borderBottomWidth.slice(0, -2)); } else { //for other browsers res.left = __parseBorderWidth(element.style.borderLeftWidth); res.top = __parseBorderWidth(element.style.borderTopWidth); res.right = __parseBorderWidth(element.style.borderRightWidth); res.bottom = __parseBorderWidth(element.style.borderBottomWidth); } return res; } //returns the absolute position of some element within document function getElementAbsolutePos(elemID) { var element; if (typeof(elemID) == "string") { element = document.getElementById(elemID); } else { element = elemID; } var res = new Object(); res.x = 0; res.y = 0; if (element !== null) { if (__isIENew) { res.x = element.scrollLeft; res.y = element.scrollTop; } else { res.x = element.offsetLeft; res.y = element.offsetTop; } var offsetParent = element.offsetParent; var parentNode = element.parentNode; var borderWidth = null; while (offsetParent != null) { res.x += offsetParent.offsetLeft; res.y += offsetParent.offsetTop; var parentTagName = offsetParent.tagName.toLowerCase(); if ((__isIEOld && parentTagName != "table") || (__isFireFoxNew && parentTagName == "td")) { borderWidth = __getBorderWidth(offsetParent); res.x += borderWidth.left; res.y += borderWidth.top; } if (offsetParent != document.body && offsetParent != document.documentElement) { res.x -= offsetParent.scrollLeft; res.y -= offsetParent.scrollTop; } //next lines are necessary to support FireFox problem with offsetParent if (!__isIE && !__isOperaOld || __isIENew) { while (offsetParent != parentNode && parentNode !== null) { res.x -= parentNode.scrollLeft; res.y -= parentNode.scrollTop; if (__isFireFoxOld && __isWebKit) { borderWidth = __getBorderWidth(parentNode); res.x += borderWidth.left; res.y += borderWidth.top; } parentNode = parentNode.parentNode; } } parentNode = offsetParent.parentNode; offsetParent = offsetParent.offsetParent; } } return res; } // 3. My code function findMenuPos(obj) { // Internal function - find position of obj (a menu ) relative to viewport // This is simple and it only works when no scrolling involved - ok for menu var res = new Object(); res.x = 0; res.y = 0; if (obj.offsetParent) { res.x = obj.offsetLeft; res.y = obj.offsetTop; var isLink = (obj.tagName == 'A'); while (obj = obj.offsetParent) { if (isLink && obj.tagName == 'TABLE') { // Only IE5 / IE6 have a table, they miss counting an LI Element // alert('TABLE class:' + obj.className + // ' offsetLeft: ' + obj.parentElement.parentElement.offsetLeft + // ' offsetTop: ' + obj.parentElement.parentElement.offsetTop); res.x += obj.parentElement.parentElement.offsetLeft; res.y += obj.parentElement.parentElement.offsetTop; } else { // alert(obj.tagName + ' id:' + obj.id + ' class:' + obj.className + // ' offsetLeft: ' + obj.offsetLeft + ' offsetTop: ' + obj.offsetTop); res.x += obj.offsetLeft; res.y += obj.offsetTop; } } } return res; } var currentflyoutsublevel = 0; var currentTimerHandle = null; function showtip(currobj, sublevel, addleft, addtop, text) { // External function. At onmouseout text is the empty string. // Called at onmouseover / onmouseout to display / hide a tooltip // alert(currobj.tagName + ' ' + currobj.id + ' ' + currobj.className + ' ' + sublevel); // If sublevel == 0 then position tip below mousecursor - but move // left if need be for whole tip to be in window (extra-menu). // Otherwise sublevel => 1 / 2 / 3 for main menu level, and // offsets refer to the top left corner of the menu item. if (sublevel == 0) { showtipwork(null, addleft, addtop, text); } else { if (sublevel < currentflyoutsublevel) return; currentflyoutsublevel = (text == '') ? sublevel - 1 : sublevel; showtipwork(currobj, addleft, addtop, text); } return true; } function displaytip() { // Internal function - called via timer var tip = getElemId('fotooltip'); tip.style.display = 'block'; currentTimerHandle = null; return true; } function showtipwork(currobj, addleft, addtop, text) { // Internal function - do the actual work of displaying / hiding a tooltip // If currobj is null then under cursor (and shifted left if need be to fit // on the page); otherwise at (addleft, addtop) in respect of the DOM 'currobj'. if (currobj == null) { // Tip under cursor if (!window.g_otherTooltips) return; } else { // In relation to a particular DOM object (main menu item) if (!window.g_mainTooltips) return; } var tip = getElemId('fotooltip'); if (text == '') { // Clear any timer and hide the tooltip if (currentTimerHandle != null) { window.clearTimeout(currentTimerHandle); currentTimerHandle = null; } tip.style.display = 'none'; return true; } // Put the new text into the tip (we need its new length) if (tip.innerHTML) tip.innerHTML = text; // Allows , etc. in Tooltips else tip.firstChild.data = text; // Get the position for the top left corner of the tip if (currobj == null) { // Under cursor window.tipAddleft = addleft; window.tipAddtop = addtop; document.onmousemove = getmouseposition; } else { // In relation to a particular DOM object (main menu item) document.onmousemove = ignoreevent; if (currobj.id != '' && currobj.id.indexOf('flow') == 0) var objpos = findMenuPos(currobj); // main menu item else var objpos = getElementAbsolutePos(currobj); // any item // alert(objpos.x + ' ' + objpos.y); // Set up the tooltip position and content tip.style.left = (objpos.x + addleft) + 'px'; tip.style.top = (objpos.y + addtop) + 'px'; } // Have it displayed after a delay of 600ms currentTimerHandle = window.setTimeout('displaytip()', 600); return true; } function tipflow(sublevel, addleft, addtop, text, ti, blnUp) { // External function - like showtip() but also handle color flow if (sublevel < currentflyoutsublevel) return; currentflyoutsublevel = (text == '') ? sublevel - 1 : sublevel; var obj = getElemId('flow' + ti); showtipwork(obj, addleft, addtop, text); if (!window.g_loading) { // alert('flow ' + ti + ' ' + cssclass); if (blnUp) flowupmenu(ti); else flowdownmenu(ti); } return true; } // END Code for custom tooltips // Sweet little routines to scroll the page to the top or bottom function pgtop(elem) { var obj = getElemId(elem); if (obj && typeof(obj.scrollTop) == 'number') obj.scrollTop = 0; else window.location.href = window.location.href; return; } function pgbot(elem) { var obj = getElemId(elem); if (obj && typeof(obj.scrollTop) == 'number') obj.scrollTop = obj.scrollHeight; return; }