I'm having trouble implementing this with current pseudo-class.
The following code works for the basic link and for the hover pseudo-class:
ul#cssmw > li#productsNav {
background-image:url(../../images/productsRed.png);
background-repeat:no-repeat;
background-position:center;
}
ul#cssmw > li#productsNav:hover {
background-image:url(../../images/productsWhite.png);
background-repeat:no-repeat;
background-position:center;
}
The following code fails to change the background image for the current pseudo-class:
ul#cssmw > li#productsNav:current {
background-image:url(../../images/productsWhite.png);
background-repeat:no-repeat;
background-position:center;
}
The address bar includes products.php; the menu.php code follows:
<?php
$WA_menuDir = getcwd();
chdir(dirname(__FILE__));
require_once("../../webassist/framework/library.php");
require_once("../../webassist/framework/framework.php");
chdir($WA_menuDir);
$WA_Menu = new WA_Include(__FILE__);
?>
<ul class="level-0" id="cssmw">
<li id="recipeNav" style="width:130px;"><a href="../../recipe.php"></a></li>
<li id="performanceNav" style="width:200px; text-align:center;"><a href="../../performance.php">Performance</a></li>
<li id="tasteNav" style="width:100px;"><a href="../../taste.php">Taste</a></li>
<li id="productsNav" style="width:140px;"><a href="../../products.php">Products</a></li>
<li id="buyNav" style="width:180px;"><a href="../../wheretobuy.php">Buy</a></li>
</ul>
<script type="text/javascript">if(window.attachEvent) { window.attachEvent("onload", function() { cssmw.intializeMenu('cssmw',{select_current: 0, orientation: 1}); }); } else if(window.addEventListener) { window.addEventListener("load", function() { cssmw.intializeMenu('cssmw',{select_current: 0, orientation: 1}); }, true); }</script>
<?php
$WA_Menu->Initialize(true);
echo($WA_Menu->Body);
?>
Help??
Mike