כיצד להגדיל תמונות כמו בינוני
פלטפורמת הבלוגים בינונית משתמשת ב תמונה מותאמת אישית זום אפקט - - על דפי הבלוג שלהם. בכל פעם שהמשתמש לוחץ על תמונה הוא יתקרב באופן אוטומטי לגודל גדול יותר.
זה אפקט גדול בהחלט ייחודי בינוני, אבל זה לא היה משהו שיכול בקלות להיות מועתקים.
עכשיו, עם בינוני סקריפט, זה קל יותר מאשר אי פעם. זה סקריפט JS הוא קל וקל להוסיף לתוך כל אתר או בלוג.
אם אתה רוצה לראות איך זה עובד אתה יכול לבקר את הדגמה חיה בהנחיית היוצר דייוויד קליניאנו.
הוא בילה זמן nailing את המעבר המדויק ואת האנימציה אנימציה מותאמת אישית ליצור תמונת מראה של זום התמונה של בינונית. הספרייה כולה שנכתב ב- JavaScript טהור, אז זה לא מסתמך על כל 3מחקר ופיתוח סקריפטים צד כגון jQuery.
אתה צריך לדעת קצת JS להגדיר את זה אבל אתה בהחלט לא צריך להיות מומחה.
כל תמונה יכולה לקחת נתונים * תכונות עבור הגדרת גובה וגודל מלא בגודל, אשר כולם משך באופן דינמי מהתוסף. קוד ההתקנה הוא מאוד פשוט והוא יכול לכוון את התמונות עצמם, או מכולות כמו
הנה קטע הקוד היחיד שעליך להפעיל את הפלאגין:
MediumLightbox ('figure.zoom-effect'); בתוך הפונקציה, אתה לעבור בורר עבור כל האלמנטים (למשל. .זום אפקט מעמד. מחלקה זו היא שהוגדרו במפורש בגיליון הסגנונות של MediumLightbox, לכן מומלץ להשתמש בו גם בדף שלך.
וכאשר זה מוגדר, אתה מוכן!
באזור התוכן של הדף שלך, תוכל לעטוף את כל התמונות ב- a
כדי להוריד עותק של סקריפט זה ולהתחיל, פשוט לבקר את ריפו GitHub הראשי. כאן, תוכלו למצוא גם תיעוד יחד עם קטעי קוד אתה יכול להעתיק כדי לקבל להגדיר במהירות.
