#toast{
position: fixed;
top: 44%;left:50%;transform: translateX(-50%);
min-width: 80px;
max-width: 180px;
min-height: 18px;
padding: 10px;
line-height: 18px;
text-align: center;
font-size: 16px;
color: #fff;
background: rgba(0, 0, 0, 0.6);
border-radius: 5px;
display: none;
z-index: 999;
} /* toast 提示
$("#toast").showMessage('网络错误,请稍后重试',1400);
*/
$.fn.extend({
showMessage: function( $msg, $time ){
var oDiv = document.createElement("div");
oDiv.setAttribute("id", "toast");
var oBody = document.getElementsByTagName('body')[0];
oBody.append(oDiv);
$('#toast').text( $msg );
$('#toast').fadeIn();
setTimeout(function() {
$('#toast').fadeOut();
}, $time);
}
});

jQuery toast 淡入淡出提示的更多相关文章

  1. 利用jQuery的淡入淡出实现轮播器

    基本原理:将所有图片绝对定位在同一位置,透明度设为0,然后通过jQuery的淡入淡出实现图片的切换效果: 但我在使用fadeIn淡入时却无效果,最后只能使用fadeTo实现,求大神指教 HTML: & ...

  2. jQuery实现淡入淡出二级下拉导航菜单的方法

    本文实例讲述了jQuery实现淡入淡出二级下拉导航菜单的方法.分享给大家供大家参考.具体如下: 这是一款基于jQuery实现的导航菜单,淡入淡出二级的菜单导航,很经常见到的效果,这里使用的是jquer ...

  3. 利用jquery的淡入淡出函数(fadeIn和fadeOut)--实现轮播

    首先说下,我在网上找的例子全是用的UL 实现,其实大可不必,只要是能包含img标签的HTML标签都可以做轮播效果.利用jquery的淡入淡出函数(fadeIn和fadeOut).废话也不多说,边上代码 ...

  4. JQuery效果-淡入淡出、滑动、动画

    一.JQuery Fading方法 JQuery 有四种fade方法 1.fadeIn() 淡入                       对应也有$(selector).fadeIn(speed, ...

  5. jQuery 效果 - 淡入淡出

    通过 jQuery,您可以实现元素的淡入淡出效果. 点击展示 淡入/淡出 面板 实例 jQuery fadeIn()演示 jQuery fadeIn() 方法. jQuery fadeOut()演示 ...

  6. jQuery 效果 – 淡入淡出

    在在jQuery中可以通过四个方法来实现元素的淡入淡出,这四个方法分别是:fadeIn().fadeOut().fadeToggle() 以及 fadeTo(),本文通过实例来为你讲解如何在jQuer ...

  7. 松软科技课堂:jQuery 效果 - 淡入淡出

    jQuery Fading 方法 通过 jQuery,您可以实现元素的淡入淡出效果. jQuery 拥有下面四种 fade 方法: fadeIn() fadeOut() fadeToggle() fa ...

  8. jquery实现淡入淡出

    fade方法包括四个: (1)fadeIn(speed,callback):淡入的方法,speed代表淡入的速度,可以是slow,fast,毫秒,不填等 例如: $(document).ready(f ...

  9. 11.jQuery之淡入淡出效果

    知识点:fadeIn   fadeOut  fadeToggle  fadeTo <style> div { width: 150px; height: 300px; background ...

随机推荐

  1. springboot备份mysql后发送邮件并删除备份文件,支持win和Linux

    首先加入springboot的邮箱依赖 <!--邮箱依赖--> <!-- https://mvnrepository.com/artifact/org.springframework ...

  2. 2019暑期北航培训—预培训作业-IDE的安装与初步使用(Visual Studio版)

    这个作业属于那个课程 2019北航软件工程暑期师资培训 这个作业要求在哪里 预培训-IDE的安装与初步使用(Visual Studio版) 我在这个课程的目标是 提高自身实际项目实践能力,掌握帮助学生 ...

  3. English Learning -- 0611--When Burnout Is a Sign You Should Leave Your Job

    I like the following article from Harvard Business Review, as I ever experienced burnout at work. Ve ...

  4. [转帖]Apache Kylin 概述

    Apache Kylin 概述 https://www.cnblogs.com/xiaodf/p/11671095.html 1 Kylin是什么 今天,随着移动互联网.物联网.AI等技术的快速兴起, ...

  5. linux服务器安装jdk (手动解压方式安装)

    linux服务器安装jdk 使用的是通过手动解压安装的方式,没有通过yum或者apt-get命令安装 准备: 下载一个jdk,版本自选,后缀为(.tar.gz) 开始 创建目录 mkdir /usr/ ...

  6. Python10之列表1(创建列表和列表添加元素的方法)

    一.创建列表 列表名 = [’元素一‘,’元素二‘,’元素三‘,’元素四‘] 列表中的元素可以是任何类型,甚至可以是一个列表. list1 = ['詹姆斯','戴维斯','保罗乔治','字母哥',in ...

  7. Windows Subsystem for Linux(wsl)使用

    由于项目有一些环境需要在linux环境运行.可用微软win10的WSL来搭配使用 安装wsl 控制面板--程序和功能--启用或关闭windows功能,适用于linux的windows系统 应用商城下载 ...

  8. leetcode动态规划笔记三---单序列型

    单序列型DP 相比一维DP,这种类型状态转移与过去每个阶段的状态都有关. Longest Increasing Subsequence : 求最大最小值 Perfect Squares : 求某个规模 ...

  9. 创建 Python Virtualenv 虚拟隔离环境

    video:创建 Python Virtualenv 虚拟隔离环境 python 虚拟环境 venv 简单用法 - littlemore - 博客园 创建 Python Virtualenv 虚拟隔离 ...

  10. AS3.0 位图翻转、旋转

    /* * * *-------------------------* * | *** 位图翻转.旋转 *** | * *-------------------------* * * 作 者:fengz ...