给博客添加两个有意思的特效

2017-10-0116:41:54 111 17,097

一、添加鼠标点击特效

添加鼠标点击特效,("富强", "民主", "文明", "和谐", "自由", "平等", "公正" ,"法治", "爱国", "敬业", "诚信", "友善")等。

  1. <script type="text/javascript">
  2. /* 鼠标点击特效 */
  3. var a_idx = 0;
  4. jQuery(document).ready(function($) {
  5.     $("body").click(function(e) {
  6. var a = new Array("富强""民主""文明""和谐""自由""平等""公正" ,"法治""爱国""敬业""诚信""友善");
  7. var $i = $("<span/>").text(a[a_idx]);
  8.         a_idx = (a_idx + 1) % a.length;
  9. var x = e.pageX,
  10.         y = e.pageY;
  11.         $i.css({
  12. "z-index": 999999999999999999999999999999999999999999999999999999999999999999999,
  13. "top": y - 20,
  14. "left": x,
  15. "position""absolute",
  16. "font-weight""bold",
  17. "color""#ff6651"
  18.         });
  19.         $("body").append($i);
  20.         $i.animate({
  21. "top": y - 180,
  22. "opacity": 0
  23.         },
  24.         1500,
  25. function() {
  26.             $i.remove();
  27.         });
  28.     });
  29. });
  30. </script>

效果如图:

给博客添加两个有意思的特效

 

二、添加评论框输入特效:

添加以下代码到主题尾部调用即可

  1. <script src="activate-power-mode.js"></script>
  2. <script>
  3. POWERMODE.colorful = true// 控制开启/开启礼花特效  
  4. POWERMODE.shake = false// 控制开启/关闭屏幕震动特效  
  5. document.body.addEventListener('input', POWERMODE);
  6. </script>

在输入框打字时跟随光标弹出烟花很是炫酷(还可以开启屏幕震动哦!)

true 为开启

false 为关闭

 

效果如图:

给博客添加两个有意思的特效

activate-power-mode.js代码太长就不贴出来了

附activate-power-mode.js文件下载:

 

三、主要注意事项:

  1. 鼠标点击特效的代码添加到主题页脚文件或者js里面
  2. 评论框输入特效请自己填写你的activate-power-mode.js文件路径。
  1. <script src="activate-power-mode.js"></script>

 

weinxin
老D博客 微信公众号
请大佬们关注订阅老D博客微信公众号, 扫一扫关注,从此不迷路。 不定时放出邀请码、福利、推送更新等...
老D

发表评论

您必须才能发表评论!

