Întrebări CSS şi jQuery
25 MayRăspund la întrebări bune despre CSS şi/sau javascript/jQuery.
Poţi întreba lăsând un comentariu. Răspunsul va veni în câteva zile, când se vor strânge câteva întrebări.
Răspund la întrebări bune despre CSS şi/sau javascript/jQuery.
Poţi întreba lăsând un comentariu. Răspunsul va veni în câteva zile, când se vor strânge câteva întrebări.
Se poate anula meniul ce apare la click dreapta pe o pagină?
Desigur! Dar… Pentru ce ai vrea să faci asta?
Nimic mai adevărat. Tocmai am aflat că Internet Explorer + position:relative + padding nu prea se împacă cu eventul mouseover din javascript sau cu pseudo-clasa :hover din CSS (valabil doar pentru IE7).
Codul iniţial era următorul:
1 2 3 4 5 | <dd> <h2><a href="tooltip.cfm?id=#id#&section=#section#" class="jTip">#title#</a></h2> <p>in <a href="##">#location_name#</a> of <strong>#apt_no#</strong> of <strong>#property_name#</strong></p> <span class="control"><a href="ticket_edit.cfm?id=#id#" class="edit"></a></span> </dd> |
DD era pozitionat relativ iar span class="control" era poziţionat absolut şi afişat doar la mouseover (făcut cu javascript din considerente de compatibilitate cu IE6, altă pocnitoare). Well… După o sesiune de vreo 10 minute de înjurături la adresa neamului lui William Henry Gates al III-lea, mi-a venit ideea salvatoare să aşez tot conţinutul DD într-un DIV:
1 2 3 4 5 6 7 | <dd> <div class="cnt"> <h2><a href="tooltip.cfm?id=#id#&section=#section#" class="jTip">#title#</a></h2> <p>in <a href="##">#location_name#</a> of <strong>#apt_no#</strong> of <strong>#property_name#</strong></p> <span class="control"><a href="ticket_edit.cfm?id=#id#" class="edit"></a></span> </div> </dd> |
Am transferat toate proprietăţile DD către div class="cnt" iar eventul l-am lăsat în continuare pe DD. Merge minunat
EDIT:
Este prima mea întâlnire cu Cold Fusion. Pare interesant, dar… Nu-i de mine
Eu sunt utilizator de jQuery şi mulţi ştiu asta. Dar deoarece atât UI 1.0 cât şi 1.5beta fie nu s-au „mulat” după nevoile mele, fie eram într-un stadiu prea avansat cu Interface pentru a face „upgrade”, am renunţat şi am rămas la vechiul, dar bunul (parcă ar fi vin
) Interface (site-ul este momentan down, dar am arhiva
).
Eh, şi cum foloseam eu Interface, acum vreo lună-două, m-am lovit de o problemă căreia nu i-am dat prea multă importanţă: cum limitez câte elemente are un sortable? Am stat puţin, am căutat pe goole, fără succes însă şi am lăsat-o baltă, mai ales că proiectul era pus pe hold. În ziua de azi însă, proiectul este în floare, se lucrează în draci şi a trebuit să revin asupra problemei. După câteva ore de căutări pe google şi pe o mulţime de liste de discuţii, timp în care îmi pierdeam speranţa că ar putea fi posibil aşa ceva, îmi vine în cap o idee genială: de ce să nu întreb direct la sursă?
Mi-am luat inima în dinţi şi am vorbit cu Eyecon, i-am expus problema şi în mai puţin de cinci minute mi-a dat rezolvarea:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | $('.sort').Sortable({ accept : 'sortItem', activeclass : 'sortableactive', hoverclass : 'sortablehover', helperclass : 'sorthelper', opacity: 0.5, fit : false, floats: true, onStart: function(){ console.log($('#big .sortItem').size()) if ($('#big .sortItem').size() == 3) { //numărul maxim de elemente acceptate console.log($('#big').get(0).dropCfg.a) $('#big').get(0).dropCfg.a = 'dummyRandom'; } else { $('#big').get(0).dropCfg.a = 'sortItem'; } } }); |
Şi gata
Şi demo aici (click!).
Berea se duce direct la Eyecon
Întrucât bookmarklet-ul anterior a avut un oarecare succes, iar Quote-ul automat ce l-am făcut de dimineaţă merge frumos şi mi-ar place să-l văd pe alte bloguri, m-am gândit să îl fac accesibil oricum (desigur, nu chiar aşa de frumos ca la mine pe blog
).
Acesta este la fel de simplu de folosit ca şi bookmarklet-ul anterior, poate chiar mai simplu de „instalat”: pur şi simplu tragi următorul link în bara de bookmarks.
Din păcate (da, sigur!) nu merge în Internet Explorer (în alte browsere nu am testat, dar ar trebui să meargă). Altfel spus: fă-ţi bă update!
Ok, dar ce face? Păi… Dacă eşti blogger profesionist (sau îţi place să comentezi mult pe alte bloguri) şi obişnuieşti să-i citezi pe alţii, nimic mai simplu: selectezi textul pe marginea căruia vrei să comentezi şi apeşi pe bookmarklet. Textul selectat va fi inserat în formularul de comment, în interiorul tagului <blockquote>, ţie rămânându-ţi doar să îi răspunzi celuilalt utilizator. Cât de (in)util este şi acest bookmarklet, te las pe tine să-mi spui.
Momentan este în stadiu beta
iar dacă observi vreo funcţionare dubioasă, te rog să-mi laşi un comment aici
Deoarece am plecat de la premisa că un blog are maxim un textarea, este posibil ca în cazuri extreme să funcţioneze aiurea (să insereze selecţia în primul textarea). Se poate modifica să funcţioneze şi pentru forumuri (cu un alt bookmarklet), înlocuindu-se <blockquote> </blockquote> cu [quote] [/quote].
Enjoy!