Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Ezn
    Ezn is offline
    New Coder
    Join Date
    Aug 2006
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    navbar help - 7 files into one ASP.NET

    You'd think finding ASP.NET VB navbar code would be easy, but I haven't been able to find anything resembling what I need.

    I have a navbar that is pretty simple. 7 pages, 6 navbar items, 18 images (3 for each button - on, off, mouseover). One page has all off, other pages have one button in 'on' state. Every button has a rollover image using js.

    Using ASP.NET 2.0 with Visual Studio 2005.

    Right now, I am doing this the easy (wrong) way. I have 7 different include files for each page's navbar. Each page inserts the appropriate include file for the navbar for that page.

    Here's one of the include files (for page 2, no rollover for 'on' state). Using CSS for an inline list. I know I could/should do the rollovers in CSS, but this is what I have now:

    Code:
    <ul id="mainNav">
        <li><a href="index.aspx"><img src="_images/nav_01_ho_off.gif" name="01ho" width="209" height="35" border="0" id="01ho" onmouseover="swapImage('01ho','','_images/nav_01_ho_ro.gif',1)" onmouseout="swapImgRestore()" /></a></li>
        <li><a href="page02.aspx"><img src="_images/02_ef_on.gif" name="02ef" width="126" height="35" border="0" id="02ef" /></a></li>
        <li><a href="page03.aspx"><img src="_images/nav_03_hl_off.gif" name="03hl" width="131" height="35" border="0" id="01mm" onmouseover="swapImage('03hl','','_images/nav_03_hl_ro.gif',1)" onmouseout="swapImgRestore()" /></a></li>
        <li><a href="page04.aspx"><img src="_images/nav_04_sf_off.gif" name="04sf" width="113" height="35" border="0" id="04sf" onmouseover="swapImage('04sf','','_images/nav_04_sf_ro.gif',1)" onmouseout="swapImgRestore()" /></a></li>
        <li><a href="page05.aspx"><img src="_images/nav_05_ps_off.gif" name="05ps" width="230" height="35" border="0" id="05ps" onmouseover="swapImage('05ps','','_images/nav_05_ps_ro.gif',1)" onmouseout="swapImgRestore()" /></a></li>
        <li><a href="page06.aspx"><img src="_images/nav_06_re_off.gif" name="06re" width="151" height="35" border="0" id="06re" onmouseover="swapImage('06re','','_images/nav_06_re_ro.gif',1)" onmouseout="swapImgRestore()" /></a></li>
    </ul>
    Pretty simple, right?

    I have 7 of these files. I want to have one file. Basically, the code just needs to 'know' what page it is on to display a different image for that page's button.

    Can anyone point me in the right direction? Ideally, I want to use ASP.NET and VB to do this.

    Thanks!

  • #2
    Regular Coder
    Join Date
    May 2007
    Location
    UK
    Posts
    180
    Thanks
    0
    Thanked 18 Times in 18 Posts
    The id attribute for the <img> controls must be renamed to start with a letter so that you can reference the controls in your code. The <img> tags also need a runat attribute, e.g.,
    Code:
    <img id="img01ho" runat="server"...
    Your VB ASP.NET code can then change the img01ho control's attributes in Page_Load(), e.g.,
    Code:
    img01ho.Src = "~/Images/Pretty.gif"
    Last edited by SouthwaterDave; 06-16-2007 at 05:43 PM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •