and library.js (i think this is problematic, because i've extracted from it to maintain my tabs functional)
Code:
function getObject(elementId)
{ if (document.getElementById) { return document.getElementById(elementId); }
else if (document.all) { return document.all[elementId]; }
else if (document.layers) { return document.layers[elementId]; }
}
function getObjectsByTagAndClass(tag, cls)
{ var array = document.getElementsByTagName(tag);
var output = new Array();
var matches = 0;
for(var i=0;i<array.length;i++) { var parts = array[i].className.split(' ');
for(var j=0;j<parts.length;j++) { if(parts[j]==cls) { output[matches++]=array[i]; } } } return output;
}
function getObjectsOfElementByTagAndClass(object, tag, cls, id)
{ var output = new Array();
if(object) { var array = object.getElementsByTagName(tag); var matches = 0;
if (array != undefined && array != null) { for(var i=0;i<array.length;i++) { var parts = array[i].className.split(' ');
for(var j=0;j<parts.length;j++) { if(parts[j]==cls) { if(id) { if (array[i].id.indexOf(id) == 0) { output[matches++]=array[i]; } }
else { output[matches++]=array[i]; } } } } } } return output; }
function getBrowserWidth()
{ if(window.innerWidth) return window.innerWidth;
else if(document.body.clientWidth) return document.body.clientWidth;
else return -1; }
function getBrowserHeight()
{ return (window.innerHeight?window.innerHeight:document.documentElement.clientHeight); }
function getBodyHeight()
{ if(document.body.clientHeight) return document.body.clientHeight; else return -1; }
function getObjectHeight(i)
{ return i.offsetHeight; } function uLS() { document.write("<!"+"--"); }
function gWPFEV()
{ return 0; }
var isLibraryLoaded = true; var isDebug = false;
window.onload = loadPage;
var useCdn = false;
var cdnServer = '';
var KPF=null; function KP(o){ var k = GKBH(o); if(k==13||k==32) { eval(KPF); return false; } return k; }
function MNFocus(which) {
if(null==which)which='q'; var o=getObject(which); if(null!=o)o.focus(); } var currentTabGroup = 0; var currentTabIndex = 0; var activeTabIndeces = new Array(); var activeTabTimers = new Array();
function activateTab(tabGroup,index){ clearTimeout(activeTabTimers[tabGroup]); currentTabGroup = tabGroup; currentTabIndex = index; if(activeTabIndeces.length <= tabGroup){ activeTabIndeces[tabGroup] = 0;
}
var activeTabIndex = activeTabIndeces[tabGroup]; if(index != activeTabIndex) { activeTabTimers[tabGroup] = setTimeout("activateTabTimer()",250); }
}
function mouseOutTab(tabGroup,index){
clearTimeout(activeTabTimers[tabGroup]); } var isMouseOver = false; function activateTabTimer() { var activeTabIndex = activeTabIndeces[currentTabGroup]; if(currentTabIndex != activeTabIndex) { var h = 'tbh' + currentTabGroup + '_'; var c = 'tbc' + currentTabGroup + '_';
var activeTab = getObject(h + activeTabIndex);
var activeTabPanel = getObject(c + activeTabIndex);
var newTab = getObject(h + currentTabIndex);
var newTabPanel = getObject(c + currentTabIndex);
var activeTabDiv = getObjectsByTagAndClass('div','activetabdiv');
if(activeTabDiv.length >0){ activeTabDiv[0].className = 'activetabdiv '+(newTabPanel.getAttribute('layout')!='null'?newTabPanel.getAttribute('layout'):"")+' cf'; activeTabDiv[0].innerHTML = newTabPanel.innerHTML; isMouseOver = true; }
activeTab.className = 'tab'; newTab.className = 'tab tabActive'; activeTabIndeces[currentTabGroup] = currentTabIndex; clearTimeout(impT); impT = setTimeout("swtI("+currentTabIndex+")", 1000); } }
var TVIEWHEIGHT = 0;
function collapseTabs() { var ih=0; var i=0; var objects = getObjectsByTagAndClass("h3","dlh"); for(i=0;i<objects.length;i++) { objects[i].style.display = 'none'; } objects = getObjectsByTagAndClass("div","tbc");
for(i=0;i<objects.length;i++) { ih= getObjectHeight(objects[i]);
if(ih>TVIEWHEIGHT)TVIEWHEIGHT=ih; }
var objects = getObjectsByTagAndClass("div","dlTabs");
for(i=0;i<objects.length;i++) { objects[i].style.display = 'none'; } objects = getObjectsByTagAndClass("div","ulTabs");
for(i=0;i<objects.length;i++) { objects[i].style.display = 'block'; } objects = getObjectsByTagAndClass("h3","dlh");
for(i=0;i<objects.length;i++) { objects[i].style.display = 'none'; } objects = getObjectsByTagAndClass("div","dlTabSpacer");
for(i=0;i<objects.length;i++) { objects[i].style.display = 'none'; } objects = getObjectsByTagAndClass("div","tabContentPanel");
for(i=0;i<objects.length;i++) { objects[i].className = 'tabContentPanel'; } objects = getObjectsByTagAndClass("div","tabPanel");
for(i=0;i<objects.length;i++) { if(i==0) { if(!isMouseOver){ var activeTabDiv = getObjectsByTagAndClass("div","activetabdiv");
if(activeTabDiv.length > 0) { activeTabDiv[0].className = 'activetabdiv ' + (objects[i].getAttribute('layout')!='null'?objects[i].getAttribute('layout'):"")+' cf'; activeTabDiv[0].innerHTML = objects[i].innerHTML; } } } objects[i].className = 'tabPanel '+(objects[i].getAttribute('layout')!="null"?objects[i].getAttribute('layout'):"")+' tabHiddenPanel cf'; } }
var mnl;
var mnl_h;
var mnl_oh;
var isE=true;
var timer;
var closeWhileCollapse=false;
function navH1Click(e){
if(timer){ clearInterval(timer); timer = null; } var target=getTargetFromEvent(e); mnl = getObject('masterNavLinks');
if(target && mnl){ if(target.nodeName != 'H1') { target = target.parentNode; } mnl_h = mnl.offsetHeight;
if(!mnl_oh){ mnl_oh = mnl_h; } isE = !isE;
if(isE) { target.className = 'active'; } else { target.className = 'inactive'; } navH1Interval(); timer = setInterval(navH1Interval, 1); }
}
function navH1Interval(){
var isFinishedExpanding=false;
if(mnl_h <= 0 && isE) { var o =getObject('masterNavLinks');
if(null!=o){o.style.display='block';} }
if(!isE){ mnl_h -= 20; } else{ mnl_h += 20; }
if(mnl_h < 0){ mnl_h = 0; } else if(mnl_h > mnl_oh){ mnl_h = mnl_oh; mnl.style.height="auto"; isFinishedExpanding=true; }
if(!isFinishedExpanding) mnl.style.height = mnl_h+'px';
if(mnl_h <= 0 || mnl_h >= mnl_oh)
{ if(mnl_h <= 0 && !isE) { var o =getObject('masterNavLinks'); o.style.display='none'; } clearInterval(timer); timer = null; var masterNavLinks = getObject('masterNavLinks');
if(closeWhileCollapse && isE && masterNavLinks && masterNavLinks.childNodes){ closeWhileCollapse = false; resetNavToFirst(masterNavLinks); } } }
function resetNavToFirst(masterNavLinks)
{ for(var i=0;i<masterNavLinks.childNodes.length;i++){ var node = masterNavLinks.childNodes[i];
if(node && node.className == 'container' && node.childNodes) { var firstIndex = 0; for(var j=0;j<node.childNodes.length;j++){ var link = node.childNodes[j];
if(link && link.nodeName == 'A'){ if(j==firstIndex) { link.className='activeNav'; } else { link.className=''; } } else if(j == 0) { firstIndex = 1; } } } } }
function loadPage() {
resizePage();
try{ if(eval('nP')) { var masterNavLinks = getObject('masterNavLinks');
if(masterNavLinks && masterNavLinks.childNodes){ for(var i=0;i<masterNavLinks.childNodes.length;i++){ var node = masterNavLinks.childNodes[i];
if(node && node.className == 'container' && node.childNodes) { for(var j=0;j<node.childNodes.length;j++){ var link = node.childNodes[j];
if(link && link.nodeName == 'A' && link.className.indexOf('link') == -1){ link.onclick=navClick; } } } } }
var masterNavBody = getObject('masterNavBody'); if(masterNavBody && masterNavBody.childNodes){ for(var i=0;i<masterNavBody.childNodes.length;i++){
var node = masterNavBody.childNodes[i]; if(node && node.nodeName == 'H1'){ node.onclick=navH1Click; } } } } }
catch(e){;} loadImages(); collapseTabs(); } var checkHeight; function setNavScreenHeight() { var navScreen = getObject('masterNavScreen');
var page = getObject('pageC'); var ag=navigator.userAgent.toLowerCase(); checkHeight = setInterval(
function () { if(navScreen.clientHeight != page.clientHeight ) { if(ag.indexOf("msie") !=-1) { navScreen.style.height = document.body.clientHeight - 70 +'px'; }
else { navScreen.style.height= page.clientHeight + 'px'; } } },1); }
function resizePage(){ var width = getBrowserWidth();
}
function loadImages() { if(document.images) {
var a = new Array();
var image; var prefix = ''; if(useCdn) { prefix = "http:/" + "/" + cdnServer; } prefix = prefix + "/shared/core/1/images/";
for(var i=0;i<a.length;i++){ image=new Image(); image.src=prefix+a[i]; } } } function enc(s){ return encodeURI(s).replace("&","%26"); }
/*@end @*/
there are many things that i want to remove from this JS script, but if i do, the tabs don't work anymore.
An archive with the files necessary for this page to run "correctly" is at this address: http://www.robertcazan.ro/test/problem.zip
I want to achieve something like this: http://www.robertcazan.ro/test/example/portfolio.html, so when i click on the small image the LIGHTBOX loads the picture in that part.
I used SPRY from Adobe(at the example), but i don't want to use this in the future because it's pretty big as filesize, and it's not so customizable.
Hope you can help,
thank you,
Robert
Bookmarks