qq html消息,类似于QQ新消息提醒-前端
css :
@charset "utf-8";
/* reset */
body{font:12px/18px "宋体",arial,sans-serif;color:#585858;}
body,div,p,span,form,iframe,table,td,th,input,textarea,button,label,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6{margin:0;padding:0;}
h1,h2,h3,h4,h5,h6{font-size:100%; }
ul,ol,li,dl{list-style-type:none;}
em,i,dfn,cite,strong,small{font-style:normal;}
img{border:0;}
fieldset,button,input,select,option{vertical-align:middle;font:12px/18px "宋体",arial,sans-serif;}
table{border-collapse:collapse;border-spacing:0}
textarea{resize:none}
/* color */
a:link,a:visited{color:#575757;text-decoration:none;}
a:hover{color:#ef4165;text-decoration:none;}
a:active{color:#1d7400;}
/* clearfix */
.clearfix{ *zoom:1;}
.clearfix:after{ display:table; line-height:0; content:""; clear:both;}
/* public.omission */
.fl{ float:left;} .fr{ float:right;} .tc{ text-align:center;} .tr{ text-align:right;}
.fb{ font-weight:bold;} .f12{ font-size:12px;} h3{ font-weight:normal;} .listop{ padding-top:15px;}
.mr10{ margin-right:10px;} .mr15{ margin-right:15px;} .mL10{ margin-left:10px;} .mL15{ margin-left:15px;}
.mt10{ margin-top:10px;} .mt15{ margin-top:15px;} .mb10{ margin-bottom:10px;} .mb15{ margin-bottom:15px;}
/* weiduduan */
.weiduduan{ width:550px; margin:15px auto 0 auto;}
.tipfloat,.tipfloat .close{background:url(../images/tipright.png) no-repeat;}
.tipfloat{display:none;z-index:999;position:fixed;_position:absolute;right:0px;bottom:0;width:236px;height:196px;overflow:hidden;}
.tipfloat .tiphead{height:28px;line-height:28px;overflow:hidden;padding:0 5px;}
.tipfloat .tiphead strong{float:left;color:#fff;font-size:14px;}
.tipfloat .tiphead .close{display:block;float:right;margin:5px 0 0 0;width:18px;height:18px;line-height:999em;overflow:hidden;cursor:pointer;background-position:-236px 0;}
/* ranklist */
.ranklist{border:solid 1px #ddd;padding:10px 10px 0 10px;}
.ranklist li{height:16px;line-height:16px;overflow:hidden;position:relative;padding:0 70px 0 30px;margin:0 0 10px 0;vertical-align:bottom;}
.ranklist li em{background:url(../images/mun.gif) no-repeat;width:20px;height:16px;overflow:hidden;display:block;position:absolute;left:0;top:0;text-align:center;font-style:normal;color:#333;}
.ranklist li em{background-position:0 -16px;}
.ranklist li.top em{background-position:0 0;color:#fff;}
.ranklist li .num{position:absolute;right:0;top:0;color:#999;}
/* 维度端前端网整理 http://www.weiduduan.com */
html:
jquery制作右下角弹窗QQ信息特效
$(function(){
var titHeight=$(".tiphead").height();
$(".tipfloat").animate({height:"show"},400);
$(".close").click(function(){
$(".tipfloat").animate({height:titHeight-50},1000,function(){
$(".tipfloat").hide();
});
});
});
新消息关闭
01
你觉得她美吗?
恩。
image:(命名需要一样)
tipright.png
mun.gif
qq html消息,类似于QQ新消息提醒-前端相关推荐
- win11任务栏图标闪烁|任务栏QQ图标闪动|新消息任务栏自动弹出|设置自动隐藏任务栏之后,QQ或微信等工具新消息自动弹出任务栏并颜色提示问题解决方案
背景介绍: 今天正常使用电脑时也出现消息弹出问题(已经设置隐藏任务栏),很头疼那么时什么情况,该如何组去解决呢?(微信任务栏闪动未读消息) MyDockFinder Windows 桌面美化工具 ...
- 类似微信的新消息提醒及滚动到未读消息位置功能
效果图 数字角标 新消息提醒按钮 收到第一条新消息,则记录之前滚动条位置 如果当前在消息界面 且滚动到最下方,有新消息则直接添加并滚动到最下方 没有滚动到底部,有新消息在最下方提醒,点击后展示未读部分 ...
- uniapp聊天室动画加载新消息
这段时间一直在利用uniapp做聊天室的功能,这里分享下发送新消息,接收新消息怎么像QQ那样滚动加载. 首先我是查了一下网上的朋友,看了下大多都是使用scroll-top实现的,所以我也试了一下这个东 ...
- 微信小程序聊天界面进入自动滚动到底部,翻看历史聊天记录,收到的新消息不会马上置底,如收到新消息出现 底部有更多消息字样
重点看标红部分,其他代码只是写的上下逻辑,可忽略 wxml: <view style="position: relative;width: 100%;height: 100%;&quo ...
- 编写Java程序,使用 Socket类模拟用户加入 QQ 群时,QQ 小冰发送欢迎消息的场景(用户充当客户端,QQ 小冰充当服务端)
查看本章节 查看作业目录 需求说明: 小冰是微软公司研发的人工智能机器人,被腾讯公司加入 QQ 群后,立即受到千万网友的喜爱.现在使用 Socket类模拟用户加入 QQ 群时,QQ 小冰发送欢迎消息的 ...
- qq撤回消息还在服务器上面吗,QQ怎么查看对方撤回的消息?
其实QQ查看的设置方法和微信是一致的,教授这里也简单讲一下. Step1: 同样进入QQ[设置]-[消息通知],开启[新消息通知],同时必须打开[通知显示消息内容]. Step 2: 这一步和上面微信 ...
- Win11系统如何设置任务栏新消息提醒
用户在使用电脑的时候任务栏总会提醒用户一些待办事项.天气等等,但是有些win11用户跟小编反应自己升级系统后就没有收到过任务栏的消息.这是因为我们没有开启此功能所有无法接收到通知,下面我们就可以来看看 ...
- QQ给附近的人群发消息,需要验证的自动申请为好友 按键精灵源码
QQ给附近的人群发消息,需要验证的自动申请为好友 按键精灵源码 先打开QQ查找界面 -找人 While trueHwnd = Plugin.Window.Find(0, "查找") ...
- qq和微信收不到新邮件提醒
以前没在意,最近笔试面试的都收不到邮件,hr打电话才看到. 原因是之前下载了qq邮箱app. 解决方法:安卓有效:打开QQ邮箱,设置–新邮件提醒–点你的账号,关掉"仅在QQ邮箱客户端提醒&q ...
最新文章
- 深入浅出Java垃圾回收机制
- 序列化和反序列化uint64_t数据
- linux驱动程序是什么,简述一个Linux驱动程序的主要流程与功能
- Nuc972使用NandFlash时,uboot所需要的改动
- 算法的时间复杂度[ZT]
- kafka结合mysql_logstash集成kafka,mysql实现数据采集
- maven 编译命令
- java基础_day02
- 80. 删除排序数组中的重复项 II
- async/await实现同步
- ModbusTCP协议
- linux vim golang 插件,golang vim 插件设置
- Unity Shader学习-单张纹理
- Win10怎么进Bios Win10系统进入BIOS界面的方法图文详解
- Minimum supported Gradle version is 5.4.1. Current version is 4.10.1. If using the gradle wrapper
- 一眼就能看懂的Android自学手册,深度好文
- 保姆级的Linux教学
- 网页中的th/th是什么意思
- wpf 窗口最大化,最小化,关闭,拖动,双击放大缩小窗口基本事件
- Java后台拦截淘宝口令并解析淘口令里面特殊字符的正则
热门文章
- 深度优先搜索之图的表示方法
- 分治之快速排序以及快速排序为何最快
- Vue-router学习(一)- 路由匹配
- Fluent Ribbon项目出现“命名空间“clr-namespace:Fluent;assembly=Fluent”中不存在“RibbonWindow”名称”的解决方法...
- 面向过程与面向对象 程序设计
- SilverLight中的数据绑定
- postgreSQL源码分析——索引的建立与使用——Hash索引(1)
- python matlabplot写字_Matlab中plot基本用法的具体使用
- python全栈和java全栈_全栈和python的区别
- android json.out,Android 之 json数据的解析(jsonReader)