html界面显示Toast

骑猪看日落 2022-06-08 08:09 312阅读 0赞

仿android显示toast

<!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>Toast</title>
    
    </head>
    
    <body>
        <button onclick="clickme();">clickMeShowToast</button>  
    </body>
    <script> function showToast(msg,duration){ duration=isNaN(duration)?3000:duration; var m = document.createElement('div'); m.innerHTML = msg; m.style.cssText="width:60%; min-width:180px; background:#000; opacity:0.6; height:auto;min-height: 30px; color:#fff; line-height:30px; text-align:center; border-radius:4px; position:fixed; top:60%; left:20%; z-index:999999;"; document.body.appendChild(m); setTimeout(function() { var d = 0.5; m.style.webkitTransition = '-webkit-transform ' + d + 's ease-in, opacity ' + d + 's ease-in'; m.style.opacity = '0'; setTimeout(function() { document.body.removeChild(m) }, d * 1000); }, duration); } function clickme(){ showToast("恭喜您！请求数据成功！请求数据成功！",3000); } </script>   
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，312人围观）

还没有评论，来说两句吧...

相关阅读

相关 Android基础#7: Toast工具类的实现，以及设置Toast文字居中显示

内容简介： Android App开发过程中，Toast默认的显示方式是在屏幕的底部，但是，有时候，感觉文字显示在屏幕中间比较美观。本篇实现的功能是：让Toast文字可以

今天药忘吃喽~/ 2023年10月16日 21:57/ 0 赞/ 20 阅读

相关 toast显示图片

toast显示图片 > //是图片直接显示 > if (isImageFile(fileName)) { > Toast toast = To

朱雀/ 2023年01月09日 12:38/ 0 赞/ 199 阅读

相关 Android自定制Toast显示外观

Android自定制Toast显示外观 Android原生的Toast只是提供一个简单的文本显示消息。有些单调乏味。不过，Android Toast本身也充分提供了对

ゝ一纸荒年。/ 2022年08月09日 12:48/ 0 赞/ 226 阅读

相关 Toast 显示文本，图片，及图文

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" x

淡淡的烟草味﹌/ 2022年08月04日 14:36/ 0 赞/ 167 阅读

相关 Android Toast显示异常的问题

在使用Toast中，遇到以下问题： ![Center][] 字体飘到上面去了，搜了半天终于发现了原因 http://blog.csdn.net/ityan

阳光穿透心脏的1/2处/ 2022年06月09日 07:18/ 0 赞/ 252 阅读

相关 Toast重复显示工具类

开发中经常会遇到toast多次弹出的问题。这个工具类会避免这种情况发生。 import android.content.Context; import and

「爱情、让人受尽委屈。」/ 2022年06月09日 03:21/ 0 赞/ 186 阅读

相关 html界面显示Toast

仿android显示toast <!DOCTYPE html> <html> <head> <meta charset="utf-8"

骑猪看日落/ 2022年06月08日 08:09/ 0 赞/ 313 阅读

相关安卓——Toast动态显示信息

![Image 1][] ![Image 1][] ![Image 1][] ![Image 1][] ![Image 1][] ![Imag

Bertha 。/ 2022年05月29日 06:28/ 0 赞/ 258 阅读

相关 Toast显示文字、图片、文字+图片

1、显示文字： Toast.makeText(this, "文字显示", Toast.LENGTH_LONG).show(); 2、显示图片： Toast

素颜马尾好姑娘i/ 2022年05月29日 03:22/ 0 赞/ 309 阅读

相关 html、jsp等界面显示当前时间方法

html、jsp等界面显示当前时间方法显示结果： ![这里写图片描述][70] 实现代码： <html> <head>

我不是女神ヾ/ 2022年05月19日 02:20/ 0 赞/ 293 阅读