Dropdown menu – JavaScript, AJAX, jQuery – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu
Reklama
Reklama

Dropdown menu – JavaScript, AJAX, jQuery – Fórum – Programujte.comDropdown menu – JavaScript, AJAX, jQuery – Fórum – Programujte.com

 

Hledá se programátor! Plat 1 800 € + bonusy (firma Boxmol.com)
Benjamin
~ Anonymní uživatel
5 příspěvků
30. 6. 2016   #1
-
0
-

Dobrý den,

potřebuji udělat vertical dropdown menu. Mám následující kod:

<div class="menu_vlevo">
<h2></h2>
 <ul>
        <li><a href="#">Menu 1</a></li>
        <li><a href="#">Menu 2</a>
            <ul>
                <li><a href="#">Sub menu 1</a></li>
                <li><a href="#">Sub menu 2</a></li>
            </ul>
        </li>
        <li><a href="#">Menu 3</a></li>
        <li><a href="#">Menu 4</a></li>
    </ul>

<script>
$(document).ready(function(){
    $('li').click(function(){
        $(this).children('ul').toggle();
    });
});
</script>

<style>

.menu_vlevo
{
	float:left;
  padding:0px 0px 20px 0px; 
  min-height:250px; 
  width:25%;
  position:relative; 
}

.menu_vlevo ul
{
	  list-style: none;
    margin: 0;
    padding: 0;
} 

.menu_vlevo li 
{
	
    color: #00cccc; 
    padding: 4px 0px 8px 0px;
    text-decoration: none;
    list-style:none;
    
}

.menu_vlevo li a
{
	  display: inline-block;
    color: #00cccc; 
    padding: 4px 0px 8px 27px;
    text-decoration: none;
    list-style:none;
    
}

.menu_vlevo li a:hover
{
	  display: inline-block;
    color: #ff6600; 
    padding: 4px 0px 8px 27px;
    text-decoration: none;
    list-style:none;
    background:url('../img/linka_side.gif');
}


.menu_vlevo li ul
{
	display:none;
	padding-left:20px;
}



.menu_vlevo li li a
{
	line-height:120%;
	
}
</style>

Při kliku na položku, která rozbaluje, bych potřeboval, aby tam to rozbalené menu zůstalo. Funguje to, pokud mám adresu a rel="nofollow" href="" prázdnou, ale pokud začnu směrovat na stránku, kam má,tak se to přesměruje, což je logické, já vím. Máte někdo radu? Změnit strukturu menu?

Nahlásit jako SPAM
IP: 93.181.80.–
Reklama
Reklama
NeregistrovanyHookyns
~ Anonymní uživatel
62 příspěvků
1. 7. 2016   #2
-
0
-

Jakou radu? Trochu nechápu, o co ti jde. Aby menu zůstalo rozbalené i po přechodu na stránku? To se řeší na back-endu.

Ověříš adresu daného prvku v menu s aktuální adresou a pokud bude shodná, tak tam přidáš nějakou třídu, která menu rozbalí. Případně to můžeš vyřešit i v JS, protože se také dostaneš k adrese.

Nahlásit jako SPAM
IP: 77.95.192.–
peter
~ Anonymní uživatel
2532 příspěvků
11. 7. 2016   #3
-
0
-

jak mas ten kod
 

$(document).ready(function(){
    $('li').click(function(){
        $(this).children('ul').toggle();
    });
});

Tak nejak podobne tam pridas zmenu className pro location.href
 

$(document).ready(function(){
    $('li').click(function(){
        $(this).children('ul').toggle();
    });
    $('li a').projitvsechny {odkaz} {
if (odkaz.href == location.href) ... odkaz.parentNode.parentNode.className = 'rozbalene';
}
});

Jak se to pise presne v jquery se mi nechce googlovat. Kazdopadne pro zanorene odkazy bude treba nastavit rozbaleni i pro vsechny nadrazene UL. (cili vsechny parentNode typu UL nebo v jquery mozna parent, parent.parent, ...)

Nahlásit jako SPAM
IP: 2001:718:2601:26c:cce1:59...–
Zjistit počet nových příspěvků

Přidej příspěvek

Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!

Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 11 hostů

Podobná vlákna

Dropdown menu — založil CuCo

DropDown Menu — založil Mishsuli

Inline dropdown menu — založil Hanulik

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032016 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý