Mérei Tamás webdesigner

Tutorial: HTML + CSS + jQuery menü

Szerző:   |   2011-05-13

Na már megint egy menü. Ez nem tiszta CSS, kell hozzá pár sor jQuery, de valamivel talán használhatóbb, mint a legutóbbi variáció.

A működő kódot ide kattintva tudod megnézni.

Videó

HTML forráskód


<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>css menu</title>
	<link rel="stylesheet" href="style.css" />
	<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> 
</head>
<body>

<div id="container">

	<ul id="menu">
		<li>
			<div>lorem ipsum</div>
			<ul>
				<li><a href="">submenu item 1</a></li>
				<li><a href="">submenu item 1</a></li>
				<li><a href="">submenu item 1</a></li>
				<li><a href="">submenu item 1</a></li>
			</ul>
		</li>
		<li><a href="">viverra</a></li>
		<li><a href="">vestibulum</a></li>
		<li>
			<div>dolor sit</div>
			<ul>
				<li><a href="">submenu item 1</a></li>
				<li><a href="">submenu item 1</a></li>
				<li><a href="">submenu item 1</a></li>
				<li><a href="">submenu item 1</a></li>
				<li><a href="">submenu item 1</a></li>
				<li><a href="">submenu item 1</a></li>
			</ul>
		</li>
		<li><a href="">faucibus</a></li>
	</ul>

	<div style="clear:both"></div>
	
	<div id="content">
		<h1>Lorem ipsum</h1>
		<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem eros, mollis sed bibendum et, tempus a augue. Nullam tempor, purus eu vulputate lacinia, ante nibh lobortis massa, non hendrerit ligula enim ut nulla. Etiam laoreet lacinia nibh et iaculis. In ac urna massa, non cursus ante. Sed vel magna elit. Nulla consequat turpis a arcu ullamcorper posuere. Nunc accumsan interdum pellentesque. Phasellus at neque elit, et sodales neque. Aenean dapibus sodales blandit. Ut pharetra, nibh vitae rutrum posuere, mauris purus volutpat neque, sit amet dictum purus augue nec ipsum. Etiam ac tortor urna. In hac habitasse platea dictumst. Pellentesque ut tellus placerat velit commodo gravida.</p>
		<p>Suspendisse vitae tellus non nulla malesuada ultricies eget sit amet nunc. Curabitur ultricies orci rutrum ipsum pretium ac suscipit turpis mattis. Donec et gravida diam. Suspendisse vitae lacus quis purus ullamcorper fringilla. Etiam porttitor neque magna. Maecenas et ligula lorem, a laoreet dolor. Duis sollicitudin pulvinar ligula, eget imperdiet nisl varius vel. Nulla facilisi. Vestibulum orci felis, semper nec sodales eget, molestie vel lorem. Integer tincidunt, est non fermentum dignissim, neque magna vehicula sapien, eget blandit ante nibh eu lorem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Etiam justo magna, molestie et scelerisque quis, convallis in diam. Nam diam enim, sagittis venenatis tempus vel, imperdiet in mauris. Suspendisse viverra tortor ac tellus molestie placerat. Aliquam ligula lacus, viverra quis pretium at, dignissim vel leo. Integer tristique massa ut magna eleifend eget laoreet tellus rutrum.</p>
	</div>
</div>

</body>
</html>

CSS forráskód


