var panelWidth = 150; // Width of help panel var slideSpeed = 15; // Higher = quicker slide var slideTimer = 10; // Lower = quicker slide var slideActive = true; // Slide active ? var initBodyMargin = 0; // Left or top margin of your tag (left if panel is at the left, top if panel is on the top) var pushMainContentOnSlide = false; // Push your main content to the right when sliding var panelPosition = 1; // 0 = left , 1 = top /* Don't change these values */ var slidehelpPanelObj=false; var slideInProgress = false; var startScrollPos = false; var panelVisible = false; function initSlideHelpPanel(expandOnly) { window.scrollTo(0,0); if(slideInProgress)return; if(!slidehelpPanelObj){ if(document.getElementById('helpPanel')){ // Object exists in HTML code? slidehelpPanelObj = document.getElementById('helpPanel'); if(panelPosition == 1)slidehelpPanelObj.style.width = '100%'; }else{ // Object doesn't exist -> Create
dynamically slidehelpPanelObj = document.createElement('DIV'); slidehelpPanelObj.id = 'helpPanel'; slidehelpPanelObj.style.display='none'; document.body.appendChild(slidehelpPanelObj); } if(panelPosition == 1){ slidehelpPanelObj.style.top = "-" + panelWidth + 'px'; slidehelpPanelObj.style.left = '0px'; slidehelpPanelObj.style.height = panelWidth + 'px'; }else{ slidehelpPanelObj.style.left = "-" + panelWidth + 'px'; slidehelpPanelObj.style.top = '0px'; slidehelpPanelObj.style.width = panelWidth + 'px'; } if(!document.all || navigator.userAgent.indexOf('Opera')>=0)slidehelpPanelObj.style.position = 'fixed';; } if(panelPosition == 0){ if(document.documentElement.clientHeight){ slidehelpPanelObj.style.height = document.documentElement.clientHeight + 'px'; }else if(document.body.clientHeight){ slidehelpPanelObj.style.height = document.body.clientHeight + 'px'; } var leftPos = slidehelpPanelObj.style.left.replace(/[^0-9\-]/g,'')/1; }else{ if(document.documentElement.clientWidth){ slidehelpPanelObj.style.width = document.documentElement.clientWidth + 'px'; }else if(document.body.clientHeight){ slidehelpPanelObj.style.width = document.body.clientWidth + 'px'; } var leftPos = slidehelpPanelObj.style.top.replace(/[^0-9\-]/g,'')/1; } slidehelpPanelObj.style.display='block'; if(panelPosition==1) startScrollPos = Math.max(document.body.scrollTop,document.documentElement.scrollTop); else startScrollPos = Math.max(document.body.scrollLeft,document.documentElement.scrollLeft); if(leftPos<(0+startScrollPos)){ if(slideActive){ slidehelpPanel(slideSpeed); }else{ document.body.style.marginLeft = panelWidth + 'px'; slidehelpPanelObj.style.left = '0px'; } }else{ if(expandOnly)return; if(slideActive){ slidehelpPanel(slideSpeed*-1); }else{ if(panelPosition == 0){ if(pushMainContentOnSlide)document.body.style.marginLeft = initBodyMargin + 'px'; slidehelpPanelObj.style.left = (panelWidth*-1) + 'px'; }else{ if(pushMainContentOnSlide)document.body.style.marginTop = initBodyMargin + 'px'; slidehelpPanelObj.style.top = (panelWidth*-1) + 'px'; } } } if(navigator.userAgent.indexOf('MSIE')>=0 && navigator.userAgent.indexOf('Opera')<0){ window.onscroll = repositionHelpDiv; repositionHelpDiv(); } window.onresize = resizehelpPanel; } function resizehelpPanel() { if(panelPosition == 0){ if(document.documentElement.clientHeight){ slidehelpPanelObj.style.height = document.documentElement.clientHeight + 'px'; }else if(document.body.clientHeight){ slidehelpPanelObj.style.height = document.body.clientHeight + 'px'; } }else{ if(document.documentElement.clientWidth){ slidehelpPanelObj.style.width = document.documentElement.clientWidth + 'px'; }else if(document.body.clientWidth){ slidehelpPanelObj.style.width = document.body.clientWidth + 'px'; } } } function slidehelpPanel(slideSpeed){ slideInProgress =true; var scrollValue = 0; if(panelPosition==1) var leftPos = slidehelpPanelObj.style.top.replace(/[^0-9\-]/g,'')/1; else var leftPos = slidehelpPanelObj.style.left.replace(/[^0-9\-]/g,'')/1; leftPos+=slideSpeed; okToSlide = true; if(slideSpeed<0){ if(leftPos < ((panelWidth*-1) + startScrollPos)){ leftPos = (panelWidth*-1) + startScrollPos; okToSlide=false; } } if(slideSpeed>0){ if(leftPos > (0 + startScrollPos)){ leftPos = 0 + startScrollPos; okToSlide = false; } } if(panelPosition==0){ slidehelpPanelObj.style.left = leftPos + startScrollPos + 'px'; if(pushMainContentOnSlide)document.body.style.marginLeft = leftPos - startScrollPos + panelWidth + 'px'; }else{ slidehelpPanelObj.style.top = leftPos + 'px'; if(pushMainContentOnSlide)document.body.style.marginTop = leftPos - startScrollPos + panelWidth + 'px'; } if(okToSlide)setTimeout('slidehelpPanel(' + slideSpeed + ')',slideTimer); else { slideInProgress = false; if(slideSpeed>0)panelVisible=true; else panelVisible = false; } } function repositionHelpDiv() { if(panelPosition==0){ var maxValue = Math.max(document.body.scrollTop,document.documentElement.scrollTop); slidehelpPanelObj.style.top = maxValue; }else{ var maxValue = Math.max(document.body.scrollLeft,document.documentElement.scrollLeft); slidehelpPanelObj.style.left = maxValue; var maxTop = Math.max(document.body.scrollTop,document.documentElement.scrollTop); if(!slideInProgress)slidehelpPanelObj.style.top = (maxTop - (panelVisible?0:panelWidth)) + 'px'; } } function cancelEvent() { return false; } function keyboardShowhelpPanel() { initSlideHelpPanel(); return false; } function helpPanelKeyboardEvent(e) { if(document.all)return; if(e.keyCode==112){ initSlideHelpPanel(); return false; } } function sethelpPanelContent(text) { document.getElementById('helpPanelContent').innerHTML = text; initSlideHelpPanel(true); } if(!document.all)document.documentElement.onkeypress = helpPanelKeyboardEvent; document.documentElement.onhelp = keyboardShowhelpPanel;