Forum FAQForum FAQSearchSearch MemberlistMemberlist Forum ignore listForum ignore list RegisterRegister ProfileProfile Log in to check your private messagesLog in to check your private messages Log inLog in
hybrid ALA dropdown javascript??

 
This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies.    mi3dot.org Forum Index -> Client-side
View previous topic :: View next topic  
Author Message
nel`chee



Joined: 08 Jul 2004
Posts: 2087
Location: Rijeka

PostPosted: 26.08.2005 16:39    Post subject: hybrid ALA dropdown javascript?? Add user to your forum ignore list Reply with quote

http://wip.inobscuro.com/index.htm

evo :hover radi, ali nekako mi se čini da javascript ne. pošto u IE-u ni nemam javascript, provjerila sam u FF-u (maknem #menu li:hover ul naravno) i ne radi. inače je JS copy-paste sa http://www.alistapart.com/articles/hybrid no ne mogu provjerit radi li njima. inače, ovaj bug u Operi sa scrollbarom (na mojem wip primjeru se ne vidi jer nema sadržaja, ali inače se toggla scrollbar kad prelazim preko menija) imaju i oni - provjerih. ako netko ima ideju što je krivo pliz recite.

i da, nemam pojma jesam li uopće includala JS na pravi način.
eto hvala.

_________________
art & design portfoliofree Photoshop brushes stuffsketchblogfacebook
Back to top
View user's profile Send private message Visit poster's website Twitter profile
lekke



Joined: 17 Jun 2004
Posts: 860
Location: 25th floor

PostPosted: 26.08.2005 16:59    Post subject: Add user to your forum ignore list Reply with quote

kako mislis #menu li:hover ul ?!
valjda #menu ul li:hover

_________________
You need more bass.
Back to top
View user's profile Send private message
Sulien



Joined: 04 Jan 2004
Posts: 2905
Location: Zagreb

PostPosted: 26.08.2005 17:03    Post subject: Add user to your forum ignore list Reply with quote

jedan od zadnjih layouta na positioniseverything ima super, IE compatible CSS dropdowns... pogledaj
Back to top
View user's profile Send private message Send e-mail Visit poster's website
nel`chee



Joined: 08 Jul 2004
Posts: 2087
Location: Rijeka

PostPosted: 26.08.2005 20:45    Post subject: Add user to your forum ignore list Reply with quote

lekke, mislim upravo kako sam i rekla.
obožavam kad se ljudi prave pametni bez da su i pogledali na primjeru o čemu se radi.

sulien, evo idem pogledat, ali ja bi radije da ovaj proradi nego da idem radit nanovo... kad se već ALA diči kako radi u "svim modernim browserima" onda neka radi >_<
jel itko uopće otvorio ovu stranicu u IE-u?

Last edited by nel`chee on 26.08.2005 21:19; edited 1 time in total

_________________
art & design portfoliofree Photoshop brushes stuffsketchblogfacebook
Back to top
View user's profile Send private message Visit poster's website Twitter profile
nel`chee



Joined: 08 Jul 2004
Posts: 2087
Location: Rijeka

PostPosted: 26.08.2005 20:58    Post subject: Add user to your forum ignore list Reply with quote

a-a ovaj na PIE je no-go. prekompliciran kod, ima ga gomile, a vjerojatno ga ne bi znala očistit od svega nepotrebnog... treba mi samo 2 nivoa navigacije, a ovaj ih ima bar 3.

alzo, jedino sto trazim je da otvorite onaj link u Internet Exploreru koji ima Javascript ukljucen i kazete mi radi li Rolling Eyes is that too much to ask? Confused

a onda kad ste vec u motu provjerite i ovo http://www.alistapart.com/d/hybrid/hybrid-4.html da znam, jer iako oni tvrde da radi ja im ne mogu samo vjerovat na rijec, moram provjerit.

_________________
art & design portfoliofree Photoshop brushes stuffsketchblogfacebook
Back to top
View user's profile Send private message Visit poster's website Twitter profile
:cosmos:



Joined: 12 Sep 2003
Posts: 2098
Location: México

PostPosted: 26.08.2005 22:31    Post subject: Add user to your forum ignore list Reply with quote

ja vidim meni, cak se i otvara podmeni, no cim se maknem sa gumba, pod meni nestane.

c
Back to top
View user's profile Send private message Send e-mail Visit poster's website Twitter profile
Sulien



Joined: 04 Jan 2004
Posts: 2905
Location: Zagreb

