メガドロップダウンメニューcss mysqlデータベースデータ用

Question

mysqlデータベースから来るメガドロップダウンメニューを作りたいと思います。以下は私のPHPコードです。コードはうまくいきます。しかし、問題は私が下のコードのメガドロップダウンメニューを作ることができないことです。

私はここでの例のようなメガメニューを必要とする：https://bootsnipp.com/snippets/featured/bootstrap-mega-menu

私の問題は、私は以下のPHPコードでdiv以上を行います方法です。

Plz上記のメガドロップダウンメニューのcssをお手伝いします。

<?php 
$sql = "SELECT id, product, parent_id, category_link FROM category ORDER BY parent_id, id"; 
$results = mysqli_query($conn,$sql) or die(mysqli_error()) ; 
if($results) 
{ 
    while($result = mysqli_fetch_array($results)) 
    { 
     $category['categories'][$result['id']] = $result; 
     $category['parent_cats'][$result['parent_id']][] = $result['id']; 
    } 
} 

function getCategories($parent, $category) 
{ 
    $html = ""; 
    if (isset($category['parent_cats'][$parent])) 
    { 
     $html .= "<div id='wrapper'>"; 
     $html .= "<ul class='mega-menu'>\n"; 
     foreach ($category['parent_cats'][$parent] as $cat_id) 
     { 
      if (!isset($category['parent_cats'][$cat_id])) 
      { 
       $html .= "<li class='mega-menu-drop'>\n <a class='mega-menu-content' href='" . $category['categories'][$cat_id]['category_link'] . "'>" . $category['categories'][$cat_id]['product'] . "</a>\n</li> \n"; 
      } 
      if (isset($category['parent_cats'][$cat_id])) 
      { 
       $html .= "<li class='mega-menu-drop'>\n <a class='mega-menu-content' href='" . $category['categories'][$cat_id]['category_link'] . "'>" . $category['categories'][$cat_id]['product'] . "</a> \n"; 
       $html .= getCategories($cat_id, $category); 
       $html .= "</li> \n"; 
      } 
     } 
     $html .= "</ul> \n"; 
     $html .= "</div>"; 

    } 
    return $html; 
} 
?> 
<?php echo $data['category'] = getCategories(0, $category);?> 

Answer 1

コメント数私はあなたがいくつかのCSSが必要だと思います。 これはマウスのホバー上で動作します。あなたの例のようなクリックではない：

.mega-menu-drop { 
    display:none 
} 

.mega-menu:hover .mega-menu-drop { 
    display:block 
}