LigthtBox In Pure JavaScript – BigPicture.js

BigPicture.js היא ספריית Javascript רספונסיבית (מותאמת למובייל) , נטולת CSS קלה ונוחה לשימוש המיועדת עבור הצגת וידאו ותמונות.
בין הפיצ'רים הכלולים נמנים גם הדברים הבאים:

• תמיכה בתמונות מ Local Storage וכן מ Remote Storage.
• הצגה של וידאו מיוטיוב, VIEMO ו HTML5.
• קסטומיזציה של טריגרים ואירועים..
• Content Loading Spinner

 

איך משתמשים?

הוסף הפניה לקובץ ה JS:

<script src="BigPicture.js"></script>

צור אובייקט מסוג BigPicture אותו תרצה להציג בעמוד שלך:

BigPicture({
  el: this,
  imgSrc: '1.jpg'
});

BigPicture({
  el: this,
  vidSrc: 'html5.mp4'
});

BigPicture({
  el: this,
  ytSrc: 'VIDEO ID HERE'
});

BigPicture({
  el: this,
  vimeoSrc: 'VIDEO ID HERE'
});

הצג/הסתר את תמונת הטעינה:

BigPicture({
  noLoader: false
});

אפשרויות לפונקציית Callback:

BigPicture({
  animationStart: function() {},
  animationEnd: function() {}
});

לאתר הבית של הפלאגין: https://github.com/henrygd/bigpicture

להורדת הספריה: https://github.com/henrygd/bigpicture/archive/master.zip

דמו ודוגמאות: https://henrygd.me/bigpicture/