PostPosted: 26.08.2005 23:51    Post subject: Add user to your forum ignore list Reply with quote

dakle, problem nije sa skriptom, već sa CSS-om... onmouseout event se prebrzo desi, vjerojatno zbog kritične kombinacije floatanja, width:auto i drugih osjetljivih stvari

magičan recept: radi css samo za compliant browsere da izgleda dobro, kad si gotova sa poslom otvori IE i CSS te dodavaj rulove sa * HTML hackom dok ne stweakaš sve... tako ja to uvijek radim i pere predobro čak i na IE5.x ako malo mućneš glavom
Back to top
View user's profile Send private message Send e-mail Visit poster's website
Adrian



Joined: 02 Apr 2004
Posts: 692
Location: Around & about

PostPosted: 27.08.2005 02:56    Post subject: Add user to your forum ignore list Reply with quote

makar ga sam ne koristim, (tko jebe one sa ie-om i bez javaskripte skupa! ) Laughing ,

http://www.cssplay.co.uk/menus/dropdownfun.html
-> trebao bi raditi svuda i svakud.
-> makar nije totalno accessible ili kako to već govore po netu, jer nije u listama, čini mi se.

probaj

_________________
The quest for certainty blocks the search for meaning. Uncertainty is the very condition to impel a man to unfold his powers.
http://origami.hr
Back to top
View user's profile Send private message Visit poster's website
nel`chee



Joined: 08 Jul 2004
Posts: 2087
Location: Rijeka

PostPosted: 27.08.2005 12:36    Post subject: Add user to your forum ignore list Reply with quote

hmm ne znam kako rijesit to sto odmah nestane :/ a kuzis, moj IE nema javascript enejblan (tako je vec skoro godinu dana i jedino rjesenje je da ponovo instaliram windowse koje trenutno nemam kod sebe) i kako ja to mogu provjerit?? :/

Sulien, width:auto vrijedi samo za CSS compliant, a IE ima width: 100px
koje su to osjetljive stvari, ne znam ja sam samo slijedila tutorial i izbrisala onaj dio kad je meni "aktivan" kad je određena stranica otvorena (iskreno jer mi se nije dalo još s tim zezat)

adrian, sam autor kaže
Quote:
Please don't take this one too seriously, I just wanted to find a way that IE could do this and now I am happy Wink

ako mi ga ni sam autor ne preporuča, ne želim ga ni ja.

ovaj koji imam ja trebao bi radit, please please Sulien ako imaš vremena pogledaj malo što bi trebala prilagodit za IE @_@ ja ne mogu ni testirat! tj testirala sam jedino pozicioniranje (kad sam micala display:none za svaki submenu pojedinačno) i sve je izgledalo okej.

_________________
art & design portfoliofree Photoshop brushes stuffsketchblogfacebook
Back to top
View user's profile Send private message Visit poster's website Twitter profile
Sulien



Joined: 04 Jan 2004
Posts: 2905
Location: Zagreb

PostPosted: 27.08.2005 15:18    Post subject: Add user to your forum ignore list Reply with quote

na početak dodaj list style none na svemu
Code:
* {margin: 0; padding: 0; border: none; text-decoration: none; list-style:none; }

:evo poboljšane navigacije, ne ovisi o vertikalnoj poziciji na ekranu:
Code:
/*navigation*/
#menu {
   float:left;
   width:630px; /* ja sam mali width i Opera me treba */
   background:#e9e5db;
   font-size: 150%;
   border-bottom: #f5f3ec 1.2em solid;
   position:relative;
}
#menu li a {
   float:left;
   display:block;
   color:#ab8f77;
   padding: 0.2em 0.5em;
}
#menu li a:hover { color:#9c5857; }
#menu li ul {
   display:none;
   float:left;
   width:630px; /* važno da ti submenu ne nestane kad ideš na njega */
   position:absolute;
   top:2.2em;
   left:0;
   font-size:70%;
}
#menu li:hover ul, #menu li:focus ul, #menu li.over ul { display: block; }

sad se, kad razvijaš site, igraš sa paddingsima i ostalime, no frks

ZA COMPLIANCE sa IE5.01, 5.5 i 6 dodaješ magičnu liniju
Code:
* html #menu li { display:inline; }

da, dobro si razumjela, to je samo jedna linija hacka

styleanje listi u sadržaju radi isključivo unutar nekog drugog DIV-a (eg. content) jer ako ih radiš na globalnom nivou crashat ćeš navigaciju
Code:
#content ul { list-style-type:square; }
#content ul, ol { text-align:justify; margin:0 0 10px 20px; }
Back to top
View user's profile Send private message Send e-mail Visit poster's website
nel`chee



