DevProTalk

Forumi IT profesionalaca
web development, web design, e-business, SEO


Idite nazad   DevProTalk > Web development i web aplikacije > (X)HTML, JavaScript, DHTML, XML, CSS
Želite da se reklamirate ekskluzivno na ovoj poziciji? Javite se

(X)HTML, JavaScript, DHTML, XML, CSS Client scripting tehnologije, Dynamic HTML, Cascading Stylesheets, XML i standardi

Odgovori
 
Alati teme Način prikaza
Staro 02. 12. 2005.   #1
Ilija Studen
Direktor Kombinata
Invented the damn thing
 
Avatar Ilija Studen
 
Datum učlanjenja: 07.06.2005
Poruke: 2.669
Hvala: 44
119 "Hvala" u 64 poruka
Ilija Studen će postati "faca" uskoroIlija Studen će postati "faca" uskoro
Default JavaScript meni

Treba mi relativno jednostavan JavaScript meni koji animira (ne prost show / hide već animacija pri otvaranju). Neka preporuka?

PS: Sam meni se može videti http://madlenianum.revolutioninteractive.com/. Trenutno je tu CSS meni, ali klijent hoće da on animira (ništa me ne pitajte)...
Ilija Studen je offline   Odgovorite uz citat
Staro 02. 12. 2005.   #2
bluesman
Goran Pilipović
Sir Write-a-Lot
 
Avatar bluesman
 
Datum učlanjenja: 18.05.2005
Lokacija: Beograd
Poruke: 5.450
Hvala: 288
1.247 "Hvala" u 446 poruka
bluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušati
Pošaljite ICQ poruku za bluesman
Default

To je jako los primer za menu, bar sto se usabiliy tice

Pa napravi sam, umesto show, samo stavi neki timeout koji ga slide-uje. Brze je tako nego da trkeljises po tudjem kodu.
__________________
Goran Pilipović a.k.a. Ugly Fingers Bradley f.k.a. bluesman
I don't always know what I'm talking about but I know I'm right!
bluesman je offline   Odgovorite uz citat
Staro 02. 12. 2005.   #3
Ilija Studen
Direktor Kombinata
Invented the damn thing
 
Avatar Ilija Studen
 
Datum učlanjenja: 07.06.2005
Poruke: 2.669
Hvala: 44
119 "Hvala" u 64 poruka
Ilija Studen će postati "faca" uskoroIlija Studen će postati "faca" uskoro
Default

Moguće. Pored sveg posla što imam mislio sam da ovo na neki način mogu da zaobiđem. Kao i obično, Marfi umeša prste Bar ću imati zanimljivo veče.

PS: Nisam ja osmišljavao stranicu. Dobio PSD sasekao ga i uklopio sa CMSom.
Ilija Studen je offline   Odgovorite uz citat
Staro 02. 12. 2005.   #4
bluesman
Goran Pilipović
Sir Write-a-Lot
 
Avatar bluesman
 
Datum učlanjenja: 18.05.2005
Lokacija: Beograd
Poruke: 5.450
Hvala: 288
1.247 "Hvala" u 446 poruka
bluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušati
Pošaljite ICQ poruku za bluesman
Default

Ja sam mislio na menu. Usability onog menija je prilicno los. Hajde sada da objasnim da ne budem neki hater koji pljuje bez argumenata.

Prvo, ovakav vertiklani menu zateva mnogo vise paznje nego horizontalni jer je sam po sebi neprirodniji.

Sledece je sto podmeni ne sme da iskace tako jednostavno na mouseover, pravi menu bi morao da ima bar 1/2 sekunde do 1 sekundu zadrske. To sada izgleda kao da je nebitno (sta je 1/2 sekunde) ali kada probate vidite drasticnu razliku.

