Hover and active link buttons in a menu.

Links for php scripts

Moderators: macek, egami, gesf

chris122380
New php-forum User
New php-forum User
Posts: 30
Joined: Mon Jun 25, 2012 12:41 pm

Hover and active link buttons in a menu.

Postby chris122380 » Thu Aug 16, 2012 9:26 am

I have been fallowing Active Page Links Tutorial For Your Website Menu : CSS PHP Dreamweaver to try to create a menu that is highlighted when hovered over and when selected. I have the hover working but when selecting the link the box doesn't stay highlighted. I beleave it's a problem with my if then statement in my menu_template.php. I think It's a problem with the $_SERVER['PHP_SELF'] global variable. I would like my myActiveButton theme to be active when the link is open in my iframe.

menu_template.php

Code: Select all

<?php

$specification = "myButtons";
$contacts = "myButtons";

$menuLinked = basename($_SERVER['PHP_SELF'], ".php");
if ($menuLinked == "Spec_List"){
    $specification = 'myActiveButton';
}else if ($menuLinked == "contact"){
    $contacts = 'myActiveButton';
}
?>

<a class="<?php echo $specification; ?>" href="Spec_List.php" target="ileft">Specification</a>   
<a class="<?php echo $contacts; ?>" href="contact.php" target="ileft">Contacts</a>


index.php

Code: Select all

<!DOCTYPE html>

<html>
<head>
    <title>Closeout System</title>
         
    <link href="style/style.css" rel="stylesheet" type="text/css">
</head>

<body>

<div id="body">

   <table style="width: 100%">
      <tr>
         <td><img alt="Manuals Access Logo" src="images/MA-Logo-Web.png" width="80" height="61"></td>
         <td><h1>Closeout System</h1></td>
      </tr>
   </table>

<br />
<br />
   <div id="menu">
           <?php include_once("menu_template.php"); ?>
      </div>

   <div id="bodyContainer">
   <div id="bodyContentContainer">
   
   
   <table>
      <tr>
         <td><iframe name="ileft"  style="width: 492px; height:643px; clear:both; overflow:auto; background-color: white;" border="0" frameborder="0"></iframe></td>
         <td style="width: 100%"></td>
      </tr>
   </table>
</div>
</div>

<div></div> <!-- Copyright bar at bottom of page  -->

</div> <!-- end of body div-->
</body>
</html>


style.css

Code: Select all

* {
    margin: 0px;
    padding: 0px;
}

h1 {
   text-align:center;
   
}

#body {
   background-color: #999999;
   margin: 0px auto 0px auto;
   width: 1024px;
   height: 800px; /* 900px default */
   margin: 0px auto 0px auto;
   position: relative;
   top: 0px;
   left: 0px;
}
h1 {
   text-align: center;
   font-size: 40px;
}


#menu {
   width: 200px;
   text-align: center;
}

#menu a {
   border: #666 1px solid;
   border-bottom:none;
   padding-top: 8px;
   padding-bottom: 1px;
   padding-left: 8px;
   padding-right: 8px;
   text-decoration:none;
}

#menu a:hover {
   background-color:orange;
   
}

myButtons {
   background-color: #036;
   color: #FFF;
}

myActiveButton {
   background-color: #BAE4FE;
   color: #000;
}

#bodyContainer {
   height: 664px;
   width: 513px;
   border: #666 1px solid;
   background-color:aqua;
   
}

#bodyContentContainer {
   padding:10px;
}

Return to “PHP Scripts”

Who is online

Users browsing this forum: No registered users and 1 guest

cron