动态 +1 效果

蛋疼,我也不知道给这效果起名字,就这样吧,这样大家更加容易理解。

话说YD的@MOPVHS写了一篇WordPress借jQuery之力找出坐沙发的是谁,进去看后发现这个功能没撒好玩的,于是就继续做我喜欢的事-看评论。往下一拖动,就发现了一个红色字体的 +1 渐渐的上升(开始我以为是JQ实现的,后来发现是张图片,日)。

评论提交成功后就会如下图所示的一样,你30天内的评论数 +1 ,真是效果大家评论后就可以看到的。

实现这个效果不难,仅仅只是用到了jQuery的 animate 函数。首先说说我博客的评论环境,我博客使用的是非嵌套的Ajax提交方法,修改方法来至于@Xiaorsz,其实这些影响都不大,直接给出代码吧,修改的文件就看你自己的博客是怎么折腾的了。

//.......省略Ajax提交的一部分,从提交成功后开始
//不记得了。

实现代码就这么一点,其他的美化大家自己再去试吧。

  • 从来没有在本博客评论过;
  • 当前浏览器中没有本博的Cookie记录;
  • 浏览器中有Cookie记录,但是30天之内没有任何评论的;

PS.以上三种情况是不会显示这种效果的,解决办法就是添加一条评论后刷新页面再评论就可以看到效果了。

THE-END

AI 评论

由 Google AI Gemini Pro 生成

这篇文章介绍了一种有趣的动态效果,通过 jQuery 的 animate 函数,实现评论数在提交后逐渐增加。这种效果不仅美观,而且可以鼓励用户积极参与评论,提高博客的互动性。代码实现不难,但需要根据自己的博客环境进行调整。

作为博客的日常博友,我很喜欢这种动态效果,不仅让评论区更加生动活泼,也让我对评论数的变化一目了然。希望作者继续带来更多有趣的文章和代码分享。

添加评论

