js怎么做一个自定义弹窗啊

2017-11-24 04:09:34 932 阅读 AI 写同款 · GEO 优化AI 选题数据监测一键分发 ›

sinat_37552373 墨衍会员 · AI 创作全网分发关注 + 加入社区

初识colmap COLMAP是一款开源的计算机视觉软件，主要用于从一系列二维图像中进行三维重建。它全称为“COLLISION-MAPping”，是一个高度集成的Structure-from-Motion (SfM) 和 Multi-View Stereo (MVS) 管道工具，由斯坦福大学开发和维护。COLMAP的主要功能包括特征检测与匹配、增量式SfM、多视图立体匹配以及优化。它能够从无序或有序的二维照片集合中恢复出三维场景的几何结构（点云）以及每张图像对应的相机姿态。阅读详情

点击一个按钮，然后会出现一个弹窗，上面写提示内容，下面有确认和取消两个按钮，点确定会跳转页面。
最好发一些源码或者例子，谢谢

...全文

FPGA实现电机转速PID控制通过纯RTL实现电机转速PID控制，包括电机编码器值读取，电机速度、正反转控制，PID算法，卡尔曼滤波，最终实现对电机速度进行控制，使其能够渐近设定的编码器目标值。阅读详情

sinat_37552373

JavaScript 87,984 成员 224,681 内容

+ 关注 + 加入社区

切换为时间正序

前端-珊珊 2017-11-24

打赏
举报

之前做的，不知道你要的是手机端还是pc的。我就来个手机的吧


<!--弹出重新链接的弹框-->
				<div class="show_how_to_link"></div>
				<!--展示链接页面-->
				<div class="show_connect">
					<div class="show_tip">
						<p>定位失败，请重新定位！</p>
					</div>
					<div class="show_button">
						<div id="again_connect">
							<button id="again_position">确定</button>
						</div>
						<div id="cancel">
							<button id="cancel_position">取消</button>
						</div>
					</div>
				</div>




/*显示遮罩层*/
.show_how_to_link{
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	z-index: 209;
	background: rgba(0,0,0,0.2);
	display: none;
}
/*展示连接*/
.show_connect{
	width: 70%;
	height: 200px;
	background: #fff;
	position: absolute;
	z-index: 210;
	border-radius: 10px;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	display: none;
}
/*展示tip*/
.show_tip{
	width: 100%;
	height: 70%;
	text-align: center;
	font-size: 20px;
	border-bottom: 1px solid #CDCDCD;
	display:table; 
}
/*展示tip文字居中*/
.show_tip>p{
	vertical-align:middle;   
  	display:table-cell;   
}
/*提交成功确定按钮*/
.show_button{
	width: 100%;
	height: 30%;
	text-align: center;
	overflow: hidden;
}
.show_button>div{
	width: 49.8%;
	height: 100%;
	float: left;
	text-align: center;
    background: #fff;  
}
#again_connect{
	 border-bottom-left-radius: 10px;
	border-right: 1px solid #CDCDCD;
}
#cancel{
	border-bottom-right-radius: 10px;
	
}
.show_button>div>button{
	width: 100%;
	height: 100%;
	border: none;
    outline: none;
    background: #fff;
    font-size: 16px;
    border-bottom-right-radius: 10px;	
    border-bottom-left-radius: 10px;
}
#again_position{
	color: #0A7046;
	font-weight: bold;
}
#cancel_position{
	color: #7F7F7F;
}



	//取消重新定位 
	$("#cancel_position").bind("click",function(){
		$(".show_how_to_link").hide();
		$(".show_connect").hide();
	})
	//重新定位
	$("#again_position").bind('click',function(){
		$(".show_how_to_link").hide();
		$(".show_connect").hide();
		window.location.href="";//这是写路径的
	})
	//点击遮罩层消失提示
	$(".show_how_to_link").bind("click",function(){
		$(".show_how_to_link").hide();
		$(".show_connect").hide();
	})

天际的海浪 2017-11-24

打赏
举报

窗就是个fixed/absolute定位的div， div初始设置为隐藏display: none;，点击按钮后让div显示出来：divObj.style.display = "block"

js怎么做一个自定义弹窗啊

相关推荐