Zatim, na mouseout mora takodje da postoji neki delay pre nego sto se skloni menu. Ako malo probate da "krstarite" ovim menijem jednostavno se u jednom trenutku nadjes kako polako pomeras misa na levo, pixel po pixel da ti ne bi pobegao submenu dok ti dodjes misem do podmenija.

Zato mislim da je usability horror, narocito za neiskusnije korisnike.

Strana kao strana, sama po sebi nije losa, mnogo bolja nego taj menu.
__________________
Goran Pilipović a.k.a. Ugly Fingers Bradley f.k.a. bluesman
I don't always know what I'm talking about but I know I'm right!
bluesman je offline   Odgovorite uz citat
Staro 03. 12. 2005.   #5
noviKorisnik
Dejan Katašić
Wrote a book
 
Avatar noviKorisnik
 
Datum učlanjenja: 10.06.2005
Lokacija: Novi Sad
Poruke: 1.017
Hvala: 129
86 "Hvala" u 43 poruka
noviKorisnik će postati "faca" uskoro
Default

Citat:
Treba mi relativno jednostavan JavaScript meni koji animira
Ako smem da pitam - KAKO da animira?
noviKorisnik je offline   Odgovorite uz citat
Staro 03. 12. 2005.   #6
Ilija Studen
Direktor Kombinata
Invented the damn thing
 
Avatar Ilija Studen
 
Datum učlanjenja: 07.06.2005
Poruke: 2.669
Hvala: 44
119 "Hvala" u 64 poruka
Ilija Studen će postati "faca" uskoroIlija Studen će postati "faca" uskoro
Default

Citat:
Originalno napisao noviKorisnik
Ako smem da pitam - KAKO da animira?
Pri prelasku preko osnovne stavke navigacije da se podnavigacija "izvuče" od 0px do 240px s leva nadesno
Ilija Studen je offline   Odgovorite uz citat
Staro 03. 12. 2005.   #7
noviKorisnik
Dejan Katašić
Wrote a book
 
Avatar noviKorisnik
 
Datum učlanjenja: 10.06.2005
Lokacija: Novi Sad
Poruke: 1.017
Hvala: 129
86 "Hvala" u 43 poruka
noviKorisnik će postati "faca" uskoro
Default

Koristiš z-index - podmeni je ispod glavnog. Postaviš setInterval koji poziva funkciju koja pomera u koracima levu poziciju podmenija. (pre postavljanja intervala resetuješ poziciju i uključiš display... na krajnjoj poziciji isključiš interval)
noviKorisnik je offline   Odgovorite uz citat
Staro 03. 12. 2005.   #8
ivanhoe
Ivan Dilber
Sir Write-a-Lot
 
Avatar ivanhoe
 
Datum učlanjenja: 18.10.2005
Lokacija: Bgd
Poruke: 5.320
Hvala: 104
2.344 "Hvala" u 583 poruka
ivanhoe je ime poznato svimaivanhoe je ime poznato svimaivanhoe je ime poznato svimaivanhoe je ime poznato svimaivanhoe je ime poznato svimaivanhoe je ime poznato svimaivanhoe je ime poznato svimaivanhoe je ime poznato svimaivanhoe je ime poznato svimaivanhoe je ime poznato svimaivanhoe je ime poznato svima
Pošaljite poruku preko Skype™ za ivanhoe
Default

@Ilija: pogledaj http://webfx.eae.net/dhtml/swipeFade/swipeFade.html, to su dva js skripta koji omogucuju slide-in/out i fade-in/out, prilicno se lako implementiraju...

@bluesman: skroz si u pravu za delay, narocito za onaj na mouseout... nema gluplje stvar nego kad moras da cimas misha ulevo da se meni ne sklopi...to me stvarno iznervira...

@NoviKorisnik: Ima bolja fora, pogledajte kako je uradio ovaj lik sa onog url-a sto sam dao gore...koristi clipping....naprosto stavis clip na div i menjas mu dimenzije i tako simuliras izvlacenje, a da se sam div uopste ne pomera...

