Skip to content

@artpolikarpov artpolikarpov released this May 14, 2015 · 10 commits to master since this release

Just to fix npm & bower packages.

Assets 4

@artpolikarpov artpolikarpov released this Jan 2, 2015 · 13 commits to master since this release

  • #339 Set box-sizing: content-box; only for needed blocks inside a fotorama
  • #323 Fix autoplay interval corruption on mousemove
  • #312 Let browsers round dimensions by themselfs
  • #299 No more collecting fotorama usage statistics via foreign iframe.

Important! If you load Fotorama from S3, please switch to cdnjs! Our S3 bucket will be killed on JAN 12.

Assets 4

@artpolikarpov artpolikarpov released this Aug 25, 2014 · 28 commits to master since this release

Fotorama 4.6.0 broke image fitting into stage (#286, #291, and many more in inbox). This release fixes that.

Some new features, meanwhile:

  • New enableifsingleframe option. Default value is false. Set it to true if you don’t want to disable fotorama navigation when it has only one frame.
  • Smarter autoplay. Now waits until the next frame is fully loaded.
Assets 4

@artpolikarpov artpolikarpov released this Aug 6, 2014 · 33 commits to master since this release

  • New position and thumbposition options.
  • Fix some IE7 & IE8 bugs (#273, #279).
  • Fix thumbnail fit.
  • Better auto initialization.
  • Fix blocking event flow in some odd situations.
  • #267 “Play” triangles on video thumbnails are back.
  • Finally fix clicktransition behaviour.
  • Fix fotorama:show event triggering.
  • Some minor fixes and optimization.


Fotorama centers photos by default when fits them into a stage. Now you can change this:

<!-- Align photos to the left-top corner -->
<div class="fotorama" data-position="0 0">
  <img src="1.jpg">

  <!-- Override position for a single photo,
       center 2.jpg horizontally, and move up by 10px -->
  <img src="2.jpg" data-position="50% -10px">

  <!-- Show the right-bottom corner of 3.jpg -->
  <img src="3.jpg" data-position="100% 100%">


Works just like position but for thumnbails.

Assets 4

@artpolikarpov artpolikarpov released this Jun 23, 2014 · 54 commits to master since this release


  • Keyboard accessibility, allow tabbing on arrows and thumbs.
  • #255 Better styles for printing.
  • New controlsonstart option. Set it to false if you want controls to appear only after hover or tap.
  • New thumbfit option.
  • New thumbratio:'auto' option (experimental 💀).
  • #232 Simplify and fix logic when to trigger show events
  • #236 Fix video loading on https
  • Default cursor is now pointer because for desktop users one click is enough to switch the frame. Cursor changes to grab only on dragging and swiping.
  • #246 Make fotorama monolithic with z-index.
  • #251 Now fotorama’s dimensions are really the dimensions of the first image (by order, not by loading time).
  • #253 Do not cache $('html') and $('body') for correct fullscreen in single-page-apps (Meteor, Angular, Derby).
  • Fix clicktransition behaviour.
  • #243 Add missing dependencies and repository-setting to package.json
  • Better image fit, work nice with odd width without Retina artefacts.
  • Adjust animations.
  • Disabled trackpad by default.
  • Fix loop conditions.

🍬 🍬 🍬

Today is the 3rd anniversary of Fotorama.

Using Fotorama? Be sure to drop me a link, wanna see it in action:

Thanks for your thanks:

Assets 4

@artpolikarpov artpolikarpov released this Mar 29, 2014 · 92 commits to master since this release

  • Fix animations and visibility of arrows and captions.
  • #181 Always visible arrows via arrows:'always'.
  • #214 Fullscreen mode now using complete width and surpass the maxwidth limit.
  • #218 Allow to hide captions via setOptions.
  • Make loop:true and clicktransition:'crossfade' play well together.
  • #219 Extended keyboard support.
  • Fix some measures collisions.
  • Optimize, test.

Extended keyboard support

The old data-keyboard="true" enables keyboard navigation with the arrows. Extend it passing the object with keys you want to turn on:

<div class="fotorama"
     data-keyboard='{"space":true, "home":true, "end":true}'>
  <img src="1.jpg">
  <img src="2.jpg">
Assets 3

@artpolikarpov artpolikarpov released this Mar 20, 2014 · 105 commits to master since this release

New options:

  • navwidth — sets the special width of the nav;
  • clicktransition — alternative transition after click, now it is possible to slide after swipe and fade after click.

Now fotorama shows only first raw slide while initialization. Class .fotorama--unobtrusive makes fotorama unobtrusive and shows all raw slides, use it when you care about users without JavaScript.

Closed issues:

  • #159 Found the balance between swipe, click, and arrows.
  • #160 Fixed tiny drag on the arrows.
  • #174 Crush sprite files (via @zslabs).
  • #187 Fix compatibility with $.noConflict(true) (via @Lendar).
  • #192 Fixed stopautoplayontouch.
  • #205 Fixed a typo that forced using the http protocol (via @dhayab).

Fixed glimpse, nav overflow bug, and other minors.


Assets 3
Mar 20, 2014

@artpolikarpov artpolikarpov released this Dec 30, 2013 · 139 commits to master since this release

Making Fotorama even better. Fixed issues:

  • #115 Partially hidden fullscreen-icon
  • #159 Some animation bugs.
  • #160 Move-click-swipe tolerances.
  • #161, #162 Recursion (when connecting some of the events and methods).
Assets 3

@artpolikarpov artpolikarpov released this Nov 12, 2013 · 147 commits to master since this release

  • Counterclockwise spinner if direction:rtl.
  • Fix onTouchEnd call. Fix infinite spinner which sometimes happened
  • Fix doubled spinner.
  • Remove stagetap event.
  • More accurate deleting broken frames, good frames will not be flushed any more.
Assets 3
You can’t perform that action at this time.