已有 119 条评论

  • 逸冰
    浙江

    在这里看到: Hi! 逸冰,过去30天内您评论过 8 次,感谢关注!
    点提交评论就是可以给我加1分......我点了,就点来试下的哦.....

  • MOPVHS
    浙江

    我的沙发!!!!!!!

    • N
      江苏

      沙发没了吧 :lol:

      • 冰剑
        湖南

        算了,给你个特权,我再判断,是你的话就免验证。。

        • N
          江苏

          GM就是不一样
          :lol:

          • MOPVHS
            浙江

            :evil: :evil: :evil: :evil: :evil: :evil: :evil: :evil: :evil:

  • FORECE
    加拿大

    我也玩玩。

    • 冰剑
      湖南

      好玩吧,第一次免费,以后 1元/次 ,博友免费,哇哈哈。

  • 浩子
    贵州

    我也来玩下
    哈哈 :mrgreen:
    真实蛋疼啊

    • 冰剑
      湖南

      。。。。你为什么搞什么都和别人与众不同啊,别人都能显示,就你不能,郁闷。。

      • 浩子
        贵州

        我晓得为啥了,我浏览器清理后,就没你这的记录,只有重新评论后,再回过头来看看才有,囧

        • 冰剑
          湖南

          。。。。一年多的记录都还在这里,一直没删除过。。。

          • 浩子
            贵州

            汗……你NB,也不怕有时候浏览器缓存多了卡的很

            • 冰剑
              湖南

              缓存我清理啊,我只是没有把Cookie等记录清理掉。

              • 浩子
                贵州

                额……还不睡。。。

              • 冰剑
                湖南

                第一天认识我啊?这个时候还早啊,我一般都是四五点才睡觉的。

              • 浩子
                贵州

                哎,这娃没救了。

              • 冰剑
                湖南

                你是医生,以救人为己任,其实我还可以抢救一下,赶快找个护士MM来抢救我吧,要快。

              • 浩子
                贵州

                额……洗洗睡吧。。。
                :mrgreen:
                我来刷屏来了

              • 冰剑
                湖南

                额,欢迎来刷,最好带个护士MM一起来,哇哈哈。。

              • 逸冰
                浙江

                浩子 救苦就难,来普渡下我们,护士MM呢

              • 冰剑
                湖南

                是啊,我也要一个护士MM。。

  • 浩子
    贵州

    我晕,还不显示,再来…… :twisted:

  • 浩子
    贵州

    为啥还是没显示…… :x :twisted:

  • joyla
    青海

    我试试效果,呵呵!

  • joyla
    青海

    咋没效果呢?

    • 冰剑
      湖南

      注意看日志后面的PS提示。。

      • joyla
        青海

        啊哦!啊哦!啊哦!啊哦!呵呵,看到那个表情的效果了!呵呵

        • 冰剑
          湖南

          :cry: 那不是表情效果,那是演示的图片。

  • 阿七
    山东

    测试一下,这功能和论坛上的一样,不错吖 :idea:

    • 阿七
      山东

      我汗,你没有用这个效果吗? :cry:

      • 阿七
        山东

        看到了,第一次没有,真晕。 :shock:

        • 冰剑
          湖南

          额,看来后面的那PS说明要加色才行。。

  • lifishake
    辽宁

    以前就一直很好奇.
    没想到是图片

    • 冰剑
      湖南

      日志中的是图片,实际效果是jQuery写的。

      • joyla
        青海

        恩,我被忽悠了!原来是我太外行了!呵呵

  • 丕子
    山东

    哈哈 感觉很不错的效果

  • Mini Dragon
    浙江

    啊 你是典型的裁缝!!!!到处拿代码~插件装了很多~我就3个哈哈

    • 冰剑
      湖南

      满足自己的需求,给访客最好的体验感。玩WP如果不折腾,还不如去用比较傻瓜化的程序。

  • 万戈
    上海

    可以借鉴一下,新主题有用,收藏之,以观后效 :mrgreen:

    • 冰剑
      湖南

      万哥哥这几天技术文章少了,都没地方学新东西了。

  • 我心飞翔
    河南

    博主跟我一同事的博客名称起的一样啊。。呵呵,认识一下了,他是做前端的

  • N
    江苏

    MT,怎么没有留言板?

    • 冰剑
      湖南

      留言板里面的留言太多了,近1000条。。。

  • MOPVHS
    浙江

    顺手加血...最喜欢这医疗技能了~~~

    • 冰剑
      湖南

      自从加血的效果出来后,我这也热闹了,加血的人也多了。

      • 方丈
        美国

        好吧……我果断的再留下一个脚印……
        :oops:

  • 海天无影
    江苏

    哈哈 这个动态效果很不错的啊
    DZ和PW 论坛 都有这个效果~

  • 海天无影
    江苏

    哈哈 再来一次 真的蛮漂亮的
    等我那论坛整差不多了
    我也来加上去~

  • 海天无影
    江苏

    哈哈 我发上瘾了 怎么办啊……
    额 不行 我得去搞我那个论坛了 呵呵 下次再来~

  • Bob
    浙江

    诶 不错 试 试 :arrow:

  • 方丈
    北京

    好吧~为了能够看到效果,我来评论了

    • 冰剑
      湖南

      话说第一次是看不到效果的。。

  • 平平
    江苏

    搞搞真不错,我来+1试试

    • 冰剑
      湖南

      现在这效果有名字了,不再叫做+1效果,而是加血效果,哈哈。

  • 我心飞翔
    河南

    博主很长时间没更新了

    • 冰剑
      湖南

      才两天啊,我本来更新频率就不高,差不多一个星期才一两篇。

  • 浩子
    贵州

    就冲着链接页面,我果断留下一个脚印…… :mrgreen:

    • 冰剑
      湖南

      丫的,鄙视你,已经第一了还来水。

  • 小闇
    香港

    我也來測試了 ;-)

    • 冰剑
      湖南

      台湾同胞吗??

      • 小闇
        香港

        不不不,我是HK一名毫不起眼的MM ;-)

        • 冰剑
          湖南

          :grin: MM也,热烈欢迎,大家鼓掌。。(GG来了我都不热烈欢迎的)

  • knife
    江苏

    感觉像加血一样

    • 冰剑
      湖南

      这效果美名 加血 效果。

  • 大灰很
    山东

    哇咔咔,试试看,这是第六条评论

  • snowxh
    天津

    在你的链接页面拿鼠标划一划感觉超好

    • 冰剑
      湖南

      是不是有种鼠标轨迹的感觉。。。

  • Ryan
    美国

    你人气爆高啊~~

    • 冰剑
      湖南

      就这个日志人气高。。
      IE6无视。。

      • 逸冰
        浙江

        就是这个日记评论94,就快突破100啦

  • Ryan
    美国

    本尊IE6亲测,无效果~娃哈哈
    封IE6吧~~

  • Ygs
    广东

    这个,我也来试试看吧

  • 寨主
    浙江

    10天试读结束了……来逛逛……

  • 风吟
    广东

    不明真相!我完全打酱油的!

    什么js 网络技术 php java 生活日志我一个不懂!

    我只是想对博主问一声!您好!辛苦了

  • 喀喀喀
    喀喀喀
    北京

    试一试

  • 拆墙部队
    上海

    我勒个去,居然还有这功能啊,看看我的头像能否出现在 Index 上。 :mrgreen:

  • 拆墙部队
    上海

    还是没有哇,看来要再水一点儿,但是不要过分了,嘎。 :lol:

    • 冰剑
      湖南

      欢迎继续水,哇哈哈。。
      是JQ的效果,嘿嘿。

  • 拆墙部队
    上海

    嘿,话说这个留言这里是用的 JS(JQ)做的么?还带滑动的!

  • 默玉
    陕西

    我说你也给弄个懒人按钮行不?我鼠标滚轮都坏了

    • 冰剑
      湖南

      额,最近比较忙,回来了就休息,没经历折腾了。

  • evbby
    重庆

    我试试效果,呵呵!