Having some issues with events triggering in a weird way. If you hit open and close a few times on the jsfiddle below you will see what's happening:
http://jsfiddle.net/rzs7x4ab/5/
$('.btn-open-wrapper').on('click', function (event) {
event.stopPropagation();
$(".blackboard-wrapper").one("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function (event) {
$('.btn-open-wrapper').addClass('is-hidden');
$('.btn-close-wrapper').addClass('is-visible');
});
$('.blackboard-wrapper').addClass('is-open');
});
$('.btn-close-wrapper').on('click', function (event) {
$('.btn-open-wrapper').removeClass('is-hidden');
$('.btn-close-wrapper').removeClass('is-visible');
event.stopPropagation();
$(".btn-close-wrapper").one("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function (event) {
$('.blackboard-wrapper').removeClass('is-open');
});
});
(Firefox does it pretty well)
The reason is camelCase transitionEnd
(you did not used)