CSS / HTML / Javascript nav bar

HTML, CSS and anything else that deals with client side capabilities.

Moderator: General Moderators

Post Reply
aravona
Forum Contributor
Posts: 347
Joined: Sat Jun 13, 2009 3:59 pm
Location: England

CSS / HTML / Javascript nav bar

Post by aravona »

Ok so I need a vertical-side-out navagation menu like this:

http://www.dynamicdrive.com/dynamicinde ... thmenu.htm

This uses <ul> and <il> tags to control the nav bar, along with a CSS file and some javascript.

The code for my links if the following:

Code: Select all

            <div id="smoothmenu2" class="ddsmoothmenu-v">
            <ul>
            <li>
              <?php
                 $query="SELECT * FROM ver_parent WHERE mID='1' AND active=1 ORDER BY pID ASC";
                 $result=$class->ResultSet($query);
                 $i=0;
                 $x=0;
                 while($row=$class->FetchObject($result)){
                    $hee=$_REQUEST['CID'];
                   //if(isset($hee)){
                    $query2="SELECT * FROM ver_child WHERE mID='1' AND pID='".$row->pID."' AND active=1 ORDER BY cID ASC";
                    $result2=$class->ResultSet($query2);
                    $TROwS=$class->numRows($result2);
                    if($TROwS==0){
                ?> <li>
                    <li><a title="<?=$row->name?>" href="index.php?cmd=18&CID=<?=$row->pID?>" class="<?=($_REQUEST['CID']==$row->pID)?'select_left':''?>"><?=$row->name?></a></li>
                <?php
                    }else{    
                ?>
                </li>
                
                <ul>
                <li>
                
                        <li><a title="<?=$row->name?>" href="index.php?cmd=18&CID=<?=$row->pID?>" class="<?=($_REQUEST['CID']==$row->pID)?'select_left':''?>"><?=$row->name?></a></li>
                        
                    
                   <?php 
                     }                  $i=0;
                                    $x=0;
                            while($row2=$class->FetchObject($result2)){
                                if($row->pID==$row2->pID){
                            ?>
                            <li>
                                   <a title="<?=$row2->name?>" href="index.php?cmd=18&CID=<?=$row2->pID?>&SCID=<?=$row2->cID?>" class="<?=($_REQUEST['SCID']==$row2->cID)?'select_left':''?>"><?=$row2->name?></a></li>
                           <?php  
                                }
                            }
                            if($TROwS!=0){
                ?>
 
                <?php      }
                   }?></li></ul>
                   </li>
                   </ul>
                  
    <br style="clear: left" />
           </div>
 
I'm not 100% sure I'm even putting these tags in the correct places, but the site doesnt look right:

the site

Also in FF its looking ok, and in IE... its really not happy.

Any help ?
User avatar
daedalus__
DevNet Resident
Posts: 1925
Joined: Thu Feb 09, 2006 4:52 pm

Re: CSS / HTML / Javascript nav bar

Post by daedalus__ »

well i see it on the website but the menu isn't functional. you should try to build one yourself so you can understand the markup. the animation effects are just candy and you can add them in later.

check a list apart for some good articles about it.

http://www.alistapart.com/articles/horizdropdowns/
aravona
Forum Contributor
Posts: 347
Joined: Sat Jun 13, 2009 3:59 pm
Location: England

Re: CSS / HTML / Javascript nav bar

Post by aravona »

This is not the first time I've made these nav bars. But I've not used this type of php page generation to create the links before. I've tested it working with plain old links and it works fine. Its getting the tags to work around the correct parts of the php I'm having problems with. I've posted the link of the one I'm using.

I would just like to be pointed in the right direction as to why its not working around this php code.
pbs
Forum Contributor
Posts: 230
Joined: Fri Nov 07, 2008 5:31 am
Location: Nashik, India
Contact:

Re: CSS / HTML / Javascript nav bar

Post by pbs »

May this will help you, its very simple https://sourceforge.net/projects/multil ... les/latest
aravona
Forum Contributor
Posts: 347
Joined: Sat Jun 13, 2009 3:59 pm
Location: England

Re: CSS / HTML / Javascript nav bar

Post by aravona »

I've fixed the problem wiht help form the forums of the site that has the code. It works now but is behind my flash element and I don't know how to send the flash back or being the nav bar forwards.

EDIT: tried z-index but it hasnt seemingly worked.
aravona
Forum Contributor
Posts: 347
Joined: Sat Jun 13, 2009 3:59 pm
Location: England

Re: CSS / HTML / Javascript nav bar

Post by aravona »

Fixed it.

Had additional coding for my nav bar from the old one.

Removed that and it worked.

Got it running over flash with:

<param name="wmode" value="transparent">

wmode="transparent"
aravona
Forum Contributor
Posts: 347
Joined: Sat Jun 13, 2009 3:59 pm
Location: England

Re: CSS / HTML / Javascript nav bar

Post by aravona »

*sigh*

the middle two navigations aren't opening sub menu's even though the tags are in the same places as the first navigation.

http://www.leisure-shop-online.com/test/

FIXED, for good this time. mutli use of elements is aparently a no no :P
Post Reply