1. Create the table "categorylist"
CREATE TABLE IF NOT EXISTS `categorylist` (
`id` int(5) NOT NULL auto_increment,
`cname` varchar(25) collate utf8_unicode_ci default NULL,
`pid` int(5) NOT NULL,
`url` text collate utf8_unicode_ci,
PRIMARY KEY (`id`),
KEY `pid` (`pid`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci AUTO_INCREMENT=9 ;
2. Insert values in the "categorylist"
INSERT INTO `categorylist` (`id`, `cname`, `pid`, `url`) VALUES
(1, 'Entertainment', 0, '#'),
(2, 'Movies', 1, 'http://example.com/movie.php'),
(3, 'Drama', 1, 'http://example.com/drama.php'),
(4, 'Sports', 0, '#'),
(5, 'Football', 4, 'http://example.com/football.php'),
(6, 'Cricket', 4, 'http://example.com/cricket.php'),
(7, 'Politics', 0, '#'),
(8, 'Politics news', 7, 'http://example.com/politics-news.php');
3. Style sheet
.nav ul li { background:#f1f1f1; list-style: none;}
ul.dropdown { position:relative; width:auto; font:12px Arial, Helvetica, sans-serif; }
ul.dropdown li { float:left; zoom:1; height:30px; padding:6px 2px 0 2px; }
ul.dropdown li li { border-right:1px solid #ccc; border-left:1px solid #ccc; margin-left:-30px;}
ul.dropdown a:hover { color:#000; } ul.dropdown a:active { color:#ffa500; }
ul.dropdown li a { display:block; padding:4px 8px; color:#000; text-decoration:none; font:bold 12px Arial, Helvetica, sans-serif; }
ul.dropdown li:last-child a { border-right:none;} /* Doesn't work in IE */
ul.dropdown li:hover { color:#000; background:#e7e7e7; position:relative; }
ul.dropdown li.hover a { color:#000; }
ul.dropdown ul { text-align:left; visibility: hidden; position: absolute; left:-10px; top:36px; }
ul.dropdown ul li { background:#f1f1f1; border-bottom:1px solid #ccc; float:none; width:120px; height:25px; }
ul.dropdown ul li a { border-right:none; width:100%; display:inline-block; color:#000; }
ul.dropdown ul ul { left:100%; top:0; }
ul.dropdown li:hover > ul { visibility:visible; }
4. Code for menu script
<?php
$con=mysql_connect("localhost", "root", "") or die('Server connexion not possible.');
mysql_select_db("newone",$con) or die('Database connexion not possible.');
$qry="SELECT * FROM categorylist";
$result=mysql_query($qry,$con);
$arrayMenu = array();
while($row = mysql_fetch_assoc($result)){
$arrayMenu[$row['id']] = array("pid" => $row['pid'], "name" => $row['cname'], "url" => $row['url']);
}
//createTree($arrayCategories, 0);
function createTree($array, $curParent, $currLevel = 0, $prevLevel = -1) {
foreach ($array as $categoryId => $category) {
if ($curParent == $category['pid']) {
if($category['pid']==0) $class="dropdown"; else $class="sub_menu";
if ($currLevel > $prevLevel) echo " <ul class='$class'> ";
if ($currLevel == $prevLevel) echo " </li> ";
echo '<li id="'.$categoryId.'" ><a href="'.$category['url'].'">'.$category['name'].'</a>';
if ($currLevel > $prevLevel) { $prevLevel = $currLevel; }
$currLevel++;
createTree ($array, $categoryId, $currLevel, $prevLevel);
$currLevel--;
}
</pre>
}
if ($currLevel == $prevLevel) echo " </li> </ul> ";
}
?>
<div class="nav">
<?php
if(mysql_num_rows($result)!=0)
{
php createTree($arrayMenu, 0);
}
?>
</div>
