Bagatorіvneve menu in PHP and MySQL. §2. How to create a drop down vertical menu in php Inurl php own menu id pyramid

• Golovna
• Novini
• Contacts
• About us

Our next task is to drop off styles from the list, installed behind the locks. We need to clean up the names and internal entries of the list itself and the markers near the items in the list. Let's set the required width:

#navbar ( margin: 0; padding: 0; list-style-type: none; width: 100px; )

Now the time has come to style yourself. We add the background color to them, change the parameters of the text: color, size and size of the font, lightly reinforce, add small steps and change the size of the font element from row to block. Dodatkovo was added to the left and bottom frames to the items in the list.

When hovering the mouse cursor over a menu item old look you can change, turning the respect of the coristuvach. You can create such an effect by helping the pseudo-class: hover.

Let's turn to the butt of the vertical menu that we looked at earlier and add to the style table, the next rule:

#navbar a:hover ( background-color: #666; border-left: 5px solid #3333FF; ) Try »

Horizontal Menu

At the front butt, we looked at the vertical navigation panel, which is most likely to be used on the sites of left-handed or right-handed in the main content area. However, menus with navigational messages are also often displayed horizontally at the top of the web page.

Horizontal menu can be created for additional stylization of the great list. Power display for elements

To place menu items horizontally on the back, we create a marking list with messages:

• Golovna
• Novini
• Contacts
• About us

Let's write a couple of rules for our list, what to throw off the style, what to win for the lists for locks, and revisit the list from the block on the row:

#navbar ( margin: 0; padding: 0; list-style-type: none; ) #navbar li ( display: inline; ) Try »

Now we have lost more than stylish design for our horizontal menu:

#navbar ( margin: 0; padding: 0; list-style-type: none; border: 2px solid #0066FF; border-radius: 20px 5px; width: 550px; text-align: center; background-color: #33ADFF; ) #navbar a ( color: #fff; padding: 5px 10px; text-decoration: none; font-weight: bold; display: inline-block; width: 100px; ) #navbar a:hover ( border-radius: 20px 5px ; background-color: #0066FF; ) Try »

VIP menu

The menu, as we will create, mother of the main navigational messages, sorted in the horizontal navigation bar, and sub-items, as soon as the mouse cursor hovered over that menu item, until a certain number of sub-items are visible.

First, we need to create the HTML structure of our menu. The main navigational messages we can add to the marked list:

• Golovna
• Novini
• Contacts
• About us

Subitem mi rozmіstimo in an okremy list, putting yogo in the element

• Golovna
• Novini
• Contacts
  • Addresses
  • Telephone
  • Email
• About us

Now let's get down to writing the CSS code. For the cob it is necessary to attach a list with sub-items for additional information display: none; so that the stench didn't show up on the web site for the whole hour. For displaying subpoints, we need, so when hovering over an element

#navbar ul ( display: none; ) #navbar li:hover ul ( display: block; )

We take in both lists and the markers inserted behind the lock. Elements of the list with navigation aids robably floating, shaping horizontal menu, but for the elements of the list, which should be checked subitems, set float: none; , so that the stench seemed to be one under one.

#navbar, #navbar ul ( margin: 0; padding: 0; list-style-type: none; ) #navbar li ( float: left; ) #navbar ul li ( float: none; )

Then we need to work in such a way that our submenu, which does not fall out, does not interfere with the content, pushing it under the navigation panel, down. For which we put an item to the list position: relative; and to the list, what to revenge subpoints position: absolute; and to add the power of the top to the values ​​of 100%, so that the position of the sub-menu would be exactly according to the forces.

#navbar ul ( display: none; position: absolute; top: 100%; ) #navbar li ( float: left; position: relative; ) #navbar ( height: 30px; ) Try »

The height for the Batkiv list was added specially, so that browsers do not check for floating content in the element, without adding the height, our list will be ignored by the browser and content that follows the list will wrap around our menu.

Now we have lost the style of insulting our lists and menus, what you see, be ready:

#navbar ul ( display: none; background-color: #f90; position: absolute; top: 100%; ) #navbar li:hover ul ( display: block; ) #navbar, #navbar ul ( margin: 0; padding: 0; list-style-type: none;) #navbar ( height: 30px; background-color: #666; padding-left: 25px; min-width: 470px; height: 100%; ) #navbar li a ( display: block; padding: 6px; width: 100px; color: #fff; text-decoration: none; ) #navbar li:hover ( background-color: #f90; ) #navbar ul li:hover ( background-color: #666; )

