Answer the question
In order to leave comments, you need to log in
How to fix dropdown menu on mobile devices?
Good day!
I'm making a website based on the Artisteer template with bootstrap binding - larkinpravo.ru/, I can't get the sub-items of the mobile menu to work.
When the button is clicked, the ul class is set to display:block; or the visible class, which actually opens the menu itself, I can’t figure out how to do the same with li subitems.
I can’t figure out how to make LI sub-items expand and show the UL nested in them (3rd menu level)
Please tell me!
.responsive .nav .menu-btn
{
display: inline-block;
}
.responsive .nav .hmenu.visible
{
display: block;
}
<?php
defined('_JEXEC') or die;
require_once dirname(dirname(dirname(__FILE__))) . DIRECTORY_SEPARATOR . 'functions.php';
// Note: it is important to remove spaces between elements.
$tag = ($params->get('tag_id') != NULL) ? ' id="' . $params->get('tag_id') . '"' : '';
if (isset($attribs['name']) && $attribs['name'] == 'user3') {
$menutype = 'horizontal';
$start = $params->get('startLevel');
// check if it is necessary to render subitems:
$subitems = $GLOBALS['artx_settings']['menu']['show_submenus'] && 1 == $params->get('showAllChildren');
// true - skip the current node, false - render the current node.
$skip = false;
echo '<ul class="hmenu"' . $tag . '>';
foreach ($list as $i => & $item) {
if ($skip) {
if ($item->shallower) {
if (($item->level - $item->level_diff) <= $limit) {
echo '</li>' . str_repeat('</ul></li>', $limit - $item->level + $item->level_diff);
$skip = false;
}
}
continue;
}
$class = 'item-' . $item->id;
$class .= $item->id == $active_id ? ' current' : '';
$class .= ('alias' == $item->type
&& in_array($item->params->get('aliasoptions'), $path)
|| in_array($item->id, $path)) ? ' active' : '';
$class .= $item->deeper ? ' deeper' : '';
$class .= $item->parent ? ' parent' : '';
echo '<li class="' . $class . '" aria-haspopup="true" tabindex="1">';
// Render the menu item.
switch ($item->type) {
case 'separator':
case 'url':
case 'component':
require JModuleHelper::getLayoutPath('mod_menu', 'default_' . $item->type);
break;
default:
require JModuleHelper::getLayoutPath('mod_menu', 'default_url');
break;
}
if ($item->deeper) {
if (!$subitems) {
$limit = $item->level;
$skip = true;
continue;
}
echo '<ul>';
}
elseif ($item->shallower)
echo '</li>' . str_repeat('</ul></li>', $item->level_diff);
else
echo '</li>';
}
echo '</ul>';
} else if (0 === strpos($params->get('moduleclass_sfx'), 'vmenu') || false !== strpos($params->get('moduleclass_sfx'), ' vmenu')) {
$menutype = 'vertical';
$start = $params->get('startLevel');
// check if it is necessary to render subitems:
$subitems = $GLOBALS['artx_settings']['vmenu']['show_submenus'] && 1 == $params->get('showAllChildren');
// true - skip the current node, false - render the current node.
$skip = false;
// limit of rendering - skip items when a level is exceeding the limit.
$limit = $start;
echo '<ul class="vmenu"' . $tag . '>';
foreach ($list as $i => & $item) {
if ($skip) {
if ($item->shallower) {
if (($item->level - $item->level_diff) <= $limit) {
echo '</li>' . str_repeat('</ul></li>', $limit - $item->level + $item->level_diff);
$skip = false;
}
}
continue;
}
$class = 'item-' . $item->id;
$class .= $item->id == $active_id ? ' current' : '';
$class .= ('alias' == $item->type
&& in_array($item->params->get('aliasoptions'), $path)
|| in_array($item->id, $path)) ? ' active' : '';
$class .= $item->deeper ? ' deeper' : '';
$class .= $item->parent ? ' parent' : '';
echo '<li class="' . $class . '" aria-haspopup="true" tabindex="1">';
// Render the menu item.
switch ($item->type) {
case 'separator':
case 'url':
case 'component':
require JModuleHelper::getLayoutPath('mod_menu', 'default_' . $item->type);
break;
default:
require JModuleHelper::getLayoutPath('mod_menu', 'default_url');
break;
}
if ($item->deeper) {
if (!$subitems) {
$limit = $item->level;
$skip = true;
continue;
}
echo '<ul' . ($subitems && in_array($item->id, $path) ? ' class="active"' : '') . ' aria-haspopup="true" tabindex="1">';
}
elseif ($item->shallower)
echo '</li>' . str_repeat('</ul></li>', $item->level_diff);
else
echo '</li>';
}
echo '</ul>';
} else {
$menutype = 'default';
echo '<ul class="menu' . $params->get('class_sfx') . '"' . $tag . '>';
foreach ($list as $i => &$item) {
$class = 'item-' . $item->id;
$class .= $item->id == $active_id ? ' current' : '';
$class .= ('alias' == $item->type
&& in_array($item->params->get('aliasoptions'), $path)
|| in_array($item->id, $path)) ? ' active' : '';
$class .= $item->deeper ? ' deeper' : '';
$class .= $item->parent ? ' parent' : '';
echo '<li class="' . $class . '">';
// Render the menu item.
switch ($item->type) {
case 'separator':
case 'url':
case 'component':
require JModuleHelper::getLayoutPath('mod_menu', 'default_'.$item->type);
break;
default:
require JModuleHelper::getLayoutPath('mod_menu', 'default_url');
break;
}
if ($item->deeper)
echo '<ul>';
elseif ($item->shallower)
echo '</li>' . str_repeat('</ul></li>', $item->level_diff);
else
echo '</li>';
}
echo '</ul>';
}
Answer the question
In order to leave comments, you need to log in
You have links processed there somehow, that's where they are processed, there: if a mobile device - open a sub-item, otherwise - follow the link.
And the code that you threw off is not about that at all)
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question