שבץ GIF אנימציה כמו פייסבוק עם jqGifPreview

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

שתי הרשתות לעקוף את זה עם לחץ לתצוגה מקדימה עבור כל קבצי GIF. זה מאפשר למשתמש לבחור אשר אנימציות הם רוצים לראות על ידי בחירה מתי להתחיל / להפסיק את האנימציה.

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

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

GIF מושהה הוא באמת מסגרת אחת של האנימציה, מוצג בדף.

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

תוסף זה משתמש במאפיין נתונים * אחסן את מיקום התמונה GIF. לאחר שהמשתמש לוחץ על התמונה, הוא נטען אוטומטית לתוך src תכונה של התמונה ולהוצג על המסך.

פשוט, יעיל, בהחלט אפקט מסודר! כל מה שאתה צריך זה CSS / JS קבצים עבור תוסף זה, כי אתה יכול למשוך ישירות GitHub. וכמובן, אתה צריך עותק של jQuery, מדי.

משם, אתה מגדיר את התמונה שלך ככה:

הראשי src תכונה צריכה מכילה את התמונה הסטטית. ניתן לבנות סקריפט כדי ליצור אותו, או שתוכל לערוך באופן ידני ולהעלות תמונה סטטית עבור כל GIF.

ה נתונים gif תכונה מחזיקה את GIF אנימציה אמיתי והם יחליפו על קליק אם אתה לכוון את התמונה הראשי בכיתה (במקרה זה, זה .myImg). עכשיו, כל מה שאתה צריך זה שורה אחת של jQuery כדי לקבל את כל זה עובד:

 $ ("myImg") jqGifPreview (); 

בהחלט, אחד plugins jQuery מגניב שראיתי החודש וזה די קל להגדיר.

אתה יכול ללמוד יותר על ידי ביקור דף GitHub ויש גם תצוגה מקדימה הדגמה חיה - - מתארח באתר האינטרנט של היזם.