编程 Javascript

Tips 带三角可关闭的文字提示

Posted in Javascript onOctober 06, 2010

<title>Tips，带三角可关闭的文字提示</title>
<style type="text/css"> body{ font-size:12px;} .lj-tipsWrap,.lj-in,.lj-close{display:inline-block;} .lj-tipsWrap{background:#F4FBFF;line-height:1.5em;padding:5px 15px;border:1px solid #2192D3;position:absolute;text-align:left;} .lj-in{position:absolute;zoom:1;border:10px dashed transparent;width:0px;height:0px;} .lj-in span{zoom:1;width:0px;height:0px;overflow:hidden;} .lj-close{position:absolute; text-decoration:none;color:#000;font-size:14px; height:9px; width:9px; overflow:hidden;line-height:0.5em; right:0; top:0;} .lj-close:hover{color:#39F;} .lj-top{border-top:10px solid #2192D3;bottom:-20px; left:3px;} .lj-top span{border-top:10px solid #F4FBFF;margin:-11px 0 0 -10px;} .lj-right{border-right:10px solid #2192D3;left:-20px; top:3px;} .lj-right span{border-right:10px solid #F4FBFF;margin:-10px 0 0 -9px;} .lj-bottom{border-bottom:10px solid #2192D3;top:-20px; left:3px;} .lj-bottom span{border-bottom:10px solid #F4FBFF;margin:-9px 0 0 -10px;} .lj-left{border-left:10px solid #2192D3;right:-20px; top:3px; } .lj-left span{border-left:10px solid #F4FBFF;margin:-10px 0 0 -11px;} .lj-left ~ .lj-close{left:0;} /*css 3 渐进增强*/ .lj-tipsWrap{-webkit-border-radius:3px;-moz-border-radius:3px;-webkit-box-shadow:2px 2px 3px #eee;-moz-box-shadow:2px 2px 3px #eee;} </style>

Tips 带三角可关闭的文字提示

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

30个经典的jQuery代码开发技巧

Dec 15 Javascript

原生js实现日期联动

Jan 12 Javascript

node.js操作mysql(增删改查)

Jul 24 Javascript

深入浅析JavaScript中prototype和proto的关系

Nov 15 Javascript

JS实现图片延迟加载并淡入淡出效果的简单方法

Aug 25 Javascript

angular2倒计时组件使用详解

Jan 12 Javascript

AugularJS从入门到实践(必看篇)

Jul 10 Javascript

原生JS实现的轮播图功能详解

Aug 06 Javascript

JavaScript设计模式之装饰者模式实例详解

Jan 17 Javascript

layui+jquery支持IE8的表格分页方法

Sep 28 jQuery

环形加载进度条封装（Vue插件版和原生js版）

Dec 04 Javascript

Vue 实现拨打电话操作

Nov 16 Javascript

从零开始学习jQuery (二) 万能的选择器

Oct 01 #Javascript

fancybox1.3.1 基于Jquery的插件在IE中图片显示问题

Oct 01 #Javascript

客户端使用XML DOM加载json数据的方法

Sep 28 #Javascript

jquery选择器(常用选择器说明)

Sep 28 #Javascript

Jquey拖拽控件Draggable使用方法(asp.net环境)

Sep 28 #Javascript

基于Jquery的仿Windows Aero弹出窗(漂亮的关闭按钮)

Sep 28 #Javascript

jquery控制listbox中项的移动并排序的实现代码

Sep 28 #Javascript

You might like

解决File size limit exceeded 错误的方法

2013/06/14 PHP

解析PHP汉字转换拼音的类

2013/06/18 PHP

PHP写的资源下载防盗链类分享

2014/05/12 PHP

PHP中file_exists()判断中文文件名无效的解决方法

2014/11/12 PHP

php使用preg_match()函数验证ip地址的方法

2017/01/07 PHP

JavaScript获取网页表单提交方式的方法

2015/04/02 Javascript

12种JavaScript常用的MVC框架比较分析

2015/11/16 Javascript

基于jQuery实现点击弹出层实例代码

2016/01/01 Javascript

javascript编写简易计算器

2017/05/06 Javascript

AjaxUpLoad.js实现文件上传

2018/03/05 Javascript

详解性能更优越的小程序图片懒加载方式

2018/07/18 Javascript

ant-design-vue 快速避坑指南(推荐)

2020/01/21 Javascript

taro 实现购物车逻辑的实例代码

2020/06/05 Javascript

在pycharm上mongodb配置及可视化设置方法

2018/11/30 Python

python实现定时发送qq消息

2019/01/18 Python

Python3.5文件修改操作实例分析

2019/05/01 Python

Python实现Mysql数据统计及numpy统计函数

2019/07/15 Python

python ftplib模块使用代码实例

2019/12/31 Python

Python3如何使用多线程升程序运行速度

2020/08/11 Python

整理HTML5中表单的常用属性及新属性

2016/02/19 HTML / CSS

加拿大最大的五金、家居装修和园艺产品商店：RONA

2017/01/27 全球购物

小米俄罗斯授权商店：Xiaomi俄罗斯

2019/12/08 全球购物

Java 中访问数据库的步骤？Statement 和PreparedStatement 之间的区别？

2012/06/05 面试题

Java模拟试题

2014/11/10 面试题

个人找工作的自我评价

2013/10/17 职场文书

开朗女孩的自我评价

2014/02/10 职场文书

施工员岗位职责

2014/03/16 职场文书

双语教学实施方案

2014/03/23 职场文书

餐厅筹备计划书

2014/04/25 职场文书

学生会竞选演讲稿纪检部

2014/08/25 职场文书

贫困生助学金感谢信

2015/01/21 职场文书

小学母亲节活动总结

2015/02/10 职场文书

应届毕业生求职简历自我评价

2015/03/02 职场文书

员工自我工作评价

2015/03/06 职场文书

邮政营业员岗位职责

2015/04/14 职场文书

MySQL基于索引的压力测试的实现

2021/11/07 MySQL