asked on

Show specific nav bar image depending on page name

Hi Experts

I have a nav bar that uses two images - one is the main image and the other is the onmouseover image. This works fine.

I would like to have some way of having the specific mouseover image displayed whenever the page corresponds to that image.

For example; the nav bar has choices for 'Customer Orders', 'Customer Details', 'Product Details', 'Suppliers' and 'Shipping'. When the user hovers over, for instance, 'Customer Orders' the rollover happens. What I would like is that when the user clicks the 'Customer Orders' menu choice, the mouseover image is the main image for all files that begin 'CustomerOrders...'. If the user then moves to 'Product Details' all pages that begin with 'ProductDetails...' the mouseover image for 'Product Details' becomes the main nav bar image.

I have some javascript code that I used for many years with text only links but I'm not sure how to alter this to use images and 'wildcards'. The code is:

function disLink(FName, LText) {

      InString = top.document.URL

      LastSlash=InString.lastIndexOf ('\\', InString.length-1)
      OutString=InString.substring (LastSlash+1, InString.length)

      if (OutString == FName) {
      document.write ("<span class='dislink'><b>"+ LText +"</b></span>")

      } else {

      document.write ("<a href=" + FName + " class='ablelink'><b>"+ LText +"</b></a>")

      }
}

This is then called as <script>disLink('CustomerOrders.asp','Customer Orders')</script>.

I would prefer if there is some way of doing this in ASP and I seem to think it may be something along the lines of:

CustomerOrders* = custO
CustomerDetails* = custD
ProductDetails* = prodD
Suppliers* = supps
Shipping* = ships

If (pagename = custO) then

<a href="../Admin/CustomerOrders.asp" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Customer_Orders','','../images/CustomerOrders_Over.gif',1)"><img src="../images/CustomerOrders_Over.gif" alt="Customer Orders" width="110" height="39" id="Customer_Orders" /></a>

else

<a href="../Admin/CustomerOrders.asp" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Customer_Orders','','../images/CustomerOrders_Over.gif',1)"><img src="../images/CustomerOrders_Off.gif" alt="Customer Orders" width="110" height="39" id="Customer_Orders" /></a>

end if

If (pagename = custD) then

<a href="CustomerDetails.asp" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Customer_Details','','../images/CustomerDetails_Over.gif',1)"><img src="../images/CustomerDetails_Over.gif" alt="Customer Details" width="110" height="39" id="Customer_Details" /></a>

else

<a href="CustomerDetails.asp" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Customer_Details','','../images/CustomerDetails_Over.gif',1)"><img src="../images/CustomerDetails_Off.gif" alt="Customer Details" width="110" height="39" id="Customer_Details" /></a>

end if

etc, etc.

Am I on the right track here, if not what do I need to change?

Regards

Martin

ASKER CERTIFIED SOLUTION

netsmithcentral

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Martin Cotterill

ASKER

Hi netsmithcentral

Many thanks for the reply.

It works like a dream!

Many, many thanks!

A big thank you for the links too. They helped me understand what was happening in the code. I've printed the details from the links and added them to my collection.

Once again, many thanks for your help.

Warm regards

Martin

Martin Cotterill

ASKER

Hi again netsmithcentral

I've just found something and I can't figure out how to make it work.

I needed to use wildcards so that the navbar would show the correct image if the filename started with, for instance, CustomerOrders.

ie: if the page name was CustomerOrdersByProduct.asp it would use the same image as CustomerOrders.asp or CustomerOrdersBySalesTotal.

I've tried using the wildcard '*' but I keep getting errors or no results.

Help!

Regards

Martin

netsmithcentral

Wildcards don't exist in VB/ASP. That's why I set the code up to use the InStr (in string) function. This function searches a string for a given substring and returns it's index, or 0 if the substring is not found. It's syntax is InStr(searchString, substringToFind) So, to find out if a page name contains "CustomerOrders" you say:

If InStr(Request.ServerVariables("SCRIPT_NAME"), "CustomerOrders") > 0 Then
'Do something specific for CustomerOrders pages
End If

We know that because the InStr function returned a value greater than zero (which would indicate the substring had not been found) that this page name contains "CustomerOrders" in it. It doesn't matter to us what the index actually is, only that its greater than zero.

Martin Cotterill

ASKER

Hi netsmithcentral

Please accept my apoligies.

I checked through the link you supplied and thought that I had missed something before I queried the code.

However, I found that the reason it wasn't working as I expected was because one of my filenames was spelt incorrectly. I have made the alteration and it works just as you said it would.

Once again, please accept my apologies and again many thanks for the code. I will now go and write out one hundred times 'I must check the spelling of my filenames'.

Warm regards

Martin

netsmithcentral

Glad to have been able to help!