Site menu in php, which is handled by php scripts, has its own peculiarities. It’s not just an absolute or a vodnosnі possilannya, although it can be done as a whole, but, as a rule, blocks of silan of side panels, which are dynamically molded with razdіla and poddrozdіla і blocks of silan from the very inner sides of the site. The menu, which is dynamically formed, is already handy, the way it can be inserted into the site, whether it be the place or the most important at the right time. So when you go to the different sections and sub-folders, you can dynamically expand the different menu blocks. Moreover, the stench can be different not only for the zmist, but for the shape and design. For a static site, you can still work with such tricks, but you will also be able to add additional files to the template and still be a lot of tricks. Wanting a site writing in php does not help anything. Lose the template, yak i buv. Usim keruvateme one or a few simple php scripts.

In order to switch to another one, it is enough to write a php script for a dynamic menu formation, for example, the first heading and to change the menu of the heading through the previous script. Other headings can be formulated in a similar order. Moreover, the code of the script itself has little practical change. Change only a text file, which is meaningfully called the message and the message itself. The code of such a script is hovered below the text.

// Shaping Menu
$menu = @file($rubric1_menu);
$lines = count($menu);
for ($i = 0; $i< $lines; $i++)
{
list($menu_link,$menu_name,$menu_title)=explode("::", $menu[$i]);
if($page == rub1_part1 and $i == 0) ($refcolor = "style="color:#cc0000"";)
elseif($page == rub1_part2 and $i == 1) ($refcolor = "style="color:#cc0000"";)
elseif($page == rub1_part3 and $i == 2) ($refcolor = "style="color:#cc0000"";)
else ($refcolor = "";)
$rubric1.="

".showCat($category["children"]) ."

The order of direct entry in the array will be saved when the menu is displayed on the website. Tobto the array needs to be put in order, for which it is necessary to bring up the menu.

Note:
How the URL (address) heading may look like:
/section_1
otherwise such
/section_1/name_razdela.html
then in array_menu you need to write the exact value:
$array_menu[$i]["url"]="/section_1"
or for another vipadu:
$array_menu[$i]["url"]="/section_1/nazvanie_razdela.html";

How do you make the first menu option?
Vіn pіdsvіchuє menu less, if you know for the address of the distribution. For example, if the page address is /section_1/articles_1.html, then the menu will not be displayed.

Another variant of the code is to modify the first variant and transfer the ability to switch the menu to the articles that are found in the distributions.

Another option for the menu code in PHP

"; for ($i=0;$i ": "

"; echo "".$array_menu[$i]["title"]."

"; ) else ( echo ($URL) == ($array_menu[$i]["url"]) ? "

": "

"; echo "".$array_menu[$i]["title"]."

" ; ) ) echo ""; ?>

At this article, I will show you how you can create Different menus in PHP and MySQL. Insanely, options for this creation can be rich, but, judging by the number of your meals on this topic, you need an butt. I will bring the first yoga to my article. I’ll tell you right away what article might be sensible for you, who knows PHP and vmіє practice s MySQL. Everyone else needs to go through this, or read some books on PHP and MySQL.

For the cob, we create a table in the database with advancing fields:

• id- Unique identifier.
• title- menu anchor.
• link- addresses, on the yaku will lead the menu item.
• parent_id- Batkiv ID. If there is no batkivsky item, then it will be NULL (otherwise you can put 0).

We have sorted out the table, now the hour has come PHP code. Povniy PHP code hover below:

$ mysqli = new mysqli ( " localhost " , " root " , " " , " db " ); // Connect to the database
$result_set = $mysqli->query("SELECT * FROM `menu`"); // Robimo selection of all records from the table from the menu
$items = array(); // Array for menu items
while (($row = $result_set->fetch_assoc()) != false) $items[$row["id"]] = $row; // Fill in the array with a selection from the database
$children = array(); // An array for the characteristics of the child elements of their father's
foreach ($items as $item) (
if ($item["parent_id"]) $childrens[$item["id"]] = $item["parent_id"]; // Write the array
}
function printItem($item, $items, $children) (
/* Display menu item */
echo "

// Repairing the internal list, since there were no child elements yet
$ul=true; // Set ensign
}
echo printItem($items[$key], $items, $children); // Recursively display all child elements
}
echo "";
}
?>



Menu



foreach ($items as $item) (
if (!$item["parent_id"]) echo printItem($item, $items, $childrens); // Display all the elements of the top level
}
?>




This code is completely working, however, you are responsible for understanding that you don’t write anything like that (zokrema, visnovok through echo HTML tags). І Your task is to take the algorithm from this code, not the code itself. And then the algorithm is connected to your engine. I tried my best to comment the code to the output custom menu in PHP and MySQL, ale, insanely, vin is not a visionary and vimagaє already indecent cob knowledge. Yakshcho Vesche nasty know PHP and MySQL, then I recommend to go through cei