{
    分享网正式开通,我们为大家提供免费资源,欢迎大家踊跃投稿!

jQuery+CSS3仿windows8 Metro风格界面布局效果

这是一款基于jQuery+CSS3实现的仿windows8 Metro风格界面布局效果,Win8 Metro系统风格面板点击全屏打开展示内容。


js代码

<script src="js/jquery-2.1.1.min.js" type="text/javascript"></script>
<script>
$(document).ready(function () {
	var $box = $('.box');
	$('.metro li').each(function () {
		var color = $(this).css('backgroundColor');
		var content = $(this).html();
		$(this).click(function () {
			$box.css('backgroundColor', color);
			$box.addClass('open');
			$box.find('p').html(content);
		});
		$('.close').click(function () {
			$box.removeClass('open');
			$box.css('backgroundColor', 'transparent');
		});
	});
});
</script>


在线预览
资源均来自第三方,谨慎下载,前往第三方网站下载


爱资源分享网 , 版权所有丨本站资源仅限于学习研究,严禁从事商业或者非法活动!丨本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:jQuery+CSS3仿windows8 Metro风格界面布局效果
喜欢 ()分享 (0)