...

View Full Version : Default Difficult CSS/Javascript Navigation Question



kidtoxic
05-16-2007, 06:28 PM
I am trying to make simple links stay highlighted when clicked on until another link is selected. The 4 columns below the image area is the links/navigation I am referring to.

Also, at the bottom right hand corner of the image you will see Next and Previous links and I need these to scroll through the links that correspond to each image.

I am not sure why this is posing to be so difficult but I have posted this same question to 5 different forums out there and no-one seems to know how. The URL is:
http://manhattanwest.com/media-center/video-images.php

Is there anyone here that can help?

Thanks a ton!!

BonRouge
05-16-2007, 06:48 PM
Hey. It's difficult to test because you have the AJAX stuff going on, but you might want to change the onclick events to this:
onclick="ajaxpage('images/index.php', 'catHolder', this);" and then change this:
function ajaxpage(url, containerid){
var page_request = false
if (window.XMLHttpRequest) // if Mozilla, Safari etc
page_request = new XMLHttpRequest()
else if (window.ActiveXObject){ // if IE
try {
page_request = new ActiveXObject("Msxml2.XMLHTTP")
}
catch (e){
try{
page_request = new ActiveXObject("Microsoft.XMLHTTP")
}
catch (e){}
}
}
else
return false
page_request.onreadystatechange=function(){
loadpage(page_request, containerid)
}
if (bustcachevar) //if bust caching of external page
bustcacheparameter=(url.indexOf("?")!=-1)? "&"+new Date().getTime() : "?"+new Date().getTime()
page_request.open('GET', url+bustcacheparameter, true)
page_request.send(null)
} to this:
function ajaxpage(url, containerid, el){
var as=document.getElementById('vidtabs').getElementsByTagName('a');
for (i=0; i<as.length; i++) {
as[i].className="";
}
el.className="on";

var page_request = false
if (window.XMLHttpRequest) // if Mozilla, Safari etc
page_request = new XMLHttpRequest()
else if (window.ActiveXObject){ // if IE
try {
page_request = new ActiveXObject("Msxml2.XMLHTTP")
}
catch (e){
try{
page_request = new ActiveXObject("Microsoft.XMLHTTP")
}
catch (e){}
}
}
else
return false
page_request.onreadystatechange=function(){
loadpage(page_request, containerid)
}
if (bustcachevar) //if bust caching of external page
bustcacheparameter=(url.indexOf("?")!=-1)? "&"+new Date().getTime() : "?"+new Date().getTime()
page_request.open('GET', url+bustcacheparameter, true)
page_request.send(null)
}

You'll also need to change this:
<ul class="vidtabs">
to this:
<ul id="vidtabs"> and add something like this to your CSS:
.on {
border:1px solid red;
}

I hope that helps (and I haven't missed anything important).

kidtoxic
05-16-2007, 07:42 PM
Man you are a NINJA!!!!!!!!!!!!!!!!!!!!!!!

Thanks so much!

I hate to ask but maybe you could help with this question???

I made a second JS file for the 4 columns of links below the image (the navigation that changes the images out) but they will not work the same as the other top "Images Video Radio" links. Also when you click the bottom image nav links it changes the top 3 links.....I really really appreciate your help and am going to go take some JS classes ASAP!!!

Thanks again BonRouge!!!!

kidtoxic
05-16-2007, 08:04 PM
Never mind.....I forgot to change something and I figured it out....thanks a ton again!

LOL....if possible would you know how I can get the Next and Previous links on the bottom right of the image to rotate through the 4 columns of links below??

If not its okay you have already helped me a TON!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum