jquery 点击页面流畅弹出预定文字
js代码:
<script src="https://cdn.bootcss.com/jquery/2.2.1/jquery.min.js"></script>
<script type="text/javascript">
var a_idx = 0;
$(document).ready(function ($) {
$("body").click(function (e) {
var a = new Array("富强", "民主", "文明", "和谐", "自由", "平等", "公正", "法治", "爱国", "敬业", "诚信", "友善");
var $i = $("<span/>").text(a[a_idx]);
a_idx = (a_idx + 1) % a.length;
var x = e.pageX,
y = e.pageY;
$i.css({
"z-index": 999999999999999999999999999999999999999999999999999999999999999999999,
"top": y - 20,
"left": x,
"position": "absolute",
"font-weight": "bold",
"color": "#ff6651"
});
$("body").append($i);
$i.animate({
"top": y - 180,
"opacity": 0
}, 1500, function () {
$i.remove();
});
});
});
</script>
jquery 点击页面流畅弹出预定文字的更多相关文章
- 基于jQuery点击圆形边框弹出图片信息
分享一款基于jQuery点击圆形边框弹出图片信息.这是一款鼠标经过图片转换成圆形边框,点击可弹出文字信息.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div id=&q ...
- Jquery 点击图片在弹出层显示大图
http://blog.csdn.net/wongwaidah/article/details/28432427(案例链接出处,本人只是转载收藏) <html> <head> ...
- [转]Jquery 点击图片在弹出层显示大图
这个还行不需要别的包! https://www.cnblogs.com/antis/p/7053991.html
- js在关闭页面前弹出确认提示【转载】
最近项目中出现个bug,就是导出数据后,会提示确认导航,其实实际需求并不需要这个提示,可能是之前遗留的问题.查了下资料是在触发了onbeforeunload事件,那么剩下的就是代码组织问题了. 众所周 ...
- Outlook 2013 在邮件里面点击超链接时弹出“组织策略阻止我们为您完成此操作”
现象描叙: 在Outlook在邮件里面点击超链接时,打不开超链接页面,弹出如下提示: 这个是因为之前安装了其它浏览器(例如,我安装了360的浏览器),并且设置为了默认浏览器,后来卸载了该浏览器 ...
- 第一个微信小程序(实现点击一个按钮弹出toast)
今天根据网上的教程搭建了微信小程序的环境,然后看文档做了一个简单的小应用. 项目的目录是这个样子的: app.js.app.json.app.wxss是全局文件,必不可少的文件.定义在app.wxss ...
- 移动端点击输入框,弹出键盘,底部被顶起问题(vue)
这个问题相信做移动端开发的童鞋会有深刻体会,以前用jq开发时就很头疼这个问题,每次底部footer部分需要用position:fixed,如果页面内容不是很长,没有超出屏幕范围,那就还好,没有问题:一 ...
- 【Vue | ElementUI】Vue离开当前页面时弹出确认框实现
Vue离开当前页面时弹出确认框实现 1. 实现目的 在某种业务场景下,用户不允许跳转到其他页面.于是,需要在用户误操作或者是点击浏览器跳转时提示用户. 2. 实现原理 使用路由守卫beforeRout ...
- (Vue)移动端点击输入框,弹出键盘,底部被顶起问题
(Vue)移动端点击输入框,弹出键盘,底部被顶起问题:https://www.jianshu.com/p/210fbc846544 问题描述:Vue开发中,当我们相对于父视图的底部布局子控件时,需要用 ...
随机推荐
- phpstorm 配置 webpack @ 别名跳转
webstorm中专门有webpack的相关配置,默认的路径直接是项目根目录下的 webpack.config.js,但是我们用各种cli生成的项目中,webpack的配置一般都是在build下,导致 ...
- Java基础-类加载机制与自定义类Java类加载器(ClassLoader)
Java基础-类加载机制与自定义类Java类加载器(ClassLoader) 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 关于类加载器的概念和分类我就不再废话了,因为我在之前的笔 ...
- Java基础-Java中的堆内存和离堆内存机制
Java基础-Java中的堆内存和离堆内存机制 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任.
- JMS之——ActiveMQ时抛出的错误Could not connect to broker URL-使用线程池解决高并发连接
转载请注明出处:http://blog.csdn.net/l1028386804/article/details/69046395 解决使用activemq时抛出的异常:javax.j ms.JMSE ...
- elementUI 表格分页后台排序记录
表格代码 <div class="m-table"> <el-table :data="logs" style="width: 10 ...
- 20155203 2016-2017-3 《Java程序设计》第5周学习总结
20155203 2016-2017-3 <Java程序设计>第5周学习总结 教材学习内容总结 课堂知识总结 封装是继承的基础,继承是多态的基础.多态是用父类声明对象的引用,用子类生成对象 ...
- Codeforces 237 div2 B. Marathon(关于精度损失的教训)
题目链接:http://codeforces.com/contest/404/problem/B?csrf_token=6292hf3e1h4g5e0d16a996ge6bgcg7g2 解题报告:一个 ...
- MAC系统下Sublime Text3 配置Python3详细教程
MAC系统下Sublime Text3 配置Python3详细教程(亲测有效) https://blog.csdn.net/weixin_41768008/article/details/798590 ...
- env-update干了些什么
http://www.linuxsir.org/bbs/thread339077-2.html乐哥的话-关于env-update http://www.gentoo.org/doc/zh_cn/han ...
- webstorm2017添加vue模板