导航菜单与php,js和mysql

时间:2013-08-28 13:54:16

标签: php javascript jquery mysql css

注意:原始&代码中的 new

我的问题是原始“父母”不是非常友好的SEO,并且不按计划行事,也不会在站点地图中获取。

然而 new 是SEO友好的,将在站点地图中获取并最终按计划进行。

我需要它作为一个链接,这样你就可以看到左边的导航菜单和每个菜单/子菜单的名称,并在页面的中央有一个带有每个子菜单名称的图片取决于您在左侧导航菜单中单击的父项。

添加了 new 行后,我会因链接而刷新页面,因此子菜单在刷新前只会闪烁一秒钟。

我需要帮助解决的是:

- 在页面刷新期间使子菜单保持打开状态,以便您可以同时使用侧边栏导航和中心导航中的导航。

事先谢谢! //吉姆

这是我当前的菜单:

<div id="container">
    <dl>
    <?php 
        $select_category = mysql_query("SELECT * FROM menu WHERE hidden = 0 ORDER BY menu ASC");
            while($ln = mysql_fetch_array($select_category)){
                $idcat = $ln['nmr'];
                $catname = str_replace(' ', '-', $ln['menu']);
    ?>

            *Original*: <dt><a href="#/<?php echo $catname; ?>/" style="color:#000;" ><strong><?php echo $ln['menu']; ?></strong></a></dt>

        *New*: <dt><a href="http://www.mysite.com/cats/<?php echo $msub['nmr'];?>/<?php echo $mname; ?>/" style="color:#000;" ><strong><?php echo $mn['menu']; ?></strong></a></dt>

        <?php 
            $select_sub = mysql_query("SELECT * FROM submenu WHERE nmrmenu = '$idcat' AND hidden = 0");
            if(mysql_num_rows($select_sub) == 0){
            }else {
        ?>
        <dd>
        <ul>
        <?php
            while($lsub = mysql_fetch_array($select_sub)){
                $subname = str_replace(' ', '-', $lsub['submenu']);
                $pil = '&raquo;';
                $brnr = $lsub['nmr'];
        ?> 
        <li> <a href="http://www.mysite.com/cat/<?php echo $lsub['nmr'];?>/<?php echo $subname; ?>/" style="color:#333;"> <?php echo $pil; ?>&nbsp;<?php echo $lsub['submenu']; ?></a></li>
        <?php } ?>
        </ul>
        </dd>
       <?php } ?>
      </dl>
     <?php } ?>
   </div>

CSS:

#container{ margin:auto; margin-left:10px; }
dl, dt, dd, ul, li, a{ margin:0; padding:0; }
a{ text-decoration: none; color:#0F0; }
li{ padding-left:.6em; list-style-type:none; color:#FF0; }
dl{ width:100px; }
dt{  }

JS:

$(function()
{
    $("dd:not(first)").hide();
    $("dt a").click(function()
     {
         $("dd").slideUp("normal");
         $(this).parent("dt").next("dd").slideDown("normal");
     });
});

这是我的代码的jsFiddle

1 个答案:

答案 0 :(得分:1)

首先,你要清理你的HTML和CSS。然后,您将要查看用户正在查看的页面,如果它是一个类别,则显示该特定的子导航。

这是你清理过的php / html。我认为你搞砸了你的变量名,所以如果这不起作用,那可能就是原因了。

例如,您有*New*: <dt><a href="http://www.mysite.com/cats/<?php echo $msub['nmr'];?>$msub['nmr'];未在上面的代码中设置。

<ul id="nav-container">
<?php 
$select_category = mysql_query("SELECT * FROM menu WHERE hidden = 0 ORDER BY menu ASC");
while ($ln = mysql_fetch_array($select_category)) {
  $idcat = $ln['nmr'];
  $catname = str_replace(' ', '-', $ln['menu']);

  echo '<li>'
  echo '<a href="http://www.mysite.com/cats/'.$msub['nmr'].'/'.$mname.'/" ><strong>'.$mn['menu'].'</strong></a>';
  echo '<ul';

  // This is where we check which page you're on, and show the sub navigation if it corresponds to that page.
  if ($GET['cat'] == $msub['nmr'])
    echo ' style="display:block;">';
  else
    echo '>';


  while ($lsub = mysql_fetch_array($select_sub)) {
    $subname = str_replace(' ', '-', $lsub['submenu']);
    $pil = '&raquo;';
    $brnr = $lsub['nmr'];

    echo '<li><a href="http://www.mysite.com/cat/'.$lsub['nmr'].'/'.$subname.'/">'.$pil.'&nbsp;'.$lsub['submenu'].'</a></li>';
  }

  echo '</ul>';
  echo '</li>';
}

?>

</ul>

这是随身携带的CSS。

a {
    text-decoration: none;
    color: #333;
}
li {
    padding-left: .6em;
    list-style-type:none;
    color:#FF0;
}

#nav-container li ul {
    display: none; /* Hide all sub navigations to start with */
}

由于我使用css的方式,你不再需要使用JavaScript:)