简单的文本弹出提示框，适用移动web代码,JS代码库,德仔网

代码语言

代码分类

【JS】简单的文本弹出提示框，适用移动web

作者:海霞 / 发布于2014/11/25/ 648

简单的弹出提示框，适用移动web css样式可随意设置，让它也能适用pc 有自动关闭功能


	<!DOCTYPE html>
	<html>
	<head>
	 <meta charset="utf-8">
	 <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	 <title>简单的文本弹出提示框,适用移动web</title>
	</head>
	<body>
	 <script>

	 //调用代码:
	 //msgText.init(text,timer)
	 //text：提示框显示文本,类型String
	 //timer:提示框显示时间,不设置为永久显示 单位为毫秒ms
	
	 var msgText={
	 init:function(text,timer){
	 var _cssText="position: fixed;top: 50%;margin: 0 auto;background: rgba(0, 0, 0, 0.63);color: #fff;padding: 2px 15px;left: 50%;margin:-16px 0 0 -85px;line-height: 2;border-radius: 5px;width: 170px;-webkit-transition:all 0.3s linear;transition:all 0.3s linear";
	
	 this.oP=document.createElement("p");
	 this.oP.innerHTML=text;
	 this.setCss(_cssText);
	 this.show();
	 timer&&(this.hide(timer));
	 },
	 show:function(){
	 document.body.appendChild(this.oP);
	 },
	 hide:function(timer){
	 var _this=this;
	 setTimeout(function(){
	 _this.oP.style.opacity="0";
	 setTimeout(function(){
	 document.body.removeChild(_this.oP);
	 },300)
	 },timer)
	 },
	 setCss:function(csstext){
	 this.oP.style.cssText=csstext;
	 }
	 }
	
	 //调用代码
	 msgText.init("主题不存在或已被删除",3000)
	 </script>
	</body>

	

	//调用代码:
	//msgText.init(text,timer)
	//text：提示框显示文本,类型String
	//timer:提示框显示时间,不设置为永久显示 单位为毫秒ms

试试其它关键字

　提示框　　移动web　

同语言下

可能有用的

海霞贡献的其它代码(4)