js 通知

最新推荐文章于 2025-02-19 14:58:57 发布
转载 最新推荐文章于 2025-02-19 14:58:57 发布 · 4k 阅读 · 0

博客提供了一个使用JavaScript实现滚动信息效果的代码示例，包含JavaScript、CSS和HTML代码。通过设置滚动速度、容器和内容对象，实现信息在屏幕上滚动显示，还可通过鼠标悬停暂停滚动。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

转自 : https://huhanlin-2008-163-com.iteye.com/blog/772506

  1. <script type="text/javascript" language="Javascript">  
  2. var scrlSpeed=1  
  3. // decreasing speed for mozilla  
  4. scrlSpeed=(document.all)? scrlSpeed : Math.max(1, scrlSpeed-1)  
  5. function initScroll(container,object){  
  6.     if (document.getElementById(container) != null){  
  7.         var contObj=document.getElementById(container);  
  8.         var obj=document.getElementById(object);  
  9.         contObj.style.visibility = "visible";  
  10.         contObj.scrlSpeed = scrlSpeed;  
  11.         widthContainer = contObj.offsetWidth;  
  12.         obj.style.left=parseInt(widthContainer)+"px";  
  13.         widthObject=obj.offsetWidth;  
  14.         interval=setInterval("objScroll('"+ container +"','"+ object +"',"+ widthContainer +")",20);  
  15.         contObj.onmouseover = function(){  
  16.             contObj.scrlSpeed=0;  
  17.         }  
  18.         contObj.onmouseout = function(){  
  19.             contObj.scrlSpeed=scrlSpeed;  
  20.         }   
  21.     }  
  22. }  
  23.   
  24. function objScroll(container,object,widthContainer){  
  25.     var contObj=document.getElementById(container);  
  26.     var obj=document.getElementById(object);  
  27.     widthObject=obj.offsetWidth;  
  28.     if (parseInt(obj.style.left)>(widthObject*(-1))){  
  29.         obj.style.left=parseInt(obj.style.left)-contObj.scrlSpeed+"px";  
  30.     } else {  
  31.         obj.style.left=parseInt(widthContainer)+"px";  
  32.     }  
  33. }  
  34.   
  35.    
  36.   
  37. // on page load we initiate scrolling  
  38. window.onload=function(){   
  39.     initScroll("scrlContainer", "scrlContent");  
  40. }  
  41.   
  42. </script>  



2.css 

Java代码 

 收藏代码

  1. <style type="text/css">  
  2. body{  
  3.     margin:0;  
  4.     padding:0;  
  5.     background:#fff;  
  6.     font: 70% Arial, Helvetica, sans-serif;  
  7. }  
  8. #scrlContainer{  
  9.     visibility:hidden;  
  10.     background:#f1f1f1;  
  11.     position:relative;  
  12.     overflow:hidden;  
  13.     width:250px;  
  14.     height:20px;  
  15.     line-height:20px;  
  16.     margin:1em;  
  17. }  
  18.   
  19. #scrlContent{  
  20.     position:absolute;  
  21.     left:0;  
  22.     top:0;  
  23.     white-space:nowrap;  
  24. }  
  25. </style>  



3.html 

Java代码 

 收藏代码

  1. <html>   
  2. <body>  
  3. <div id="scrlContainer">  
  4.     <div id="scrlContent">Some very, very useful information will  
  5. appear here, yet it will move around your screen so it will be hard to  
  6. read it. But the client wants it, so here it is. </div>  
  7. </div>                
  8. </body>  
  9. </html>   