a sto se tice samog menija na ovom sajtu, nije bas zgodan za ovo jer su stavke mnogo uske, a dugacke...moras bas pazljivo da vuces misha ili zavrsis na pogresnom submeniju... delay za otvaranje/zatvaraanje bi donekle ovo resio, ali bi mozda ipak mogao malo da dodas paddinga gore i dole na menu item-e, da ljudima bude lakse da ih nabodu..

Poslednja izmena od ivanhoe : 03. 12. 2005. u 09:51.
ivanhoe je offline   Odgovorite uz citat
Staro 03. 12. 2005.   #9
noviKorisnik
Dejan Katašić
Wrote a book
 
Avatar noviKorisnik
 
Datum učlanjenja: 10.06.2005
Lokacija: Novi Sad
Poruke: 1.017
Hvala: 129
86 "Hvala" u 43 poruka
noviKorisnik će postati "faca" uskoro
Default

Nešto svakako mora da se menja da bi bila animacija ;.)

btw. - setih se kasnije i klipinga, deluje mi bolje nego ovo s preklapanjem.
noviKorisnik je offline   Odgovorite uz citat
Staro 04. 12. 2005.   #10
Ilija Studen
Direktor Kombinata
Invented the damn thing
 
Avatar Ilija Studen
 
Datum učlanjenja: 07.06.2005
Poruke: 2.669
Hvala: 44
119 "Hvala" u 64 poruka
Ilija Studen će postati "faca" uskoroIlija Studen će postati "faca" uskoro
Default

Napravio sam meni...

http://madlenianum.revolutioninteractive.com/

Pošto nisam JS ekspert (može se reći da sam upućeni početnik) bilo je jako mnogo stranputica na koje sam zaglavljivao. Stvar je daleko od savršene (ima par "tikova") ali definitivno više namam vreme da se posvetim ovome (drugi projekti su onhold zbog ovoga).

Metoda koju je noviKorisnik spomenuo je odradila posao. Kliping nije mogao jer je bilo potrebno očuvati beli border oko podmenija, a i nikako nisam uspevao da ga nateram da radi korektno. Promena dužine radi posao, s napomenom da overflow bloka mora biti hidden kako ne bismo dobili skrolove, prelomljen tekst i slične "sporedne efekte" koje overflow: visible donosi.

Imam još tri "tika" koja moram da rešim i svi su u IEu:

1. Prilikom prelska preko osnovne stavke menija podmeni koji treba da se pojavi dobija klasu toFront, a ostali dobijaju klasu toBack. Prva ima pun opacity i z-index 100 (izbija napred), a druga postaje poluprozirna i povlači se nazad (z-index 1):

Kôd:
#navigation ul li ul.toFront {
  z-index: 100;
  opacity: 1;
  -moz-opacity: 1;
  filter: alpha(opacity: 100);
}

#navigation ul li ul.toBack {
  z-index: 1;
  opacity: 0.5;
  -moz-opacity: 0.5;
  filter: alpha(opacity: 50);
}
To savršeno korektno radi u Firefoxu (1.5), ali z-index ne radi u Internet Exloreru tj. meniji koji trebaju da se sakriju se ne povlače nazad.

Ima li neko ideju zbog čega se to dešava?

2. Dodatna dva piksela na dnu podmenija... Tu bi trebala da bude bela linija, tj. da poslednja stavka menija "zatvori" blok sa svojim border-bottom. U FF sve u redu, IE brlja...

3. Odvratno treperenje kursora u Exploreru. Znam, timer i opacity su prilično zeznuti, posebno u IEu. Još dodajte tome da je iza Flash objekat... Hteo bih da fiksiram kursor u pointer (hand) bez poščanog sata. Moguće?

PS: Kakva glavolomka. Ne mogu da verujem da sam toliko vremena utrošio na jedan običan meni... No, dobra stvar je što sam naučio par korisnih trikova.
Ilija Studen je offline   Odgovorite uz citat
Odgovori