* {
	padding: 0;
	margin: 0;
}
body {
	background: #999;
	font-family: arial,tahoma,verdana;
	font-size: 11px;
	margin-top: 30px;
}
div#container {
	width: 740px;
	margin: 0 auto;
}
div#content {
	background: #898989;
	color: #fff;
	padding: 20px;
	margin-top: 1px;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	border-top-right-radius: 10px;
	box-shadow: 2px 2px 2px #787878;
}
div#content h1 {
	font-family: georgia;
	font-size: 30px;
	margin: 0 0 20px 0;
	padding: 0;
}
div#content p {
	text-align: justify;
	line-height: 18px;
	margin: 0 0 10px 0;
}
ul#menu a,
ul#menu div {
	padding: 10px 20px;
	display: block;
	color: #fff;
	text-decoration: none;
	text-shadow: 1px 1px 1px #000;
	font-weight: bold;
}
ul#menu div {
	cursor: pointer;
	background: url('arrow_down.png') no-repeat 95% 50%;
}
ul#menu li {
	list-style: none;
	float: left;
	color: #fff;
	font-size: 14px;
	text-transform: uppercase;
	background: #7d1783;
	background: -moz-linear-gradient(top, #a821b0 0%, #7d1783 100%);
	background: -webkit-gradient(linear, left top, left bottom, from(#a821b0), to(#7d1783));
	margin-right: 1px;
	width: 140px;
	text-align: center;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}
ul#menu li:hover {
	background: #650c6a;
}
ul#menu li ul {
	display: none;
	position: absolute;
	border-top: 1px solid transparent;
}
ul#menu ul li {
	float: none;
	text-transform: lowercase;
	margin: 0;
	background: url('arrow_right.png') no-repeat #3f3f3f 5% 50%;
	font-size: 11px;
	border-radius: 0;
	box-shadow: none;
}
ul#menu ul li:hover {
	background: url('arrow_right.png') no-repeat #000 5% 50%;
}
ul#menu ul li a {
	padding: 10px;
}

jQuery forráskód


$(document).ready(function(){
	
	$("ul#menu li:last-child").css("margin-right",0);

	$("ul#menu div").click(
		function(){

			$(this).parent().find("div").css("background-image","url(arrow_up.png)");
			$(this).parent().find("ul").slideDown("slow");

			$(this).parent().hover(
				function(){},
				function(){
					$(this).parent().find("ul").slideUp('slow');
					$(this).parent().find("div").css("background-image","url(arrow_down.png)");
				}
			);

		}
	);
});

Mérei Tamás Webdesigner

Szerző

Mérei Tamás vagyok, webdesigner. Reszponzív weboldalak készítésével foglalkozom, grafikai tervezéstől a HTML + CSS kódolásig.

Ismerj meg! Nézd meg eddigi munkáimat! Lépj velem kapcsolatba!

