鼠标点击产生"富强""民主""文明"方法

2020-05-13 10:09:03

参考地址 JQuery 实现鼠标点击特效"富强""民主""文明"方法

最近逛好多博客发现都有一个鼠标点击弹窗的事件, 感觉非常棒

#就像这个样子的

 

百度了一下 发现还是实现还是比较简单的(当然我也不会),但是copy 是程序员最喜欢的事,所以我就转载这个文章,也当是自己的一个小笔记,贴上代码

# js 部分的代码

<script>//定义获取词语下标var a_idx = 0;jQuery(document).ready(function($) {//点击body时触发事件$("body").click(function(e) {//需要显示的词语var a = new Array("富强","民主", "文明", "和谐","自由", "平等", "公正","法治", "爱国", "敬业","诚信", "友善");//设置词语给span标签var $i = $("<span/>").text(a[a_idx]);//下标等于原来下标+1  余 词语总数a_idx = (a_idx + 1)% a.length;//获取鼠标指针的位置,分别相对于文档的左和右边缘。//获取x和y的指针坐标var x = e.pageX, y = e.pageY;//在鼠标的指针的位置给$i定义的span标签添加css样式$i.css({"z-index" : 999999,"top" : y - 20,"left" : x,"position" : "absolute","font-weight" : "bold","color" : "#ff6651"});//在body添加这个标签$("body").append($i);//animate() 方法执行 CSS 属性集的自定义动画。//该方法通过CSS样式将元素从一个状态改变为另一个状态。CSS属性值是逐渐改变的,这样就可以创建动画效果。//详情请看http://www.w3school.com.cn/jquery/effect_animate.asp$i.animate({//将原来的位置向上移动180"top" : y - 180,"opacity" : 0//1500动画的速度}, 1500, function() {//时间到了自动删除$i.remove();});});});</script>

#实际演示效果  点我查看效果


  • 2018-01-17 01:55:49

    Android设置控件不可点击

    学会安卓控件的不可点击,再加上控件的透明度,估计你会做出不错的效果来。

  • 2018-01-17 15:58:16

    java实现定时任务的三种方法

    在进行多线程编程中,比较重要也是比较困难的一个操作就是如何获取线程中的信息。大多数人会采取比较常见的一种方法就是将线程中要返回的结果存储在一个字段中,然后再提供一个获取方法将这个字段的内容返回给该方法的调用者。如以下的ReturnThreadInfo类:

  • 2018-01-18 11:26:53

    浅谈js运行机制(线程)

    从开始接触js时,我们便知道js是单线程的。单线程,异步,同步,互调,阻塞等。在实际写js的时候,我们都会用到ajax,不管是原生的实现,还是借助jQuery等工具库实现,我们都知道,ajax可以实现局部刷新,并且在请求处理时,任然可以响应用户的操作,比如点击事件。不是说js是单线程吗?这些都是怎么实现的? 在阅读《深入理解Bootrap的源码》一书,在分析轮播组件(carousel.js)的源码时,作者对一句代码操作的注释引起了我的兴趣。

  • 2018-01-18 17:41:05

    Fatal error: Class 'Memcached' not found

    从别地方复制来了新的配置文件,包了这样的错误,因为我也是刚刚安装了php7,以为是php的问题,于是就根据网上的提示,安装memcached.dll包。