首页

源码搜藏网

首页 > 设计素材 > div+css模板 >

蓝灰色搭配CSS3网站模板

创建时间:2014-05-21 00:06  

蓝灰色搭配CSS3网站模板
蓝灰色搭配CSS3网站模板
在线演示 立即下载
蓝灰色搭配CSS3网站模板蓝灰色搭配CSS3网站模板是一款大气简洁,适合摄影网站模板。蓝色灰色单页CSS3

<link href='http://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,800' rel='stylesheet' type='text/css'>
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<script src="js/jquery-1.9.1.min.js"></script>
<!--hover-effect-->
<script src="js/hover_pack.js"></script>
<script type="text/javascript" src="js/jquery.mixitup.min.js"></script>
<script type="text/javascript">
$(function () { 
var filterList = { 
init: function () { 
// MixItUp plugin
// http://mixitup.io
$('#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(); 
});
</script>
上一篇:浅蓝色设计类网站模板
下一篇:户外溜冰运动HTML模板

相关内容

热门推荐