使用JavaScript实现网页通知功能
2303_76218115的博客
06-03 1477
如果用户同意接收通知，创建并显示一个通知。通知的标题为"重 要 通 知"，内容为"在意网盘，不限内容的网盘 pan.zai1.com"。如果不支持，输出一条消息并停止执行。即使在用户浏览其他页面时，也能向他们推送通知信息。如果用户点击通知，会打开"https://pan.zai1.com"这个网址。如果用户没有同意接收通知，弹出一个提示对话框，并输出一条消息。5500000毫秒（约为91分钟）后，通知自动关闭。创建通知后，输出 “hook 200”。废话不多说直接上代码。请求用户的通知权限。
js消息提示插件，一个轻量级的弹出提示通知插件
01-09
SmallPop 一个轻量级的弹出提示通知插件没有依赖关系，使用这个JavaScript插件轻松创建通知。
js 调用浏览器 Notification
weixin_42136785的博客
09-06 1280
const notification = window.Notification || window.mozNotification || window.webkitNotification if (notification) { // 可以通过使用箭头函数变更this指向 notification.requestPermission(result => { console.log(result) // granted（允许） || denied（拒绝） .
js系统通知
adc_god的博客
06-04 633
if(undefined !== window.Notification) { if (Notification.permission === "default") { Notification.requestPermission(); } } Notification.requestPermission(function() { if(Notification.permission === 'granted') { // 用户点击了允许
js Notification 通知
【03】的博客
05-15 3777
notification MDN文档 https://developer.mozilla.org/zh-CN/docs/Web/API/notification 实现一个通知 // 浏览器支持且用户没有禁止浏览器通知的情况下执行 if(window.Notification && Notification.permission !== "denied") { Notification.requestPermission(function(status) { var n
使用JavaScript实现浏览器通知
lostdeer
06-25 1349
随着现代Web应用的普及，浏览器通知成为了与用户进行及时交互的重要方式。本文将介绍如何使用JavaScript来实现浏览器通知功能。
Javascript通知
02-12
JavaScript通知是Web开发中一种与用户交互的重要方式，它允许网站在浏览器后台或者即使窗口未激活的情况下，向用户展示信息。这种功能通过Notifications API实现，其中的核心是`Notification`接口。Notifications ...
nestjs-notifications:NestJs通知包-受Laravel Notifications启发
03-30
NestJs通知 NestJs Notifications是一种受Laravel Notifications启发的灵活的多渠道通知服务： : 此模块旨在通过各种传递渠道发送简短的信息性消息，这些信息将用户在您的应用程序中发生的事情通知用户。 例如，...
airbrake-js:Airbrake JavaScript通知程序
03-05
**Airbrake-JS: 官方JavaScript通知程序** Airbrake-JS 是一个专为JavaScript开发设计的错误监控工具的客户端库，它允许开发者在Web应用中集成Airbrake服务，以便实时捕获、报告并跟踪应用程序中的错误。这个库支持...
pushjs一个小巧的跨浏览器的JavaScript通知API的解决方案
08-08
"pushjs一个小巧的跨浏览器的JavaScript通知API的解决方案" 指的是 Push.js 这个库，它是一个轻量级的工具，用于在各种浏览器上实现JavaScript的通知功能。Push.js旨在提供一种统一的API，使得开发者能够方便地在...
javascript 实现 Notification 消息通知框
03-24
使用javascript 封装实现 Notification 消息通知框
js 公告功能
05-18
小小公告小功能 商业用途 适合大众网站使用
js实现通知弹屏 Notification
cxz
08-19 2445
样式 实现代码 let notification; // 可能的值包括：denied (用户拒绝了通知的显示), granted (用户允许了通知的显示), 或 default (因为不知道用户的选择，所以浏览器的行为与 denied 时相同). if (window.Notification && Notification.permission === 'granted') { notification = new Notification('您有一条新的来电', { dir: '
js通知提醒
最新发布
u014708123的博客
02-19 629
JS通知总结下来有4种方法，分别是声音提醒、通知提醒、标题变化、icon变化;比较常见的是标题变化和icon变化;
关于js的消息提醒
aini593612180的博客
06-30 792
tip.js$(function(){ var $body=$('body').eq(0); var htmlText='<div style="display: none; position: fixed; top: 35%; left: 50%; padding: 10px 20px; background: rgba(0, 0, 0, 0.75); color: #FFFFFF
高级编程JavaScript。js实现 Notifications 浏览器消息通知
蓝斑.json的博客
01-15 2687
Notifications 用户授权显示通知是通过浏览器内部的一个对话框完成的。向用户请求通知权限。这个对象有一个 requestPemission() 方法，该方法返回一个期约，用户在授权对话框上执行操作后这个期约会解决。"granted"值意味着用户明确授权了显示通知的权限。JavaScript API 触发页面外部的浏览器行为，而且都允许页面处理用户与对话框或通知弹层的交 互。Progressive Web Application） 通过触发通知可以在页面不活跃时向用户显示消息，看起来就像原生应用。
JS Notifications消息通知
github_37125043的博客
05-24 1632
Notifications API 的通知接口用于向用户配置和显示桌面通知。 let notification = new Notification(title, options) MDN链接 参数： title 一定会被显示的通知标题 options 可选 一个被允许用来设置通知的对象。它包含以下属性： dir : 文字的方向；它的值可以是 auto（自动）, ltr（从左到右）, or r...
js发送浏览器通知
m0_45419636的博客
10-10 423
js发送浏览器通知。
Auto.js通知栏
qq_43974059的博客
09-14 3885
本教程分为三个部分：发送通知（自定义图片），通知栏下载进度显示，通知栏nodejs版。实现效果如下图。
Push.js：实现跨浏览器JavaScript通知的新方案
Push.js是一个小巧的JavaScript库，它的主要功能是提供一个简单的跨浏览器解决方案，用于发送桌面通知。在现代的Web应用开发中，向用户推送消息通知是一种常见需求，例如，可以用来通知用户新的电子邮件、聊天信息或...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值