» »

Drop down meni!

Drop down meni!

Origa ::

Bi mi lahko kdo povedu, kako bi si naredu drop down meni?..tko kot je na tej strani. klik

tec ::

javascript
Ce delas v DWju, imas na razpolago Behaviors > show popup menu. Dokaj preprosto, ce si zacetnik. Drugace pa obstaja malo morje raznih ready made skript, ki jih po svoje nastavis.

Sicer pa, ce se ne motim, je drop down menu malo drugacna stvar, kot to kar imas ti v mislih.

segi ::

Flash
---------------------------------------------
Segi podobo na ogled postavi,
ker bolj resnico ljubi kakor hvalo,
zad skrit vsevprek posluša, kaj zijalo
neumno, kaj umetni od nje pravi
----------------------------------------------

ACE ::

origa>evo skrito , ki sem jo napisal točno za tisto stran zgoraj ;) hehe
malo sem jo še dopolnil tako da dela skor optimalno. ;)
Dela pa tako da se preprosto , ko greš z miško čez določen gumb v meniju prikaže layer ki je drugače skrit in to je vse, ko pa miško umakneš se layer ponovno skrije. Da je vseskozi na istem mestu je treba samo pozicijo od gumba kateremu pripada meni uporabit (z rahlim zamikom). Skripta je precej preprosta...

1. funkcija ki pokaže skriti layer
name - ime ki ga določiš za layer ([div name="ime"]meni teks[/div])
poleg tega pa rabič še eno sliko glede na katero se bo nastavila pozicija menija:
pos = getXYcoord( 'menu_' + name ); (jaz sem slikam nastivil enake atribute kot layerjem samo da sem dodal "menu_" spredaj) Primer : [img name="menu_ime" src="slike.jpg" /]

function showSubSub(name)
{
if (!document.getElementById) {
return;
}
clearTimeout(timerId);
if (activeMenu == name) {
return;
}
if (activeMenu != null) {
menuOff();
}
activeMenu = name;
pos = getXYcoord( 'menu_' + name );
offset_y = pos.y + 33;
switch (name) {
case 'home':
offset_x = pos.x + 10;
break;
case 'music' :
offset_x = pos.x - 25;
break;
case 'forum' :
offset_x = pos.x - 13;
break;
case 'charts' :
offset_x = pos.x - 36;
break;
case 'links' :
offset_x = pos.x - 28;
break;
}
document.getElementById(name).style.top = offset_y;
document.getElementById(name).style.left = offset_x;
document.getElementById(activeMenu).style.visibility = "visible";
}
2. funkcija ki skrije menu
function menuOff()
{
if (!document.getElementById) {
return;
}
if (activeMenu == null) {
return;
}
document.getElementById(activeMenu).style.visibility = "hidden";
activeMenu = null;
}
3. funkcija ki ti pove x in y koordinate od slike (glede na "name" atribut)
function getXYcoord ( nvn )
{
var elm = document.images[nvn];
if ( document.layers ) return elm;

var rd = { x:0 ,y:0 };
do { rd.x += parseInt( elm.offsetLeft );
rd.y += parseInt( elm.offsetTop );
elm = elm.offsetParent;
} while ( elm );
return rd;
}
4. potem pa rabiš še ti dve vrstici, da omogočiš timer (čes preden menu izgine)

activeMenu = null;
timerId = 0;

5. pa še primer enga dela menuja:
Najprej skriti layer:
[div id="music" style="position:absolute; visibility:hidden;"]
[table cellpadding="1" cellspacing="1"]
[tr]
[td onMouseOver="showSubSub('music');" onMouseOut="timerId=setTimeout('menuOff()',500);"]tekst ki se pojavi v menuju[/td]
[/tr]
[/table][/div]

Potem pa še slika katera ga pokaže , če greš z miško čez njo:
[a onMouseOver="showSubSub('music');" onMouseOut="timerId=setTimeout('menuOff()',500);" href="#"][img name="menu_music" src="music.gif" width="104" height="34" alt="" border="0" /][/a]

hehe ok upam da je tole uporabno ;)
p.s. mogu sem uporabi [ ] namestu normalnih oklepajev v html ker nekako ni se ni vidlo kode drugače (tudi če sem izklopil html :\ )
[url=http://www.mp3.com.au/acecream]CLICK CLICK CLICK[/url]

Zgodovina sprememb…

  • spremenilo: ACE ()

ACE ::

sicer pa lahko vidiš kako deluje tukaj > test.cutetrancegirls.com

sopex ::

ej....mene pa zanima kako in v kermu programskemu jeziku si naredu tist za vpisovanje novičk na stran???

ACE ::

sopex> vpisovanje novic in vse ostalo je narejeno v php-ju.

sopex ::

aha...bi lohka mogoče prlepu to scripto za prikazovanje novičk in vpisovanje novičk tuki gor...k jest delam neki enakega, pa mam probleme pr uploadanju slikc na net...pa bi ful rd vidu kšn tak primer..če maš cajt mi lohka pa tud na email pošleš : webmaster@lublana.com

ACE ::

sopex> jaz kode ne bom prilagal ker je malo preveč specifična, je bolje če najdeš en splošen news script.

Naprimer tale:
http://splet01.net/default.asp?fp=clanki_clanek&a=10

sopex ::

ja sm neki probu delat s tisto kodo, sam to je bl lame....jest bi rabu neki, da bi lohka v novice ustavlu tud fotko, k bi jo istočasno z novico naložu na strežnik (novica v bazo, fotka v določeno datoteko) ... dej če maš kej tazga mi plis pošl, k se zdele že par dni jebem s tem :=) pa tud to me jebe, da uporabnik komentira novico....k neznam povezat sqltabele z novičkami z tabelo z komentarji :)

ACE ::

sopex> tabele povezes prek id-ja . v tabelo od slike dodas pac id_news kjer se zapise id od novice in pol ko odpres novico poisces se sliko "select from slike where id_news=$id_novice"

sicer pa jaz nimam tko narejen.Jaz mam sliko preprost v tekstu notr.
Enako kot če bi jo dodal tuki na forumu. Samo če hočeš da se ti izpiše lepo na levi al pa desni strani potem moraš sliko dati v tabelo tabelo pa alignat na levo al pa desno:
[table align="left"]
[tr]
[td][img src="sllika.gif" /][/td]
[/tr]
[/table]
tekst pa preprosto dodaš po tej kodi in po padel lepo ob sliko.


Vredno ogleda ...

TemaSporočilaOglediZadnje sporočilo
TemaSporočilaOglediZadnje sporočilo
»

Javascript validacija web-to-lead forme

Oddelek: Programiranje
191058 (865) Gandalfar
»

JavaScript offsetTop in brskalniki

Oddelek: Izdelava spletišč
8992 (924) shorvat
»

Javascript - izračun razlike v datumih

Oddelek: Programiranje
81908 (1763) kogledom
»

JavaScript zunaj HTML

Oddelek: Izdelava spletišč
111268 (1166) *wolf*
»

Internet strani kot slideshow

Oddelek: Izdelava spletišč
212109 (1860) sverde21

Več podobnih tem