Resurse Javascript

7 Jan

Dacă tot sunt întrebat aproape zilnic cum am învăţat javascript (şi tot spun că eu NU ştiu js; ştiu jQuery - şi nici ăsta la un nivel foarte avansat) am zis că ar fi bine să pun la bătaie câteva tutoriale video care se întâmplă să le am în bookmarks, dar nu am apucat să le văd decât pe sărite deoarece timpul nu este tocmai cel mai bun prieten al meu.

Introducere în Javascript

Theory of DOM

Advanced Java script

Joe Hewitt: welcome to Firebug

În afară de ultimul link, sunt câte trei link-uri pe rând, aşa că ai grijă pe ce dai click ;)

Enjoy!

Despre formulare

5 Jan

Azi am început să tai un layout ce avea o parte dintr-un formular un pic… diferit de cum ar fi normal. Şi anume un alt buton de upload. Şi m-am gândit eu puţin şi am ajuns la concluzia că elementele ce intră într-un tag form sunt cel mai greu de customizat:

  1. <legend> se comportă diferit pe firefox comparativ cu IE sau Opera, neputând fi poziţionat în niciun fel - padding/margin. Singura soluţie ar fi poziţionare relativă a fieldset-ului şi poziţionare absolută a tag-ului legend. Sau folosirea unui titlu în locul lui <legend> (<h4> sau <h5>)
  2. <input type=”checkbox” /> şi <input type=”radio” /> nu poţi sa le convingi prea uşor de un anume background/culoare. Cred că ţine şi de setările sistemului de operare :)
  3. <input type=”text” /> şi <textarea> au un „mic” bug în IE: dacă are o imagine ca background iar textul depăşeşte lătimea definită, background-ul pleacă la pădure. Fix? Pentru IE6 se defineşte bg ca fixed. Pentru IE7 nu am găsit altă soluţie decât să pun input-ul sau textarea într-un alt element (span/div) şi schimb background la acest element.
  4. <select> & <option> padding-ul se aplică după ureche, în funcţie de browser. În plus, în IE6 este un bug criminal: niciun element nu poate apărea deasupra unui <select>. Soluţia? Dacă foloseşti jQuery, găseşti o mulţime.
  5. Am lăsat cireaşa de pe tort (bomboana de pe colivă?!) la urmă: <input type=”file” />. Un simplu style=”border:1px solid #000″ îi strică rău de tot aspectul. Soluţii sunt multiple:
  • nu te legi sub nicio formă de file şi te mulţumeşti doar cu lăţime;
  • foloseşti o şmecherie făcută în flash (ai nevoie şi de cunoştinţe server side);
  • foloseşti o şmecherie făcută în javascript. Sau un plugin pentru jQuery (download AICI deoarece nu prea merge site-ul).

Pentru primele patru probleme există o rezolvare foarte simplă all in one. Este o versiune recentă ce rezolvă o parte din problemele iniţiale (select-ul nu funcţiona decât dacă se făcea click pe săgeată, nu se putea folosi tastatura).

Enjoy!

Legislaţie rutieră

28 Dec

Da frate, dacă vrei să înveţi să-ti iei (sau să-ţi recuperezi) permisul auto, trebuie să înveţi de undeva, nu? Şi cum noi suntem mai geek’s (altfel n-am scrie posturi pe blog la 4 dimineaţa), Skid s-a gândit el ce s-a gândit şi a zis că ar fi bine să facă un site cu/despre legislaţie. Legislatie Rutiera.

Spor la chestionare!

Scris în categoria: Internet 4 Comentarii

Blogbrowsing

28 Dec

A apărut de ceva timp în blogosfera românească acest serviciu. E drăguţ, e original, are chiar şi un plugin pentru Wordpress dar are o problemă destul de gravă ce se pare că nu s-a rezolvat nici la o săptămână de la semnalarea ei: orice este în pagină javascript refuză să mai funcţioneze (cel puţin pe Firefox).

Explicaţia:

scriptul Blogbrowsing se adaugă în pagină prin următoarea metodă:

document.body.innerHTML+= s

Ceea ce înseamnă: „ia frumuşel tot codul din tagul <body>, adaugă după el conţinutul variabielei s (adică ce apare în colţul din dreapta sus), şterge tot ce e înlocuieşte vechiul body cu ce a rezultat”. Din această cauză, toate eventurile ataşate elementelor DOM se anulează.

Soluţia:

La o oră târzie în noapte, mi-a venit ideea să mă uit în sursa codului şi să fac ceva încercări. Cea mai la îndemână soluţie a fost generarea unui element nou şi inserarea codului Blogbrowsing în acest element.

var newdiv = document.createElement('div');

var divIdName = 'blogBrowsingJsFix';

newdiv.setAttribute('id',divIdName);

document.body.appendChild(newdiv);

în locul inserării în body, am inserat codul în div-ul proaspăt creat:

document.getElementById("blogBrowsingJsFix").innerHTML = s;

Am testat doar pe Firefox, dar, teoretic, ar trebui să aibe acelaşi comportament şi pe restul browserelor. Aştept(ăm) corectarea codului pentru a include iar codul în pagină ;)

//update: am testat pe firefox, opera, safari, ie6 şi ie7. Pe IE6 e problema cu ActiveX (trebuie sa faci click pe flash pentru a fi rulat), dar în rest merge bine :D

Scris în categoria: Internet 2 Comentarii

Moş Gerilă

21 Dec

Mosgerila.ro şi Moshgerila.ro sunt libere :naughty:

edit: şi mosgherila.ro e liber (asta pentru cei de la Guerilla :w00t: )

Scris în categoria: Internet Un comentariu