WN - CSS meny

WN (https://www.wn.se/forum/index.php)

- Klientsidans teknologier, design och grafik (https://www.wn.se/forum/forumdisplay.php?f=12)

- - CSS meny (https://www.wn.se/forum/showthread.php?t=37211)

Jolla

2009-06-03 14:04

Hejsan!

En polare frågade mig om hjälp om en sak till hans hemsida.

Han vill ha en meny som har detta utseendet, med sådana dropdowns:

http://designsensory.com/

Är det någon där ute som har en kod för en sådan meny? Eller vet ni någon BRA tutorial som går igenom hur man gör en?

Skulle vara mycket tacksam för hjälp samt svar!

Mvh
Jolla

BoXon

2009-06-03 16:10

Faktiskt gjort en egen sådan en gång för länge sedan som ett experiment, jag använde dock javascript då. Är du intresserad utav koden så vet du vart jag finns! :)

taz76

2009-06-03 16:31

Det är inte så svårt att göra.. vid hover så gömmer man den gamla divven och visar den nya. Borde funka finfint :)

Exempelvis jQuery har väldigt smidiga funktioner för detta:

$('#div_menu1').hover(function{
/* hover */
$(this).show(); $(/* id för gamla menyn */).hide();
}, function() {
/* hover utanför */
$(this).hide(); $(/* id för gamla menyn */).show();
});

Nått sånt där ;)

Finns mer här: http://docs.jquery.com/Events/hover#overout

Jonor

2009-06-04 19:19

Citat:

Originally posted by taz76@Jun 3 2009, 16:31
Det är inte så svårt att göra.. vid hover så gömmer man den gamla divven och visar den nya. Borde funka finfint
Exempelvis jQuery har väldigt smidiga funktioner för detta:
(#div_menu1).hover(function{
/* hover */
(this).show(); (/* id för gamla menyn */).hide();
}, function() {
/* hover utanför */
(this).hide(); (/* id för gamla menyn */).show();
});
Nått sånt där
Finns mer här: http://docs.jquery.com/Events/hover#overout

Bra länk!

Dock så måste jag fråga. Ni som håller på med webbprogrammering , brukar ni komma ihåg sådan här jQuery/Javascript kod. Jag kan HTML samt lite PHP men direkt jag försöker lära mig något javascript så lägger jag ner direkt, blir alltid copy paste med modifikationer :P

taz76

2009-06-04 21:41

Citat:

Originally posted by Jonor@Jun 4 2009, 19:19
Dock så måste jag fråga. Ni som håller på med webbprogrammering , brukar ni komma ihåg sådan här jQuery/Javascript kod. Jag kan HTML samt lite PHP men direkt jag försöker lära mig något javascript så lägger jag ner direkt, blir alltid copy paste med modifikationer :P

Det beror på.. allt kommer jag givetvis inte ihåg men en snabb titt i dokumentationen.. *DOH - just det, så var det!* :P

Jag har rätt nyligen läst en kurs med enbart javascript på högskolan (utan ramverk!) så där hamrades det in rätt fint *flinar* Skrev en desktop då med javascript (inga ramverk som sagt) vilket var lite slitigt kan man säga..

Kan rek boken Javascript - The Definite Guide.

Javascript är ett bråkigt språk med många fulhack/omvägar.. så det funkar inte riktigt att göra modifikationer om man vill lära sig det riktigt.. språket har väldigt många intressanta.. ska vi säga egenheter :P

allstars

2009-06-04 22:02

man får LÄRA sig javascript / jquery för att bättre kunna utveckla i det, som i allt annat.

Jolla

2009-06-05 09:48

Tack för alla svar! Fast nu behöver jag hjälp med CSS som jag faktiskt är ganska ny med. Hoppas någon kan hjälpa mig.

Jag har en <div id="main> där jag skall ha <div id="sidebar"> på vänstersidan och en <div id="content> på högersidan.

Men hur får man dessa divar bredvid varandra i main? Jag får bara content under sidebar.

Hoppas någon kan hjälpa mig!

wiB	2009-06-05 09:53

Citat:

Originally posted by Jolla@Jun 5 2009, 09:48
Men hur får man dessa divar bredvid varandra i main? Jag får bara content under sidebar.

CSS:

Kod:

div#Left { 

float:left;

width:20%;

}

div#Right { 

float:right;

width:50%;

}

Markup:

Kod:

<div id="Left">Innehåll</div>

<div id="Right">Jajemen</div>

Kom ihåg att wrappa dessa två divvar med din "Main" som du har, dvs att divvarna ligger inuti main, inte utanför.

Jolla

2009-06-05 09:59

Tack så mycket.

Hade gjort så först fast då fungerade det inte av någon anledning. Men nu gjorde de det.

Tack!

Jolla

2009-06-05 10:56

Nu behöver jag hjälp ännu en gång :)

Nu vill jag att en text skall befinna sig i middle, i en div framför en bakgrundsbild.

Har testat vertical-align:middle; fast har läst mig till att det inte fungerar.

Har ni några tips hur jag skall göra? :)

Alla tider är GMT +2. Klockan är nu 00:00.