`
小试牛刀
  • 浏览: 3400 次
  • 性别: Icon_minigender_1
  • 来自: 济南
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

自动消失的消息提示(Js+Div实现)

阅读更多
var closetime;
2
3function showmsg(msg,showtime)
4{
5    var md=document.getElementById("msgdiv");
6    md.innerHTML =" "+msg+" ";
7    md.visibility = "visible";
8    if(closetime)window.clearTimeout(closetime);
9    closetime=setTimeout(hiddenmsg,showtime*1000);   
10}
11
12function hiddenmsg()
13{
14    var md=document.getElementById("msgdiv");
15    md.innerHTML = "";
16    md.visibility = "hidden";
17}
分享到:
评论

相关推荐

    JS+css实现仿QQ空间信息提示框

    在实现信息提示框时,JavaScript可以用来控制提示框的显示与隐藏,以及添加动画效果,如淡入淡出、滑动等。通过DOM操作,我们可以动态地创建、修改或删除页面元素,以此实现提示框的生成和更新。 CSS则是用来美化...

    js提示框替代系统alert,自动关闭alert对话框的实现方法

    因此简单用div写了一个alert提示框,并自动关闭。 效果图 css样式 /*弹出消息对话框样式*/ .show_alert_box{ width:100%; height:100%; position:fixed; top:0px; left:0px; background-color:rgba(0,0,0,0.6); ...

    html5点击弹出自动关闭消息提示框

    通过设置一个时间延迟,消息框在一定时间后自动消失。 5. **DOM操作**:使用JavaScript操作DOM,例如添加、删除或修改DOM元素,是实现这个功能的必要步骤。通过`document.getElementById`、`document.createElement...

    js弹出div消息提示插件

    5. **延时关闭**:可以设置消息自动消失的时间,让用户有足够的时间阅读信息。 6. **回调函数**:在提示框出现和关闭时,提供回调函数,方便开发者进行额外的逻辑处理。 7. **定位选项**:可以根据需要设置弹出框...

    CSS+DIV 菜单控制

    通常,它会使用CSS创建一个绝对定位的元素,初始状态为隐藏,当需要显示时,通过CSS动画或JavaScript控制其出现和消失。还可以添加过渡效果,使提示框的显示更加自然。 5. **防止右键点击、禁止CTRL+A全选和复制**...

    js 实现div 遮蔽

    在网页开发中,"js 实现div 遮蔽" 是一种常见的用户界面设计技术,主要目的是在执行耗时操作时防止用户意外交互,提供更好的用户体验。这种技术通常用于加载数据、提交表单或者进行其他可能阻塞界面的长时间运行过程...

    jQuery javascript js html h5 屏幕 右下角弹窗 自动提醒

    "jQuery javascript js html h5 屏幕 右下角弹窗 自动提醒"这个主题涉及的技术点主要集中在如何使用jQuery库来创建一个在屏幕右下角自动弹出的消息提醒组件。下面将详细介绍这一知识点。 jQuery是一个广泛使用的...

    js 右下角弹出div 类似 QQ消息提示

    3. **消息队列管理**:如果需要在短时间内连续显示多个消息提示,可以通过实现消息队列来管理这些弹窗,避免同时显示过多弹窗造成界面混乱。 #### 五、总结 通过上述分析,我们了解到如何使用 JavaScript 和 ...

    jQuery可自动隐藏顶部消息提示框代码

    为了实现消息自动消失,开发者利用了JavaScript的`setTimeout()`函数。例如,当显示成功消息时,会设置一个1.5秒后的回调函数,该函数负责移除消息。失败消息则设置为2秒后消失,而加载消息则不自动消失,这可能需要...

    显示1秒消失的提示框

    这种提示框通常具有简洁的设计,会在短时间内自动消失,以免打扰用户的正常操作流程。在给定的【标题】和【描述】中,我们可以看出这个提示框有以下特点:用户可以设置提示框显示后的消失时间(n秒后消失),以及...

    原生js简易提示框 input 点击文字消失

    "原生js简易提示框 input 点击文字消失"这个主题涉及到如何使用JavaScript实现一个简单的提示框,并且当用户点击输入框(input)时,提示框的文字自动消失。以下是对这一知识点的详细说明: 首先,我们需要理解...

    JS实现定时自动关闭DIV层提示框的方法

    下面详细介绍了使用JavaScript实现定时自动关闭DIV层提示框的几种方法。 首先,我们来明确几个关键点:定时(Timing)、自动(Automatic)、关闭(Close)、DIV层(Div Layer)、提示框(Prompt Box)。这些关键词...

    js jquery 非阻塞式 消息提示框

    // 提示框3秒后自动消失 }); }); ``` 在这个例子中,我们创建了一个id为`custom-alert`的div作为提示框,并设置了相应的样式。当用户点击“显示提示”按钮时,jQuery会将消息插入到提示框中,并使其渐显。...

    div+css 弹出层

    实现div+css弹出层的关键在于以下几点: 1. **隐藏与显示**:默认情况下,弹出层应该是隐藏的。我们可以使用CSS的`display`属性来控制这一点,将其设置为`none`即可隐藏。当用户触发某个事件(如点击按钮)时,再...

    js两种右下角短消息提示

    这样,调用`showMessage('你的消息')`就能在右下角显示一条5秒后自动消失的消息。 ### 第二种方法:使用JavaScript库或框架 现代Web开发中,许多库和框架如jQuery、Vue.js、React等提供了更高级的动画和组件功能,...

    简单原生js文字向上滚动消息框代码

    这个"简单原生js文字向上滚动消息框代码"提供了一种实现方式,它不依赖于任何JavaScript库如jQuery,而是完全基于原生JavaScript编写,这使得它在性能和加载速度上具有优势。 首先,`index.html`是网页的主文件,它...

    div点击事件弹出层并逐渐消失

    在网页设计中,"div点击事件弹出层并逐渐消失"是一种常见的用户交互设计,它通常用于提供操作反馈或信息提示。这个功能结合了JavaScript(通常通过jQuery库实现)、CSS和HTML的div元素来完成。下面我们将详细探讨...

    css3可定时关闭的消息提示框插件

    本插件主要利用了CSS3的动画和过渡效果来实现消息提示框的显示与消失过程。 ### 进度条实现 消息提示框上的时间进度条是通过CSS3的`linear-gradient`和`animation`属性实现的。`linear-gradient`可以创建从一个...

    js实现页面加载完毕之前loading提示效果

    这样,当页面的DOM结构完全加载完成后,“loading”提示就会自动消失,用户将看到完整的页面内容。这种方法简单有效,能够很好地提升用户体验,尤其是在处理大量数据或者复杂的网页交互时。 总结来说,通过在HTML中...

    javascript 仿QQ空间消息提示

    7. **关闭机制**:用户应能关闭消息提示,这可能通过点击提示框、按钮或者设定自动消失时间来实现。这涉及到定时器(`setTimeout`或`setInterval`)和事件触发。 8. **可复用性**:好的代码设计应该确保MessageBox...

Global site tag (gtag.js) - Google Analytics