(function($) { $('.isekai-collapse').addClass('animate') function expand(titleElem, containerElem, contentElem) { containerElem.prop('open', true); var collapsedHeight = titleElem.outerHeight(); containerElem.css('height', collapsedHeight); requestAnimationFrame(function() { var expandedHeight = collapsedHeight + contentElem.outerHeight(); containerElem.css('height', expandedHeight); }); } function collapse(titleElem, containerElem, contentElem) { var collapsedHeight = titleElem.outerHeight(); var expandedHeight = collapsedHeight + contentElem.outerHeight(); containerElem.css('height', expandedHeight); requestAnimationFrame(function() { containerElem.addClass('closing').css('height', collapsedHeight); setTimeout(function() { containerElem.prop('open', false).removeClass('closing'); }, 260); }); } $('.isekai-collapse .isekai-collapse-title').on('click', '', function(e) { e.preventDefault(); var titleElem = $(this); var containerElem = titleElem.parent('.isekai-collapse'); var contentElem = containerElem.find('.isekai-collapse-content'); if (containerElem.prop('open')) { // 需要收起 collapse(titleElem, containerElem, contentElem); } else { // 需要展开 expand(titleElem, containerElem, contentElem); } }); function onMediaQueryChanged(mediaQueryList) { console.log('mediaQuery', mediaQueryList.matches); if (mediaQueryList.matches) { // 打印时展开所有折叠 $('.isekai-collapse').each(function() { $(this).prop('open', true); }); } } if (window.matchMedia) { var mediaQueryList = window.matchMedia('print'); onMediaQueryChanged(mediaQueryList); mediaQueryList.addEventListener('change', function(e) { onMediaQueryChanged(mediaQueryList); }); } })(jQuery);