点击div外部,隐藏该div

本文探讨了使用jQuery实现遮罩层与获奖记录模块的交互设计,包括点击遮罩层隐藏获奖记录和遮罩层的功能实现。通过具体的代码示例,展示了如何在网页中创建一个响应式的遮罩层,并在用户操作时显示或隐藏特定的获奖记录模块。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

	$(".black").click(function(){
							$(".winning-records").hide();
							$(this).hide();
							return false;
						})
						$(".winning-records").click(function(){
							return false;
						})
		<!-- 遮罩层 -->
				<div class="black">
				<!-- 获奖记录 -->
					<div class="winning-records">
						
					</div>
				</div>
.black{
	background: rgba(0,0,0,0.7);
	position:fixed;
	left: 0;
	top: 0;
	z-index: 100;
	width: 100%;
	height: 100%;
}

/*获奖记录*/
.winning-records{
	    background: url(../images/winning-records.png) no-repeat;
    width: 5.99rem;
    background-size: 100%;
    height: 6rem;
    position: fixed;
    top: 50%;
    z-index: 111;
    margin-top: -3rem;
    margin-left: -3rem;
    left: 50%;
	
}

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值