Nazov Menu

Josh · Napísal **Josh**: 11.12.2012 14:08

ahojte chcem sa spytat ako sa vola taketo menu?

Nadpis1 Nadpis2 Nadpis3 Nadpis4 (vodorovne)

a ked kliknes napr na Nadpis1 tak sa ti podnym zobrazia dalsie volby (vodorovne stale) Nadpis Nadpis Nadpis Nadpis

Vzor:

Kód:

http://www.upnito.sk/0/95j5t94wfn9bp8yhs97hbgckrz26fv4e.png

ondrejko0102 · Napísal **ondrejko0102**: 11.12.2012 14:35

Horizontalne menu:
http://cssmenumaker.com/css-horizontal-menus

Josh · Napísal autor témy **Josh**: 11.12.2012 17:49

Neviete ako spravit v cs toto? Nazov Menu

ondrejko0102 · Napísal **ondrejko0102**: 11.12.2012 18:16

Príklad použitia:

Súbor style.css:

Kód:

body {
margin : 10px;
font: Verdana, Helvetica, Arial;
padding: 0px;
background: #fff;
}

#menu {
border-bottom : 1px solid #ccc;
margin : 0;
padding-bottom : 19px;
padding-left : 10px;
}

#menu ul, #menu li {
display : inline;
list-style-type : none;
margin : 0;
padding : 0;
}

#menu a:link, #menu a:visited {
background : #E8EBF0;
border : 1px solid #ccc;
color : #666;
float : left;
font-size : small;
font-weight : normal;
line-height : 14px;
margin-right : 8px;
padding : 2px 10px 2px 10px;
text-decoration : none;
}

#menu a:link.active, #menu a:visited.active {
background : #fff;
border-bottom : 1px solid #fff;
color : #000;
}

#menu a:hover {
color : #f00;
}

body.section-1 #menu li#nav-1 a,
body.section-2 #menu li#nav-2 a,
body.section-3 #menu li#nav-3 a,
body.section-4 #menu li#nav-4 a {
background : #fff;
border-bottom : 1px solid #fff;
color : #000;
}

#menu #subnav-1,
#menu #subnav-2,
#menu #subnav-3,
#menu #subnav-4 {
display : none;
width: 90%;
}

body.section-1 #menu ul#subnav-1,
body.section-2 #menu ul#subnav-2,
body.section-3 #menu ul#subnav-3,
body.section-4 #menu ul#subnav-4 {
display : inline;
left : 10px;
position : absolute;
top : 95px;
}

body.section-1 #menu ul#subnav-1 a,
body.section-2 #menu ul#subnav-2 a,
body.section-3 #menu ul#subnav-3 a,
body.section-4 #menu ul#subnav-4 a {
background : #fff;
border : none;
border-left : 1px solid #ccc;
color : #999;
font-size : smaller;
font-weight : bold;
line-height : 10px;
margin-right : 4px;
padding : 2px 10px 2px 10px;
text-decoration : none;
}

#menu ul a:hover {
color : #f00 !important;
}

#contents {
background : #fff;
border : 1px solid #ccc;
border-top : none;
clear : both;
margin : 0px;
padding : 15px;
} 

Súbor index.html:

Kód:

<link rel="stylesheet" type="text/css" href="style.css" media="all">
<ul id="menu">
  <li id="nav-1"><a href="#">Home</a></li>
  <li id="nav-2"><a href="#">About Us</a>
<ul id="subnav-2">
  <li><a href="#">People</a></li>
  <li><a href="#">Careers</a></li>
  <li><a href="#">Press</a></li>
  <li><a href="#">Locations</a></li>
</ul>
</li>
  <li id="nav-3"><a href="#">Contact Us</a>
<ul id="subnav-3">
  <li><a href="#">Email</a></li>
  <li><a href="#">Phone</a></li>
  <li><a href="#">Carrier Pigeon</a></li>
</ul>
</li>
  <li id="nav-4"><a href="#">Products</a>
<ul id="subnav-4">
  <li><a href="#">Death Ray</a></li>
  <li><a href="#">Bunny Slippers</a></li>
  <li><a href="#">Bag of Broken Glass</a></li>
</ul>
</li>
</ul>

Viac info: http://www.cssportal.com/horizontal-menus/kalsey.htm

walther · Napísal **walther**: 11.12.2012 18:59

ondrejko0102, ty máš naozaj dojem, že si mu nejako pomohol?

ondrejko0102 · Napísal **ondrejko0102**: 11.12.2012 19:16

už nie!
(nefunguje to)
IBa hlavné menu to zobrazí (a v SS sme si nečo ohladom toho popisali)

Josh · Napísal autor témy **Josh**: 12.12.2012 8:52

pls niekto? :cry:

stenley · Napísal **stenley**: 12.12.2012 10:00

Je to obycajne horizontalne dropdown menu, kde sa vnorene polozky nezobrazuju pod sebou, ale za sebou v jednom riadku

Josh · Napísal autor témy **Josh**: 12.12.2012 13:40

jj uz som to zistil len na google to nemozem najst (sakra) lebo taketo neviem ako napisat

shaggy · Napísal **shaggy**: 12.12.2012 18:18

Josh - ty nám tvrdíš, že si v google nenašiel horizontálne dropdown menu? Robíš si z nás srandu?

Josh · Napísal autor témy **Josh**: 12.12.2012 18:40

nerobim si srandu.. nenasiel som taketo ake hladam a ani podobne vsetko je bud podseba alebo vodorovne ale ked nato ukazes sipku a posunies tak ti tie subdomena za par sekund zmiznu

Josh · Napísal autor témy **Josh**: 13.12.2012 12:22

Prosim Vas neviete kde mam chybu?

Kód:

http://www.upnito.sk/0/tkamm4cr6axq7suue7m84fa76ee7ydq9.PNG

ked som dal na Products tak sa mi zobrazilo dalsie subdomena ale neukazuju vsetke iba jeden a to widgets zvisne su za obrazkom a to v html mam prv menu a az potom obrazok vlastne sa nejedna len o normaln obrazok ale mam to robene v js

stenley · Napísal **stenley**: 13.12.2012 12:48

Skus nastavit z-index, mozno to pomoze, tazko sa ale radi bez zivej ukazky

Josh · Napísal autor témy **Josh**: 13.12.2012 16:04

aby som zbytocne nezakladal novu temu sa chcem spyt lebo sa cudujem ze mi nechce ukazat pozadie tak sem poslem kod

ked to napisem takto tak neukaze (biele pozadie)

background-image:url("../images/background/3.jpg");

ked to spravim takto tak ukaze

background:black;

neviete kde je chyba?

walther · Napísal **walther**: 13.12.2012 16:54

Zlý odkaz na obrázok...

Josh · Napísal autor témy **Josh**: 13.12.2012 20:28

mam dobry kontroloval som to sto krat

walther · Napísal **walther**: 13.12.2012 20:30

Keby bol dobrý, tak sa zobrazí obrázok...
Buď dáš odkaz na živú ukážku, alebo sa obávam, že si to budeš musieť riešiť sám, lebo takto to nejde.

Josh · Napísal autor témy **Josh**: 13.12.2012 20:44

mam biele pozadie ved vravim ked napisem background: green tak pozadie bude zelene ale ked tam dam background-image: url("../images/background/3.jpg") tak nejde to backgroun mam 10x10px

walther · Napísal **walther**: 13.12.2012 20:46

V akom jazyku ti to mám zopakovať?

Josh · Napísal autor témy **Josh**: 13.12.2012 20:54

sakra nechapem ako som si to nemohol vsimnut kua

Nazov Menu

Podobné témy