
引用插件<script type="text/javascript" src="js/jquery.min.js"></script><script type="text/javascript" src="js/jquery.easing.min.js"></script><script type="text/javascript" src="js/jquery.mixitup.min.js"></script>调用方法var filterList = { init:function(){ // MixItUp plugin $('#portfoliolist').mixitup({ targetSelector: '.portfolio', filterSelector: '.filter', effects: ['fade'], easing: 'snap', // call the hover effect onMixEnd: filterList.hoverEffect() }); }, hoverEffect:function(){ // Simple parallax effect $('#portfoliolist .portfolio').hover(function(){ $(this).find('.label').stop().animate({bottom:0},200,'easeOutQuad'); $(this).find('img').stop().animate({top:-30},500,'easeOutQuad'); },function(){ $(this).find('.label').stop().animate({bottom:-40},200,'easeInQuad'); $(this).find('img').stop().animate({top:0},300,'easeOutQuad'); }); } }; // Run the show! filterList.init();