弹出效果

最新推荐文章于 2022-03-02 16:46:10 发布
最新推荐文章于 2022-03-02 16:46:10 发布
阅读量308 收藏
点赞数
分类专栏： 互联网 文章标签： 音乐 filter function class border header

http://www.qwbm.com/new.asp?id=202

 

 

 <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>提示信息框</title>
<style type="text/css">
a{ color:#000; font-size:12px;text-decoration:none}
a:hover{ color:#900; text-decoration:underline}
body{background:;filter:progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#ffffff,endColorStr=#003366); overflow:hidden}
#massage_box{ position:absolute; left:expression((body.clientWidth-350)/2); top:expression((body.clientHeight-200)/2); width:350px; height:200px;filter:dropshadow(color=#666666,offx=3,offy=3,positive=2); z-index:2; visibility:hidden}
#mask{ position:absolute; top:0; left:0; width:expression(body.scrollWidth); height:expression(body.scrollHeight); background:#666; filter:ALPHA(opacity=60); z-index:1; visibility:hidden}
.massage{border:#036 solid; border-width:1 1 3 1; width:95%; height:95%; background:#fff; color:#036; font-size:12px; line-height:150%}
.header{background:#036; height:10%; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; padding:3 5 0 5; color:#fff}
</style>
<!--实现层移动-->
<script language="javascript">
var Obj=''
document.οnmοuseup=MUp
document.οnmοusemοve=MMove

function MDown(Object){
Obj=Object.id
document.all(Obj).setCapture()
pX=event.x-document.all(Obj).style.pixelLeft;
pY=event.y-document.all(Obj).style.pixelTop;
}

function MMove(){
if(Obj!=''){
  document.all(Obj).style.left=event.x-pX;
  document.all(Obj).style.top=event.y-pY;
  }
}

function MUp(){
if(Obj!=''){
  document.all(Obj).releaseCapture();
  Obj='';
  }
}
</script>
</head><body>
<div id="massage_box"><div class="massage">
<div class="header" οnmοusedοwn=MDown(massage_box)><div style="display:inline; width:150px; position:absolute">本站提示信息</div>
<span onClick="massage_box.style.visibility='hidden'; mask.style.visibility='hidden'" style="float:right; display:inline; cursor:hand">×</span></div>
<ul style="margin-right:25"><li>
本人申明此博客所有文章（包括文章插图）均为原创，如需引用或转载请注明出处。
</li><li>欢迎大家对博文中观点留言评述，谢绝无聊人士无素质无观点的灌水漫骂。</li><li>本站已设背景音乐，听音乐盒中收集的音乐时请先到页面底部关闭背景音乐。</li></ul></div></div>
<div id="mask"></div>
<span onClick="mask.style.visibility='visible';massage_box.style.visibility='visible'" style="cursor:hand"><a href="#">显示提示信息</a></span>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>bottom here
</body>
</html>本篇文章来源于深山行者个人网站 http://www.qwbm.com 原文出处：http://www.qwbm.com/new.asp?id=202

 

hisky1983
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
使用php ajax技术实现实时刷新数据库，如果条件满足则弹窗提醒
weixin_35756690的博客
12-30 517
使用 PHP 和 AJAX 实现实时刷新数据库并弹窗提醒，可以这么做： 使用 PHP 查询数据库，判断是否满足条件，并返回结果。 使用 AJAX 定时发送请求到 PHP 页面，询问数据库是否有新的数据。 当 PHP 页面返回结果时，在 AJAX 回调函数中判断返回的结果，如果满足条件则使用 JavaScript 弹出提醒窗口。 以下是一个简单的例子： <html> <h...
Ajax环境下弹出提示框
qq_43747119的博客
02-17 1624
Ajax环境下弹出提示框
tom邮箱的“随心邮”在微信并未即时通知的解决方案
一纸传说
04-18 1万+
1.进入“随心邮”微信公众号 2.点击对话框菜单的个人中心，选择邮箱设置 3.在邮箱设置的界面里选择“新邮件提醒”的选项中的“全部提醒” 4.这样设置之后即可即时在微信收发tom邮件 ...
ajax中弹出提示框
止水
08-22 7237
弹出提示框的几种基本方式： Response.Write("alert('成功！');window.location.href='task.aspx';"); Page.ClientScript.RegisterStartupScript(this.GetType(), "test", "alert('成功！');"); Page.RegisterStartupScript(
腾讯qq企业邮箱登录入口界面如何设置
qq_45192824的博客
10-26 1624
企业邮箱一般只有收费版支持设置登录入口界面，免费版是不支持的，而怎么将企业邮箱的登录入口界面设置为公司元素的呢，以TOM企业邮箱为例，登录管理员页面，在首页点击logo就可以进入到设置页面。跟随小编一起看一下如何设置吧 TOM企业邮箱登录入口界面 管理员登录企业邮箱后台，打开企业定制页 点击logo，可上传公司自己的logo 输入企业邮箱的登录网址，一般是“mail.公司域名”格式，选择好页面背景图保存 登录域名管理平台，添加CNAME域名解析 设置成功后，员工在网址栏输入“
bootstrap模态框弹出效果
06-24
本资源“bootstrap模态框弹出效果”提供了15种不同的模态框弹出动画，这将极大地丰富你的网站或应用的用户体验。以下是对这些模态框效果的详细解析： 1. **基本模态框**：这是最基础的模态框实现，通过点击按钮触发...
弹出效果实例
03-20
在IT行业中，用户体验是至关重要的一个环节，而“弹出效果”则是提升用户交互体验的一种常见技术手段。本文将深入探讨“弹出效果实例”，包括它的实现原理、常见应用场景以及如何利用HTML、CSS和JavaScript来创建...
jquery图片弹出效果
06-01
标题中的“jQuery图片弹出效果”指的是使用JavaScript库jQuery实现的一种常见的网页交互功能，即当用户点击某个元素（如文字或按钮）时，图片会以弹出框的形式展示出来，通常这种弹出框称为模态窗口或者 Lightbox ...
效果比较不错的jquery弹出效果
06-10
双12了，貌似今天也算是小购物节了吧。今天给大家推荐一款点击动画展示效果比较不错的jquery弹出窗口效果，仅一行html代码，方便使用。前提要先导入jquery库以及jquery.lightbox插件即可
jQuery DIV弹出效果实现代码
10-29
现在很多网站都流行这种弹出式的对话框或是信息显示框，很想将这个流行元素加入到自己的项目中。使用jQuery可以不费大力气实现这种效果。将其记录到我的Blog中，与业界朋友们起分享。
AJAX弹出提示信息效果
11-21
javascript js AJAX弹出提示信息效果
ajax 自动提示信息,自动提示使用AJAX
weixin_39883286的博客
08-05 213
我想实现自动提示文本box.I已经检查了其他职位似乎没有任何要工作我，我无论是在Web应用程序试图与website.Please在我的代码计算outthe错误英寸当我在文本框中键入字母时，什么都不会发生。我可以在浏览器中看到webservice结果。自动提示使用AJAXdelete.aspxInherits="WebApplication2.Delete" %>Assembly="AjaxC...
如何让网页界面变暗色
Devil
03-02 3022
Step 1： 点击界面右上角三点图标，选择设置，在左侧外观中选择深色，应用后： 此时界面进入暗色调，但是网页并没有进入暗色调 Step 2：确保Edge浏览器更新至版本 80.0.317.1后 ，在浏览器地址栏访问edge://flags/，登录后，输入Auto Dark Mode for Web Contents(如果找不到，就尝试输入Dark Mode)，点击Enabled。 Step 3：重启！完工！撒花！ ...
运用AJAX实现右下角弹出提示框 示例
无色叶子
08-20 298
JS文件内容 [code] //定义XMLHttp实例 var xmlHttp; function createXMLHttpRequest(){ //开始初始化XMLHttpRequest对象 if(window.ActiveXObject){ //IE浏览器 xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); }...
tomtom地图 android,TomTomGPS导航
weixin_36104594的博客
05-27 891
【注意】 该款游戏需要另83M数据包，下载链接在描述最后面。【注意】软件需联网并挂V`PN运行！软件开始需下载离线地图，请用户自行选择地图下载！《TomTomGPS导航 TomTom GPS Navigation Traffic》新的TomTom GO移动应用程序是最新的TomTom车载导航技术和世界一流的交通信息的组合。你永远可以选择基于该让你到你的目的地更快每天准确，实时的交通信息，最好的途径...
Ajax轮询消息自动提示（消息盒子）
热门推荐
旋转木马的IT小窝
04-02 2万+
<br />经过一下午写了个消息盒子的例子，用的是ajax方式轮询读取，没有用到后台自动“推”数据的方式，效果良好。<br /> <br /><br /> <br /> <br />前台的HTML代码：<br /><%@ Page Language="C#" AutoEventWireup="true" CodeBehind="mainTalk.aspx.cs" Inherits="wj_test.Talk.mainTalk" %> <!DOCTYPE html PUBLIC "-//W3C//DTD X
php ajax输入提示,ajax怎么实现提示输入信息的功能
weixin_42457435的博客
04-01 129
这次给大家带来ajax怎么实现提示输入信息的功能，ajax实现提示输入信息功能的注意事项有哪些，下面就是实战案例，一起来看一下。本文实例为大家分享了ajax实现输入提示效果的具体代码，供大家参考，具体内容如下网站主页Title*{margin:0px auto;padding:0px;}.l{height:50px;width:198px;border-bottom:1px solid black...
uniapp 动画弹出效果
最新发布
06-10
Uniapp 中可以使用 CSS3 动画和 JavaScript 实现弹出效果。 一种简单的实现方式是使用 CSS3 动画。例如： ```css .popup { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0; animation: popup 0.3s ease forwards; } @keyframes popup { from { transform: translate(-50%, -70%); opacity: 0; } to { transform: translate(-50%, -50%); opacity: 1; } } ``` 上述代码定义了一个名为 `popup` 的弹出框样式，使用 `animation` 属性指定了一个名为 `popup` 的动画效果。这个动画从弹出框的初始状态（位置在屏幕中央上方，透明度为 0）到最终状态（位置在屏幕中央，透明度为 1）的变化过程，持续时间为 0.3 秒，缓动函数为 ease。 另一种实现方式是使用 JavaScript，通过改变元素的样式属性来实现弹出效果。例如： ```js export default { data() { return { showPopup: false }; }, methods: { openPopup() { this.showPopup = true; setTimeout(() => { this.$refs.popup.style.transform = 'translate(-50%, -50%)'; this.$refs.popup.style.opacity = 1; }, 0); }, closePopup() { this.$refs.popup.style.transform = 'translate(-50%, -70%)'; this.$refs.popup.style.opacity = 0; setTimeout(() => { this.showPopup = false; }, 300); } } }; ``` 上述代码定义了一个名为 `showPopup` 的响应式数据，用于控制弹出框的显示和隐藏。`openPopup` 方法在显示弹出框时，先将 `showPopup` 设为 `true`，然后通过 `setTimeout` 延迟执行弹出动画，将 `transform` 和 `opacity` 样式属性从初始值变为最终值。`closePopup` 方法在隐藏弹出框时，直接将 `transform` 和 `opacity` 样式属性从最终值变为初始值，然后再将 `showPopup` 设为 `false`。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值