24 תפריטים נפתחים עם אנימציות מדהימות מבוסס JQ

פברואר 17, 2011   //   על ידי אבי כהן   //   css, html, Javascripit, דפוס, טכנולוגיה, מדריכים, עיצוב, פוטושופ, שימושון  //  11 תגובות

jQuery  הוא כלי נהדר שעוזר להפוך רעיונות למציאות, אפשר לעשות באמצעותו כמעט הכל, והדבר הכי טוב שמדובר בספריית JS קלילה שתומכת בכל הדפדפנים.

באמצעות המחלקות של jQuery תוכלו להפוך את האתר שלכם לאטרקטיבי ומעניין, ללא צורך בידע מעמיק בJS!

את הפוסט הבא הבאתי, לאחר שהחלטתי שצריך לתת דגש לחלק הכי חשוב באתר, ולרושם הראשוני אותו הגולש מקבל ממנו, ומה החלק החשוב ביותר שהגולש משתמש בו באתר?!

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

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

אתם מוזמנים להתרשם מאוסף מדריכים של תפריטים מבוססי jQuery  שיעזרו לאתר שלכם להיראות טוב יותר!

תפריט נגלל מבוסס jQuery

במדריך הזה תוכלו ללמוד כיצד ליצור תפריט נגלל מותאם עם אייקונים שנשלטים באמצעות העכבר

תפריט מתוק

התפריט נקרא ככה בגלל שהוא גורם לתפריט שלכם להיראות פשוט מתוק כנסו ותבינו.

תפריט מרשים מבוסס jQuery + css3

במדריך הבא תוכלו ללמוד כיצד ליצור תפריט מרשים מבוסס jQuery + css3.

תפריט רוק & רול עם פינות מעוגלות

במדריך הבא תלמדו כיצד ליצור תפריט מגניב עם פינות מעוגלות ואנימציה מדהימה!

תפריט נפתח כלפיי מטה עם אפקט קליל (האצה/האטה)

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

תפריט גלריית אייקונים

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

תפריט אקורדיון רוחבי

תפריט אקורדיון רוחבי שמכיל אפקט כניסה ויציאה שמציגה תוכן בלחיצה

תפריט ערימה

התפריט שהוא יותר סוג של ווידג'ט של תצוגת "ערימה"

תפריט kwicks

במדריך תוכלו ללמוד כיצד ליצור תפריט kwicks משלכם.

תפריט "מקפץ"

כאשר תעברו עם העכבר על התפריט הוא יקפץ כלפיי למעלה.

תפריט עם אפקט במעבר עכבר

בתפריט הבא תקבלו אפקט צביעה כאשר תעברו עם העכבר ופתיחה של טאב.

תפריט נפתח צבעוני

מומלץ להשתמש במדריך הבא במידה ואתם מעוניינים ללמוד כיצד ליצור תפריט נפתח עם מספר צבעים.

תפריט צף

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

תפריט נפתח לרוחב עם אנימציה

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

תפריט עם אפקט מעומעם

התפריט הבא מגיע עם אפקט עמעום במעבר עכבר

תפריט חיפוש כולל פילטרים לסינון

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

תפריט "דלת מוסך"

התפריט דומה לאפקט שיש כאשר פותחים את דלת המוסך במעבר עכבר יעלה הכפתור ויוצג התוכן.

תפריט אנכי נפתח מקפץ

תפריט אנכי מקפץ פשוט מבוסס CSS3, האפקט מתבצע במעבר עכבר.

תפריט קובייה נגלל כלפיי מטה

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

תפריט מואר

באמצעות התוסף הבא תוכלו ליצור תפריט מואר שרודף אחרי מיקום העכבר על התפריט

תפריט ריבועים

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

תפריט מאוזן נגלל

במדריך הבא תוכלו ללמוד כיצד ליצור תפריט מאוזן נגלל מבוסס CSS

תפריט עם תמונת רקע

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

תפריט צץ

תפריט שמעיף תיאור לכפתורים אל תוך העמוד במעבר עכבר.
מקור: noupe

אודות הכותב:

אבי כהן הינו מעצב ממשקים ואתרי אינטרנט אשר בין היתר עוסק גם בפיתוח צד לקוח. המייסד של כשעיצוב גרפי וטכנולוגיה נפגשים. בעל ניסיון עשיר בעיצוב אתרי אינטרנט מסחריים ותדמיתיים תוך השמת דגש על ערכי חווית המשתמש והמכירה. פייסבוק | לינקדין | טוויטר

פוסטים נוספים - אתר אישי

אנשים שקראו כתבה זו התעניינו גם ב:



11 תגובות

  • תודה רבה אחי,
    מדהים!!!

  • פוסט מצויין. תודה רבה!

  • תודה רבה

  • תודה רבה חברים

  • ביג לייק!!

  • תודה עמי

  • פוסט מצוין, אהבתי אותו עוד במקור שלו באנגלית

  • אכן פוסט יפה אני מקווה שהיו עוד…….

    תודה.

    • שבוע טוב,
      בקרוב יהיו עוד כמה פוסטים בסגנון..

  • אחד הפוסטים אם לא ה..

    ממש נהנתי, תודה!

הגב

שוחחו איתי אונליין

דצמבר 2014
א ב ג ד ה ו ש
« אוגוסט    
 123456
78910111213
14151617181920
21222324252627
28293031