Joined: 08 Jul 2004
Posts: 2087
Location: Rijeka

PostPosted: 27.08.2005 20:07    Post subject: Add user to your forum ignore list Reply with quote

ok svaka cast - hvala na trudu, ali jesi li siguran da radi? jesi li isprobao? jer ja sam isla pogledat, kad maknem display: none uopce mi se ne prikazu submeniji, sto je u mojoj verziji islo. i zapravo, problem sa scrollom u operi jos uvijek postoji. iskreno, osim sto je znatno manji ne vidim u cemu je ovaj kod bolji...

evo primjeri
moj originalni CSS - kad maknem display: none, u IE-u se vidi submeni na pravom mjestu
improved by Sulien - kad maknem display: none, u IE-u se submeni uopće ne vidi
improved by Sulien, adaptiran na veličine u px - isti problem kao i gore

ovi postoci su zajebani, ako malo promijenim postotak izgubi se kontinuitet i meni se sakrije kad pomaknem mis, ja bi radije to u fiksnim velicinama - hell, slova su dovoljno velika u originalu i povecavat ih ne treba.

alzo, ako treba poseban stylesheet za IE, neka bude, uopce me to ne dira ionako cu ga includat kroz conditional comments, ali samo neka radi, a ja to nazalost ne mogu napravit sama jer ne vidim javascript.

_________________
art & design portfoliofree Photoshop brushes stuffsketchblogfacebook
Back to top
View user's profile Send private message Visit poster's website Twitter profile
Sulien



Joined: 04 Jan 2004
Posts: 2905
Location: Zagreb

PostPosted: 27.08.2005 22:40    Post subject: Add user to your forum ignore list Reply with quote

nel`chee wrote:
ok svaka cast - hvala na trudu, ali jesi li siguran da radi? jesi li isprobao?

IE5.01, IE5.5, IE6, Firefox & Opera 8 Cool

Quote:
jer ja sam isla pogledat, kad maknem display: none uopce mi se ne prikazu submeniji, sto je u mojoj verziji islo.

nešto jako krivo radiš, meni su kad maknem svi jedan na drugome, kako bi i trebalo biti Confused

Quote:
i zapravo, problem sa scrollom u operi jos uvijek postoji.

umm ja ne vidim ništa

Quote:
iskreno, osim sto je znatno manji ne vidim u cemu je ovaj kod bolji...

kad budeš to znala onda ćeš biti puno veći CSS expert nego sad.

Quote:
i btw, ovi postoci su zajebani, ako malo promijenim postotak izgubi se kontinuitet i meni se sakrije kad pomaknem mis, ja bi radije to u fiksnim velicinama - hell, slova su dovoljno velika u originalu i povecavat ih ne treba.

no dobro, prisilila si me da sve objasnim Rolling Eyes

Ne znam kakav je bio originalan menu sa ALA, ali ovaj tvoj je bio loš zbog toga što je ovisan o vertikalnoj poziciji na ekranu i izražen je u apsolutnim veličinama. Zbog toga ga dvije stvari razbiju: npr. odlučiš smanjiti/povećati header ili ti netko dođe sa malo povećanim slovima u browseru. A želimo biti accessible, zar ne?

Glavna #menu lista sada više nema fiksnu visinu, rasteže se kako povećavaš slova. Također, border ispod nje koji daje privid druge razine također je izražen u em-ovima. Jako važna stvar je i position:relative rule u #menu jer će zbog njega apsolutno pozicioniranje elemenata (submenija) biti relativno prema glavnom meniju što je dobra stvar jer ga možemo premještati svuda po stranici. Samo mali ispravak u mojem CSS-u:
Code:
#menu li ul {
   float:left;
   display: none;
   position:absolute;
   top:1.6em;
   left:0;
   width:630px;
}
#menu li li { font-size: 70%; }

omogućuje da se meni lijepo resize-a do određene granice što ti možeš bolje srediti ako ti #container i #menu budu relativne širine, ne apsolutne, ali to je stvar tvog layouta. U ispravku svog CSS-a sam samo vratio natrag font-size u uži kontekst (kako je zapravo i kod tebe bilo) da bi se lijepše resizealo. Sa naznačenim IE hackom all works like a charm i nakon ove elaboracije valjda shvaćaš koliko je meni sad poboljšan.

Submenu ima position:absolute, ali zbog position:relative u #menu elementu to 'apsolutno' pozicioniranje zapravo je relativno na #menu. To znači da left vrijednost treba biti 0, dok top treba biti visina glavne navigacije, što je 1.6 em. Kad odlučiš promijeniti izgled svog menija, dobro uskladi taj top property sa veličinom teksta da ne bi nastala rupa između glavne navigacije i podnavigacije; kroz tu pukotinu više neće vrijediti :hover i podmenu će nestati ako pokušaš na njega doći mišem. TIP: Da dobro vidiš ako ti slučajno nastane pukotina dok tweakaš CSS stavi recimo background:red na #menu li ul da budeš sigurna da si zakrpala pukotinu, nakon čega makneš background rule (prije nego što ti oči počnu krvariti od te gadne W3C crvene boje)
Back to top
View user's profile Send private message Send e-mail Visit poster's website
nel`chee