77 hozzászólás

  1. bary44
    2013. október 22. kedd - 16:35

    Helló!

    Először is köszi a kódot és a tutorialt! 🙂 Egy gyakran visszatérő problémám lenne viszont: IE alatt nem oké a dolog. (Nekem IE 10 van a gépen.) Van valami ötleted hogy lehetne ezt kiküszöbölni? Az átszínezéseket, meg hogy elcsúszik a menüsor még csak-csak megoldom egy külön css-ben, de sajnos a legördülő menü egyáltalán nem működik. Szakdogához kéne a honlap, szóval nagyon hálás lennék bármilyen ötletért, válaszért. 🙂

    Üdv!

    • bary44
      2013. október 22. kedd - 17:33

      Bocs, azt kihagytam, hogy offline nem működik. Kíváncsiságból feltettem ideiglenesen egy ingyenes uw.hu-s tárhelyre, és ott jó volt…

    • cyrex
      2013. október 23. szerda - 19:32

      Lokálban engedélyezni kell IE alatt, hogy működjön a JS, elvileg fel is dobja a kérdést amikor megnyitod a fájlt.

  2. Rohamparaszt
    2013. szeptember 2. hétfő - 16:17

    Üdv.

    Egy kérdésem lenne, hogy lehetne azt megoldani, hogy csak a kis nyílra kattintva jöjjön elő a menü? Szóval a menügomb nyisson meg egy adott hivatkozást, és a kis képre,nyílra kattintva tudjam előhozni a menüt?

    Tisztelettel: Rp

    • cyrex
      2013. szeptember 5. csütörtök - 14:20

      Adsz egy classnevet a DIV-nek amiben a nyilacska található, és arra írsz jQuery-ben click eseményt ami megjeleníti az almenüt.

  3. Fekete Béla
    2013. május 12. vasárnap - 14:20

    Szia!

    Nagyon tetszik a vweboldalad és a bemutató videóid! Nagyon örültem, mikor megtaláltam, mert ezek az első olyan videók, amiről lejött azonnal, hogy aki csilája, az profi!

    Tetszett a menü megoldásod és ez miatt is írok.
    Kérlek segíts abban, hogy lehet megoldani, hogy a menüben lévő hivatkozások a “content” részben jelenjenek meg!

    Jelenleg a kezdő, illetve a tanuló fázisban vagyok, de felválaltam a vállalkozásom weboldalának elkészítését és ehhez szükségem van a segítségedre!

    Előre is köszi!

    Csövi

    • cyrex
      2013. július 13. szombat - 22:19

      Nem értem a kérdést pontosan.

    • Roni
      2013. december 15. vasárnap - 12:37

      értem mire gondolsz, de szerintem május óta a kedved elment az egésztől :DDDD

  4. Jeszi
    2013. február 24. vasárnap - 15:19

    Üdv! Meg szeretném tudakolni miként tudnék még további almenüket be tenni nagyon fontos volna számomra.
    Előre is köszi a segítséget.

  5. Jack
    2012. október 5. péntek - 14:30

    Szia!
    Van egy weboldalam, melyben egy javascript menu segítségével váltogatom az oldalakat, s töltöm be őket középre. Az egyik ilyen új oldalra szeretném berakni az általad készített jQuery menüt. Ha csak ezt az oldalt nyitom meg akkor minden simán klappol, viszont ha a főoldalról nyitom meg, akkor csak a menüpontok jelennek meg, de már nem gördül le a menü. Volna esetleg ötleted, hogy mi lehet a gond ezzel?
    Üdv: jack

  6. -Raptor-
    2012. augusztus 5. vasárnap - 12:26

    Szia Cyrex!

    azt hogyan csináljam meg, hogy ha ráviszem az egeret egy almenü pontra ott még egy menü jelenjen meg?

    • cyrex
      2013. július 13. szombat - 22:18

      “CSS multilevel drop down menu” kulcsszavakra guglizz.

  7. -Raptor-
    2012. augusztus 5. vasárnap - 12:24

    Szia Cyrex!

    Azt hogyan csináljam meg, hogy ha ráviszem az egeret az egyik almenü pontra ott legördüljön még egy menü?

    A választ előre is köszönöm!

  8. copy112x
    2012. június 19. kedd - 12:06

    Üdv!
    Nagyon tetszett videód.
    A nyilakat feltudnád tölteni valahova mert már többször is okozott nekem problémát az hogy nem találtam megfelelő képet.Előre is köszi.:)

    • cyrex
      2012. június 19. kedd - 21:57

      Nincs már meg nekem ez a cucc. Photoshop-ban 5 kattintással tudsz rajzolni ilyen nyilat.

  9. Krapu
    2012. április 17. kedd - 16:04

    Szia Cyrex.

    Nagyon jó a menű, és szeretném is használni, de van egy gondom. Flash et szeretnék a menü alá közvetlen berakni. Firefoxba müxik a dolog, de se ie. ben, se chrome ban nem müxik. Tudnál valamiféle megoldást a problémámra?

    Köszi előre is

    • cyrex
      2012. május 7. hétfő - 21:41

      Mi a gond vele? Eltakarja a flash a menüt? Mert ez szokott tipikus probléma lenni amin a z-index-el, illetve wmode=”trasparent” segítségével lehet javítani.

  10. Ventosite.info
    2012. március 29. csütörtök - 19:22

    Amúgy SlideUp helyett használhattok sllideToggle-t is és akkor nem kell szórakozni azzal hogy leellenőrizd hogy mikor lép életbe az onmouseover.

  11. HendRoox
    2012. március 10. szombat - 23:19

    A nyilakat honnan lehet letölteni? :$

  12. Erneszto
    2012. február 22. szerda - 19:03

    Hello.Eloszor is gratulalni szeretnek a videoidhoz nagyon jok sokat lehet tanulni beloluk.
    Ennek a videonak az alapjan keszitettem a most keszulo veboldalamra egy olyan reszt ahol egy gomb katintasara lenyilik egy ablak.Eddig meg is van szepen is nez ki de hogyan tudnam azt megcsinalni hogy a lenyilo ablakban legyen egy “bezar” feliratu gomb es csak annak a lenyomasavval zaruljon be az ablak es nem hover esemenyre.
    A bezar gombot meg is csinaltam a lenyilo ablakban csak azt nem tudom hogy birjam mukodesre kesztetni:).
    Elore is koszonom a valaszt.
    Segitsegnek itt van a link ahol meg is tekintheto: http://www.play.erneszthome.com/

    • Erneszto
      2012. február 26. vasárnap - 17:08

      Az eredeti kerdesemet megoldottam megpeddig igy :

      $(document).ready(function(){
      $(“ul#fixed_top li div”).click(function(){
      $(this).parent().find(“div.button_fixed_top”).css(“background-image”,”url(style/img/menu/arrow_up.png)”);
      $(this).parent().find(“ul div”).slideUp(“slow”);
      $(this).parent().find(“ul div”).slideDown(“slow”);
      });
      $(“div.close”).click(function(){
      $(this).parent(“div:first”).slideUp(‘slow’);
      });
      });

      de ujabb problemaba utkoztem,espeddig,hogy mivvel tobb divet is le lehet nyitni evvel a koddal amit csinaltam nem lehet bezarni oket csak ugy ha a close gombra van katintva.
      Ugy szeretnem megoldani hogy ha le van nyitva egy div es meg szeretnek nyitni egy masikat is akkor az elozo az automatikusan bezarodjon es minddig csak az utolag megnyitott legyen nyitva.
      Nagyon sokat jelentenne nekem ennek a dolognak a megoldasa ,kerem segitsen aki tudja a valaszt ra.
      Koszonom elore is

  13. Nazinorbi
    2012. február 17. péntek - 12:27

    nagyon jó ez a tutorial cyrex 🙂 Abban kérem a segítségedet hogy mi lehet a probléma és a megoldás. Van egy article fejléc teg em, az alatt van egy törzs teg em ugyan csak article ben, a törzs ben pedig 3 további article van folat al egymás mellé lebegtetve. A fejléc és a törzs pozicionálása relatív, a többi pedig absolute. A probléma az, hogy amikor rá kattintok a a menüre és le gördül azok az almenük amik bele lógnak az alatta lévő teg ekbe nem lehet rá kattintani, de még azt sem érzékeli hogy egér mutató van fölötte. Ha feljebb viszem a menüt akkor probléma nélkül működik. Mi lehet a probléma?

  14. OwN3D By
    2011. december 16. péntek - 07:52

    Hali kérhetnék olyan nyilakat? PS 3maqmmal nem tok csinálni :O és kiakarok próbálni vmit 🙁

  15. KMartinR4
    2011. november 18. péntek - 18:37

    Nagyon jó a videó, köszi! Sokat segített (meg a többi is)! 🙂

    Az a problémám, hogy a “Tutorial: HTML + CSS az alapoktól 8. rész” (cyrex.hu/2010/12/14/tutorial-html-css-az-alapoktol-8-resz) videóban látott weboldalt és ezt a jQuery menüt kombinálni akartam, azzal a változtatással, hogy a ‘container’ id-jű div-ben lévő tartalmat egy újonnan létrehozott ‘content’ div-be helyeztem (és minden stíluselemet is, kivéve a 800pixeles szélességet).
    De a menü nem akar a container-en belül bal oldalt helyezkedni.

    Tehát a lényeg az lenne, hogy a menü nem akar bal oldalt elhelyezkedni a menü, ha pedig ‘float: left’-et használok, akkor csak megnő a távolság a menü és az oldal között. Ezt hogy lehetne megoldani?

    • KMartinR4
      2011. november 27. vasárnap - 16:25

      Ez a problémám is megoldódott, én hülye elfelejtettem kikapcsolni a magrin-t és a padding-et. 😀

  16. cartmen123
    2011. október 14. péntek - 18:23

    Helo! Az előző kommenthez kicsit kapcsolódik a kérdésem, de csak annyiban, hogy én egy olyan javascriptet helyeztem az oldalra, ami ha egy linkre viszem az egeret, megjelenít egy képet szöveget stb, ami követi az egeret, amíg a linken mozgatom. és automatikusan úgy teszi a képet, hogy beférjen az ablakba. Innen: http://mootools.net/ De az a problémám, hogy ekkor a jquerry meghal. Ezzel mit lehet kezdeni? Miért nem megy egymással a kettő? Köszi

    • cartmen123
      2011. október 14. péntek - 19:10

      Eddig divekkel oldottam meg egyszerű js-sel, de annak az volt a hátránya hogy css-ben meg kellett adnom a div pontos helyét, ezáltal, ha 1024-nél nagyobb képernyővel nyitják meg, máshova került az oldalhoz képest. Van még valamilyen js megoldás, ami nem ütközik a jqurreyvel?

    • cartmen123
      2011. október 15. szombat - 15:51

      köszi. megoldottam. Találtam jquery-t, ami ugyan nem ismeri fel a window széleit, de legalább nem ezer soros kód, és így nem akad össze a másikkal, kis barkáccsal jól működik. 🙂 A diveket meg (abszolút-relatív) kombó helyzetbe raktam, hogy erre eddig miért nem gondoltam? 🙂

  17. Misi
    2011. október 11. kedd - 21:13

    Én nem azt kérdeztem ,hogy lehet-e több javascript egy oldalon hanem ,”hogy lehet rakni több javascriptet egy oldalra?”

    • Ps
      2011. október 12. szerda - 14:23

      Az előző hozzászólásomba beraktam a példát is csak nem jeleníti meg az oldal a html tagokat.
      De itt van képben mit hogyan kell remélem tudtam segíteni ha nem akkor írj ismét hozzászólásban.
      kép: http://noob.hu/2011/10/12/jshelper.png

  18. Misi
    2011. október 9. vasárnap - 21:37

    Üdv
    Lenne egy olyan kérdésem ,hogy lehet több javascript rakni 1 oldalra?Mert nekem nem jön össze sehogy.

    • Ps
      2011. október 10. hétfő - 10:44

      Szia.

      Már miért ne lehetne több javascriptet berakni 1 oldalra?

  19. bugu
    2011. október 6. csütörtök - 00:01

    hali nekem anyi gondom lenne hogy beraktam a menüt a weblapomhoz.
    és a css fájlban ugye egy * karakterrel kezdődik. Nah ha azt kihagyom gondolom észrevétlenül hagya a padding,margin beállítást, de ilyenkor az al-menük elcsüsznak, ha oda rakom a * karaktert akkor jó helyen van az al menü, viszont az egész weblapom középre igazítását figyelmen kívül felrak mindent a bal sarokba.. mi lehet a gond?

  20. dj
    2011. október 2. vasárnap - 17:14

    szia hogy kell aszt megcsinálni hogy a menü linkeit középre nyisa meg?

    • OwN3D By
      2011. október 8. szombat - 10:46

      asztat, előbb írd le rendesen….

      menü linkjei középen legyenek,
      vagy amit a linkekkel nyitsz meg középre tegye
      de legegyszerűbb a text-align: center;

    • dj
      2011. október 12. szerda - 23:27

      amit a linkekkel nyitok meg

  21. Raim
    2011. szeptember 28. szerda - 19:15

    Szia cyrex!!! Lenne egy olyan kérdésem hogy hogyan lehetne azt megcsinálni hogy felfele nyíljanak a rejtett menük?

  22. cartmen123
    2011. szeptember 8. csütörtök - 13:21

    Szia! Grat a videóidhoz! Végre nálunk is csinál valaki minőségi, logikus tutoriálokat. Nekem az lenne a kérdésem, hogy mit kell átírni, hogy amikor a menüre kattintok, betöltetem az új oldalt, akkor az új oldalon a menün ahová kattintottam, más színű maradjon, jelezve, hogy hol vagyok? Köszi

    • paprika
      2011. szeptember 10. szombat - 19:34

      Hát én azt inkább php-val oldanám meg! ha nemtudod hogykell akkor msn:papri07@hotmail.com és segítek:)

    • Ps
      2011. szeptember 15. csütörtök - 10:13

      Szia.

      Szerintem az lenne a leg kézenfekvőbb ha php-ban lekérnéd az URL-ből hogy éppen melyik oldalon vagy, és akkor 1 if-es feltétellel megadni hogy ha X oldalon van akkor a link legyen Y színű.

      Üdv.: Ps

    • cartmen123
      2011. szeptember 17. szombat - 15:06

      Oh, köszi. Nem értek PHP-hoz egyáltalán. Megoldottam máshogy 🙂 Köszi

    • paprika
      2011. szeptember 17. szombat - 20:19

      Máshogy nemtudom hogylehetne megcsinálni:D

    • cartmen123
      2011. szeptember 19. hétfő - 23:14

      Hát úgy, hogy nálam mák, mivel a lenyíló menükön csak file-ok megnyitását használom új ablakban, ezért ott nem kell, a többinél meg egyszerűen kiszedem a href linkelést az adott oldalon, ezáltal a block típus megszűnik, és összemegy a menü padding, így máris elkülönül a többitől azon az oldalon 🙂 kissé barkácsmegoldás, de megteszi 🙂
      Most a wordpressel bajlódom, ami tele php-val, ebben lehet segítségedet kérném majd, ha elakadok a kódturkászásban néhol, és megköszönöm, ha segítesz

    • cyrex
      2011. szeptember 20. kedd - 00:22

      PHP-val célszerű megoldani, a legelegánsabb megoldás, ha arra az LI tag-re teszel egy class-t amelyik éppen aktív.
      Tehát valami ilyesmi: <li class=”selected” > és akkor utána azt csinálsz vele a CSS-ben amit akarsz.

  23. Attila
    2011. augusztus 31. szerda - 07:37

    Üdv!
    Még eléggé kezdő vagyok, szeretnék egy kis segítséget kérni. Hogyan tudom elérni azt, hogy az egyes menüpontokra kattintva, a tartalom az oldalon belül, egy DIV-ben jelenjen meg? Jó lenne akár oktatóvideó formában is 🙂 , de bármilyen segítséget szivesen fogadnék 🙂 Előre is köszönöm.

  24. ReviSe
    2011. augusztus 15. hétfő - 15:38

    hello. lenne egy kérdésem h a ” border-top-left-radius ” meg a hasonlo barátai nem jelennek meg minden böngészőn kerekítve és az lenne a kérdésem h ezt h lehetne kiküszöbölni ? :/

    • cyrex
      2011. augusztus 15. hétfő - 15:48

      Háttérképekkel lehet ügyködni, de szerintem fölösleges. Aki szar böngészőt használ, megérdemli, hogy ne lássa a lekerekítéseket.

  25. mz/x
    2011. augusztus 3. szerda - 20:03

    igen sajnos és másik gépeken is

  26. mz/x
    2011. augusztus 3. szerda - 09:12

    Ez időközben megoldódott a karakterkódolásom volt rossz, de most lenne egy másik kérdésem: miért van az, hogy a legördülő menü a tetejéhez képest arréb csúszik kb. egy centit? Mindent úgy csináltam ahogy a videóban mondtad, de nem sikerül.

    • cyrex
      2011. augusztus 3. szerda - 16:29

      Mindegyik böngészőben rossz?

  27. mz/x
    2011. augusztus 1. hétfő - 20:19

    Szia megnéztem a videódat nagyon tetszett. Leszedtem a teáltalad írt kódot kipróbáltam és ment úgy ahogy a videóban,csak az ékezetes betűk nem hogyan lehetne ezt kiküszöbölni? mihamarabbi válaszát előre is köszönöm.

  28. ImI
    2011. július 17. vasárnap - 16:13

    Helloka, nézegettem a vidid sokat segített, viszont csináltam egy oldalt amire előre elkészítettem a gombokat, lennének almenük is, viszont nem tudtam még elkészíteni a jQueryvel esetleg más megoldást tudsz javasolni üdv.

    • cyrex
      2011. augusztus 3. szerda - 16:30

      Igen, tiszta CSS-t, javascript nélkül. Erre is találsz videót az oldalon.

  29. paprika
    2011. július 9. szombat - 08:47

    Hello!Szeretném megkérdezni hogy ehez hasonló http://noob.hu/2011/07/09/hehe.png legördülő menüt hogy tudnék csinálni? nem a legördülő menüevl van problémám hanem hogy jobb kezdődjön a legördülő rész mármint hogy ha a jobb felső sarokban van a cucc akkor ne tolja el az egész oldalt jobbra! nemtudom mennyire érthető a kérdésem:D ha valaki tudja aválaszt pls írja meg:) köszi előre is:D

    • Hµmanimal
      2011. július 11. hétfő - 20:49

      szval azt akarod h olyan irányban jöjjön le…azt csak a css-ben kell beállítanod…

    • paprikaaa
      2011. július 11. hétfő - 22:00

      hát de pontosan mivel tudom azt beállítani?

  30. jani960
    2011. június 25. szombat - 15:03

    Szia :)!
    Remélem jó helyre írok :D. Szóval szeretnék egy ” legördülő szöveget “! Kicsit utánaolvastam a neten, de egyértelmű választ nem kaptam. Tehát azt szeretném, hogyha egy adott szövegre rákattintok, akkor alatta legördül a megjelenítendő szöveg, valahogy olyasmi formában mint ahogyan ezt a menüt is elkészítetted, csak itt simán egy szöveg jön le, hogy Elérhetőségek, stb. DE, ugyanakkor ezt fel is lehetne görgetni, hogy eltűnjön a szöveg. Angol megnevezést is kerestem és valamelyik hozzászólásban ” fieldset ” -nek írták.

    Ha tudnál nekem segíteni azt nagyon megköszönném.
    A választ előre is köszi.

    (Remélem eltudtam magyarázni. :])

    • jani960
      2011. június 25. szombat - 15:08

      Bocsi, nem reklámozni akarok, de ezen a honlapon: “http://ucp.seerpg.net/tamogatas.see” megtalálod amire gondoltam. Tehát ott a Fehér “Támogatás” szöveg alatt és a táblázat felett, tehát a fehér Támogatás és a táblázat között van egy “Beváltás” felirat előtte meg egy + jel. Ha arra szövegre rákattintasz, akkor majd előhoz alatta egy szöveget. 🙂

      Remélem így már kicsivel érthetőbb. 😀

  31. ZoliKa
    2011. június 18. szombat - 14:27

    Nagyon jó videó, ez egy gyakran előfordul probléma. Ha ezt elsajátítja az ember utána jöhet ez -> http://net.tutsplus.com/tutorials/html-css-techniques/how-to-build-a-kick-butt-css3-mega-drop-down-menu/
    Igaz ehhez nagyon kevés angol tudás nem ár.

  32. tillgabi
    2011. június 13. hétfő - 20:03

    Klassz videó!
    Köszönjük, hogy elkészítetted!

  33. css menu
    2011. május 19. csütörtök - 14:33

    Szia! Csinálnál egy olyan vidit amiben sima képekből csinálsz egyszerü menüt előre kösz

    • Lexar
      2011. június 5. vasárnap - 19:08

      Szerintem ilyen már van. Nézz körbe

  34. ps
    2011. május 14. szombat - 17:32

    Üdv.

    Ez a jQuery-menü nagyon jó.
    Én még szívesen látnék JavaScriptes és jQuery dolgokat.

    Köszönjük a videót!

  35. fjuhorgasz
    2011. május 14. szombat - 12:03

    ez nem ide tartozik, de segítség kéne akárkitől…feltettem a wordpresst és mikor bejegyzést szerkesztek, amit a szerkesztőbe írok azt nem látom csak ha kijelölöm…de az oldalon normálisan megjelenik…csak így rossz vaktában szerkeszteni…nem tudtok rá valami megoldást?…előre is köszi…

    • fjuhorgasz
      2011. május 15. vasárnap - 20:04

      nah?…tud valaki valami megoldást?…

  36. feco132
    2011. május 14. szombat - 10:38

    Nagyon vártam az új videódat!
    Jó lett, köszi!
    Remélem mihamarabb nézhetem a következőt!

  37. ikristof
    2011. május 13. péntek - 21:16

    Köszönjük ezt a friss profi videót. 🙂

  38. Ujfiu
    2011. május 13. péntek - 14:42

    Grat jó videó 🙂

  39. Menyus
    2011. május 13. péntek - 14:33

    Ohóó!! Végre egy új videó! Nagyon jó! Köszönjük Cyrex! 😀

  40. PePe
    2011. május 13. péntek - 14:30

    ÜDV! szép videó, a kérdés az lenne, hogy hogyan lehetne azt megoldani, hogy ne kelljen rakattintani a menupontra hanem csak fole mozgatni es igy jojjenek elo az almenuk?

    • cyrex
      2011. május 13. péntek - 14:38

      Hát nem a click, hanem a hover eseményt vizsgálod. De akkor ezt a kódot át kell alakítani hozzá egy kicsit.

    • PePe
      2011. május 13. péntek - 16:30

      2 óra alatt idáig jutottam el : http://pepeweb.square7.ch/ a jQuery valami miatt nem ugy megy ahogy kene, valami tipp?

Hozzászólás

Legújabb hozzászólások