WebAddicted היא פינה חדשה בבלוג לעיצוב גרפי וטכנולוגיה שמביאה לכם את כל העידכונים, כלי הפיתוח, הפלאגינים והפריימוורקים החמים ביותר בעולם פיתוח הווב.

jQuery Plugins

Adipoli jQuery Image Hover Plugin

פלאגין jQuery טרי הכולל מקבץ של 20 מעברי אנימציה (Transitions) מרהיבים במעבר על תמונות. בין השאר הפלאגין "Adipoli" מציע גם תמיכה במעברים בין שחור לבן לצבעוני בעזרת HTML5 Canvas.

Camera

Camera הוא פלאגין jQuery המבוסס על הפלאגין Diapo הישן ומציע להטמיע בקלות גלריה . סליידר הכולל מעברים חלקים ויפים, תמיכה בתמונות, טקסט ווידאו ומאפשר להוסיף תיאור על כל אחד מאלה.

JQUERY CUSTOM CONTENT SCROLLER

פלאגין ישן שחודש לאחרונה ומאפשר להטמיע בקלות סקרולברים מותאמים אישית. הפלאגין מחליף את הסקרולברים הדיפולטיביים של הדפדפן בסקרולברים מותאמים לפי ההגדרות שהמפתח מעביר. בנוסף, הפלאגין גם גורם לגלילה בעזרת הגלגלת של העכבר להיות חלקה ומונפשת.

Arctext.js

Arctext.js – כשמו כן הוא, הוא פלאגין jQuery משולב עם CSS3 Transforms שמאפשר ליצור אפקט תיבה (Arc) על כל טקסט שתרצו (בדומה לאפקט הArc בפוטושופ או פאוורפוינט). כל מה שתצטרכו להעביר זה את האלמנט עליו תרצו להפעיל את הפלאגין ואת הרדיוס אותו תרצו לראות על הטקסט.

HTML5

טופס התחברות והרשמה בHTML5

POC מאוד מעניין שמראה את הכח של HTML5 וCSS3 בכל מה שקשור לטפסים. הדוגמה הזאת משתשמת בHTML5 Validation – אימות נתונים בעזרת HTML5, ובמעבר ועיצוב הטפסים בעזרת CSS3.

Quake3 with HTML

דמו מטורף שמראה את הכח העצום של HTML5 ופותח כמחווה למשחק האגדי Quake 3. הדמו מציג כמה מסכים מתוך המשחק ומאפשר לכם להסתובב בעולם של המשחק ולראות את הגרפיקה שמרונדרת בעזרת המנוע הגרפי של HTML5 – WebGL.

CSS3

 Accordion with CSS3

שימוש מאוד מעניין בסלקטור חדש של CSS3 בשם Checked: שמאפשר לבחור צ'קבוקס או כפתור רדיו במצב שהוא נבחר ולתת לו סטיילים משלו. בדמו הזה, המפתח יצר טאבים ע"י שימוש ביכולות של CSS3 בלבד וללא JS!

Content Navigator with CSS3

דמו מעולה לעיצוב רספונסיבי מבוסס CSS3 Transitions. הדמו מציג תפריטים מבוססי CSS3, עיצוב רספונסיבי, מעברי אנימציה יפים ושימוש מעניין בסלקטור target: של CSS3 שמאפשר לבחור אלמנט עם ID זהה ללינק הפעיל בURL. עוד על הסלקטור הזה תוכלו לקרוא פה.

CSS3 3D Clouds

דמו מרהיב שנבנה בהשראת העבודה "עננים בתלת מימד עם HTML5 WebGL" ונבנה בעזרת CSS3 3D ועם קצת עזרה מג'אווה סקריפט. מרשים מאוד.

מדריכים

5 מדריכים ליצירת jQuery Plugin

הבלוג המצוין jQuery4u פירסם מאמר מאוד מעניין הכולל 5 מאמרים ברמות שונות על פיתוח פלאגיני jQuery החל מהשלב הראשון, דרך ארכיטקטורה נכונה של פלאגין jQuery ועד Development Patterns בפיתוח פלאגינים.

CSS3 Image Styles

בWebdesigner Wall פורסם מדריך מקיף ומאוד מעניין על אפקטים יפיפיים על תמונות שניתן להשיג בעזרת CSS3 בלבד.

זה הכל לחודש מרץ 2012 בפינת WebAddicted של הבלוג. יצא לכם להשתמש בכלי פיתוח מעניינים? בדיוק סיימתם לפתח פלאגין jQuery יעיל? יצרתם דמו מגניב בטירוף בHTML5 או CSS3? צרו איתי קשר ואדאג לפרסם את הקישור שלכם.

שיהיה חודש מצוין!

כתיבת תגובה לבטל