68素材站

输入色值,自定义改变页面背景颜色

68素材 8078 0
输入色值,自定义改变页面背景颜色
查看演示:暂无演示
附加服务:安装、调试(根据实际情况额外收费)
已下载 261 收藏
特效分类文字特效 文件大小未知大小 需要授权无需授权 是否开源开源
详细说明

主要代码

<div class="btn">
	<i class="fas fa-cog">输入色值</i>
</div>

<div class="box">
	<h2>输入颜色值</h2>
	<div class="box-c">
		<div class="txtb">
			<input type="text" placeholder="#000000" id="hex">
			<div class="prev"></div>
			<button class="apply">应用</button>
		</div>
		
	</div>
</div>

<script type="text/javascript">
	$(function () {
		//显示和隐藏输入框
		$(".btn").click(function () {
			$(".box").toggleClass("box-show");
		});
		//输入颜色能够显示出颜色
		$("#hex").keyup(function () {
			$(".prev").css("background",$("#hex").val());
		});
		//改变body的背景色
		$(".apply").click(function () {
			$("body").css("background",$("#hex").val());
		});
	});
</script>


发表评论 (已有0条评论)

还木有评论哦,快来抢沙发吧~