Joined: 08 Jul 2004
Posts: 2087
Location: Rijeka

PostPosted: 28.08.2005 01:08    Post subject: Add user to your forum ignore list Reply with quote

Sulien wrote:
nel`chee wrote:
ok svaka cast - hvala na trudu, ali jesi li siguran da radi? jesi li isprobao?

IE5.01, IE5.5, IE6, Firefox & Opera 8 Cool

dobro, ovo dvoje provjerih i ja i izuzev scrollbara u operi, štima.

Quote:
nešto jako krivo radiš, meni su kad maknem svi jedan na drugome, kako bi i trebalo biti Confused

hmm pa copy/paste? ne znam što sam mogla fulat.

Quote:
no dobro, prisilila si me da sve objasnim Rolling Eyes

ajd, nije ti ni prvi ni zadnji put da nama n00bovima sve objašnjavaš Laughing

[quot]Ne znam kakav je bio originalan menu sa ALA, ali ovaj tvoj je bio loš zbog toga što je ovisan o vertikalnoj poziciji na ekranu i izražen je u apsolutnim veličinama. Zbog toga ga dvije stvari razbiju: npr. odlučiš smanjiti/povećati header ili ti netko dođe sa malo povećanim slovima u browseru. A želimo biti accessible, zar ne?[/quote]
dala sam i link do ALA-e i mogao si se uvjerit da je moj kod bio copy/paste, izuzev manjih prilagodbi, no i oni su imali pozicioniranje riješeno na taj način.

eto zahvaljujem na trudu (postam link tu kad uploadam site da mi prijavite moguće bugove) Smile

_________________
art & design portfoliofree Photoshop brushes stuffsketchblogfacebook
Back to top
View user's profile Send private message Visit poster's website Twitter profile
nel`chee



Joined: 08 Jul 2004
Posts: 2087
Location: Rijeka

PostPosted: 28.08.2005 03:41    Post subject: Add user to your forum ignore list Reply with quote

http://inobscuro.com/

please testirajte Smile

e da, izgubili su mi se kvadratici na listama u content, iako sam naglasila kao sto si rekao #content ul {list-style-type: square}
sto je krivo? Confused ja te kvadratice zelim jako. ovako izgleda neuredno.

_________________
art & design portfoliofree Photoshop brushes stuffsketchblogfacebook
Back to top
View user's profile Send private message Visit poster's website Twitter profile
Sulien



Joined: 04 Jan 2004
Posts: 2905
Location: Zagreb

PostPosted: 28.08.2005 13:29    Post subject: Add user to your forum ignore list Reply with quote

stvar je u tome što se list-style:none propagirao u svim listama i list itemima, ako staviš na neku određenu listu list-style opet će itemi te liste zadržati style:none

znači makni iz univerzalnog selektora dotični rule i stavi ga u kontekst samo listi:
Code:
ul, ol { list-style:none; }
Back to top
View user's profile Send private message Send e-mail Visit poster's website
nel`chee



Joined: 08 Jul 2004
Posts: 2087
Location: Rijeka

PostPosted: 28.08.2005 16:15    Post subject: Add user to your forum ignore list Reply with quote

e vidis to mi nije palo na pamet Smile

nego nisi mi rekao, jel radi ovo na mom site-u kako treba? plz samo neka netko otvori u IE-u i kaze dal radi. thnx unaprijed.

_________________
art & design portfoliofree Photoshop brushes stuffsketchblogfacebook
Back to top
View user's profile Send private message Visit poster's website Twitter profile
Display posts from previous:   
This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies.    mi3dot.org Forum Index -> Client-side All times are GMT + 1 Hour
Page 1 of 1

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum


Powered by phpBB © 2001, 2005 phpBB Group