Alati teme
Način prikaza

Pravila pisanja
Možete ne započinjati nove teme
Možete ne slati odgovore
Možete ne slati priloge
Možete ne izmeniti svoje poruke
vB kôd je Uključen
Smajliji su Uključen
[IMG] kod je Uključen
HTML kôd je Isključen
Pogledajte forum

Slične teme
Tema Početna poruka teme Forum Odgovori Poslednja poruka
CSS meni problem martinluter (X)HTML, JavaScript, DHTML, XML, CSS 1 02. 12. 2010. 18:50
iskljuciti popup meni u IE za save/print/etc slike zvonko Sva početnička pitanja 3 25. 02. 2009. 23:54
503 header svima sem meni pcigre Web Hosting, web serveri i operativni sistemi 3 16. 01. 2009. 14:03
baner - meni mirko Sva početnička pitanja 0 08. 12. 2007. 12:32
List/Meni and button GO Tane (X)HTML, JavaScript, DHTML, XML, CSS 11 13. 03. 2007. 17:17


Vreme je GMT +2. Trenutno vreme je 12:30.


Powered by vBulletin® Verzija 3.6.8
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Copyright © DevProTalk. All Rights Reserved.
Mišljenja, saveti, izjave, ponude ili druge informacije ili sadržaji nastali na Sajtu su vlasništvo onoga ko ih je kreirao, a ne DevProTalk.com, tako da ne morate da se oslanjate na njih.
Autori poruka su jedini odgovorni za ovakve sadržaje. DevProTalk.com ne garantuje tačnost, kompletnost ili upotrebnu vrednost informacija, stavova, saveta ili datih izjava. Ne postoje uslovi pod kojima bi mi bili odgovorni za štetu ili gubitak koji je posledica bilo čijeg oslanjanja na nepouzdane informacije, ili bilo kakve informacije nastale kroz komunikaciju između registrovanih članova.
Web sajt može sadržavati linkove na druge web sajtove na Internetu ili neke druge sadržaje. Ne kontrolišemo niti podržavamo te druge web sajtove, niti smo pregledali bilo kakve sadržaje na takvim sajtovima. Mi nećemo biti odgovorni za legalnost, tačnost ili prikladnost bilo kog sadržaja, oglasa, proizvoda, usluga ili informacije lociranim na ili distribuiranih kroz druge web sajtove, niti za bilo kakvu štetu nastalu kao posledica takvih informacija. DevProTalk.com drži i čuva druga prava vlasništva na web sajtu. Web sajt sadrže materijale zaštićene copyright-om, zaštitne znakove i druge informacije o pravu vlasništva ili softver. Članovi mogu poslatu informacije zaštićene pravima vlasništva njihovih nosilaca i ona ostaju zaštićena bez obzira da li su oni koji prenose te informacije to naveli ili ne. Osim informacija koje su u javnom vlasništvu ili za koje dobijete dozvolu, nemate pravo da kopirate, modifikujete ili na bilo koji način menjate, objavljujete, prenosite, distribuirate, izvršavate, prikazujete ili prodajte bilo koju informaciju zaštićenu pravima vlasništva. Slanjem informacija ili sadržaja na bilo koji deo DevProTalk.com, Vi automatski dozvoljavate i predstavljate garanciju da imate pravo da dozvolite DevProTalk.com ili članovima DevProTalk.com bespovratnu, kontinualnu, neograničenu, globalnu dozvolu da koriste, kopiraju, izvršavaju, prikazuju i distribuiraju takve informacije i sadržaje i da iz takvih sadžaja koriste bilo koji deo u bilo koje svrhe, kao i pravo i dozvolu da koriste gore navedene sadržaje. Svi zaštitni znakovi (trademarks), logotipi, oznake usluga, firme ili imena proizvoda koji se pominju na ovom web sajtu su vlasništvo kojim raspolažu njihovi vlasnici.