目前评论:111   其中:访客  98   博主  13

    • avatar Anwenyu 0

      第一个特效 提示jQuery未定义

      • avatar GODxi 2

        点击出现字的为什么用不了

          • avatar 老D Admin

            @GODxi 已经停用了,有的童鞋用的是笔记本 比较耗CPU

          • avatar hugh_hang 3

            那个鼠标点击跳字的特效,实现每次的字颜色不一样吗?

            • avatar hhyu 4

              能不能搞一个开关???

              • avatar shrimp 0

                和idea power插件一一样的效果,NICE

                • avatar 306341577 0

                  试试看我有没有头像

                    • avatar 老D Admin

                      @306341577 没有,(已经有了,需要我手动同步,这个一般半个月同步一次)

                    • avatar jooone 0

                      感觉好爽啊!!!啊啊啊啊感觉快高潮了呢

                      • avatar ExclusiveBeacon 0

                        犀利

                        • avatar whyyyyyy 1

                          js代码都给出来,良心啊。。

                          • avatar 熏鱼 1

                            说真的苹果打字真的好卡,坐标:自带浏览器。卡成ppt

                              • avatar 老D Admin

                                @熏鱼 不应该呀,虽然我没用过Mac Safari 但是苹果一直走在前沿的

                                  • avatar 熏鱼 1

                                    @老D 还没试过其他浏览器!不知道是不是内核的原因!?

                                      • avatar LEOLI 1

                                        @熏鱼 这个是chrome的回复,很顺畅,不知道为什么自带的会那么卡

                                  • avatar amor 1

                                    i3处理器能hold住,贼酷炫了哈哈哈哈哈

                                    • avatar owensun 2

                                      老D 牛!

                                      • avatar 秋日暖阳 0

                                        关注laod很久了,学习到很多。永远支持laod,感谢laod!

                                        • avatar New Divide 2

                                          这个有点酷炫啊,66666666

                                          • avatar hanlin 0

                                            这个blog的主题是开源的吗?希望博主告知

                                            • avatar 洛记包子铺 1

                                              真他么帅,打字好爽~!! :neutral:

                                              • avatar 小白c 1

                                                这也太秀了吧

                                                • avatar yanshui177 0

                                                  真好 啊啊啊 啊啊啊啊啊啊,从此爱上了打字,哈哈哈哈哈

                                                  • avatar 大树先生 2

                                                    牛逼了!666送给老D~~~

                                                    • avatar 岳龙 0

                                                      这么帅,太酷了。。

                                                      • avatar XXG 1

                                                        果然是很炫丽。 可惜我没有注册码。

                                                        • avatar G 1

                                                          卡的不要不要的……

                                                            • avatar 老D Admin

                                                              @G 是不是笔记本配置低的原因?

                                                                • avatar G 1

                                                                  @老D 戴尔塔式服务器主机。。。可能是我把chrome的GPU加速都关了的事,chrome有闪屏bug

                                                              • avatar hedan 1

                                                                加了这个特效,卡的要死!整个页面都在不停飘移!使用体验太差了!要么我拍一段视频你看看!操作系统:Mac OS10.13 浏览器Chrome 61

                                                                • avatar lllllep 1

                                                                  炫酷!忍不住想要评论~~~

                                                                  • avatar laoA 1

                                                                    这个要怎么全局使用呢,怎么用在其他地方呢,比如说写字板啦,word里啦?

                                                                    • avatar owen 0

                                                                      点击放烟花更好玩

                                                                      • avatar pugss 1

                                                                        冒泡的颜色还是不错的,但是抖动的确实看到有点眼花…

                                                                        • avatar 夜落叶 1

                                                                          感觉老给力了

                                                                          • avatar skg 1

                                                                            貌似可以在ide里玩玩这个,冒气泡蛮好玩的,酷炫啊!老D

                                                                            • avatar fang 2

                                                                              好玩

                                                                              • avatar echol 0

                                                                                很酷炫,真的很棒!!!赞一个!!!!

                                                                                • avatar 大猫 0

                                                                                  很厉害的样子,支持老D

                                                                                  • avatar lllllep 1

                                                                                    确实很炫酷!!!!!!!
                                                                                    评论起来跟玩游戏一样!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! :mrgreen:

                                                                                    • avatar nineday 1

                                                                                      确实很炫酷啊,但是打字感觉有点卡,不知道是不是我电脑配置的问题

                                                                                      • avatar Zy143L 0

                                                                                        这个抖动动画 看起来有点臃肿啊 而且并不是很流畅….

                                                                                        • avatar long609689209 1

                                                                                          不行啊,感觉好卡,这特效太猛了

                                                                                          • avatar Moyanren 2

                                                                                            这很强势

                                                                                            • avatar sdopa 1

                                                                                              学习了!

                                                                                              • avatar 小波 0

                                                                                                哈哈,确实是非常的酷炫,但是看久了总觉得有点杀马特QWQ

                                                                                                • avatar 快乐网讯 0

                                                                                                  文章不错支持一下吧

                                                                                                  • avatar 252 2

                                                                                                    出来了谢谢老D

                                                                                                    • avatar 如何践行社会主义核心价值观 0

                                                                                                      特效好厉害