• jquery toast


    <!doctype html>
    <html data-n-head-ssr>
      <head>
        <title>爱游人</title><meta data-n-head="ssr" charset="utf-8"><meta data-n-head="ssr" data-hid="description" name="description" content="My ace Nuxt.js project"><meta data-n-head="ssr" data-hid="keywords" name="keywords" content="计算机软硬件、工艺品(不含象牙及其制品)的销售;计算机软硬件、工艺品(不含象牙及其制品)技术开发、技术推广、技术咨询、技术服务、技术转让;经营电子商务;从事广告业务。(以上不含限制项目)旅游产品代理销售。"><link data-n-head="ssr" rel="icon" type="image/x-icon" href="/favicon.ico">
    	</head>
    	<style>
    	#toast{
        position: fixed;
        top: 50px;left:50%;transform: translateX(-50%);
        min- 80px;
        max- 180px;
        min-height: 18px;
        padding: 15px;
        line-height: 18px;
        text-align: center;
        font-size: 16px;
        border-radius: 5px;
        display: none;
        z-index: 999;
    }
    .toast_error {
    	background:#FEF0F0;
    	border:1px solid #FDE2E2;
    	color: #F56C6C;
    }
    .toast_info {
    	background:#EDF2FC;
    	border:1px solid #EBEEF5;
    	color: #909399;
    }
    .toast_success {
    	background:#F0F9EB;
    	border:1px solid #E1F3D8;
    	color: #67C23A;
    }
    .toast_warning {
    	background:#FDF6EC;
    	border:1px solid #FAECD8;
    	color: #E6A23C;
    }
    
    	</style>
      <body>
    
    		<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>
    <script>
    			/* toast 提示 
    				 $("#toast").showMessage('网络错误,请稍后重试',1400);
    			*/
    			$.fn.extend({
    						showMessage: function( $msg, $type, $time ){
    								var oDiv = document.createElement("div");
    								oDiv.setAttribute("id", "toast");
    								oDiv.setAttribute("class", 'toast_' + $type || 'toast_' + 'info');
    								var oBody = document.getElementsByTagName('body')[0];
    								oBody.append(oDiv);
    								$('#toast').text( $msg );
    								$('#toast').fadeIn();
    								setTimeout(function() {
    										$('#toast').fadeOut();
    								}, $time);
    						}
    			});
    			$.fn.showMessage('asdfsd', 'error', 50000)
    			$.fn.showMessage('asdfsd', 'warning', 50000)
    		
    
    </script>
      </body>
    </html>
    

      

  • 相关阅读:
    快速搭建一个本地的FTP服务器
    Node.js安装及环境配置之Windows篇
    在win10上安装oracle10g
    win10安装oracle11g客户端
    解决:Java source1.6不支持diamond运算符,请使用source 7或更高版本以启用diamond运算符
    idea 右侧 无 meven 菜单
    idea导入maven项目不能识别pom.xml文件解决办法
    PostgresSQL客户端pgAdmin4使用
    PostgreSQL 创建数据库
    PostgreSQL 数据类型
  • 原文地址:https://www.cnblogs.com/qq364735538/p/12973815.html
Copyright © 2020-2023  润新知