鼠标移动显示和隐藏评论者运营商等信息 —— WordPress美化教程

2017年8月25日14:36:14 38 3,245

之前大发云官网刚刚发布了添加评论者操作系统、浏览器和运营商信息——WordPress美化教程,但是在逛某些博客时发现,那个评论者操作系统、运营商等信息默认是隐藏,鼠标移上去显示,移开隐藏,感觉特别好玩,特分享教程供大家参考。

 

鼠标移动显示和隐藏评论者运营商等信息 —— WordPress美化教程

 

方法一:(对应添加教程的方法一)

将下面配套样式文件添加到主题样式文件style.css最后,或者主题选项→定制风格→自定义样式中:

此处为隐藏的内容!
发表评论并刷新,方可查看

 

效果可以留言查看。

 

鼠标移动显示和隐藏评论者运营商等信息 —— WordPress美化教程

 

注:添加样式后鼠标悬停在留言上才会显示留言者相关信息,小屏手机上不显示,因为留言者所在区域信息内容较长,不好看,而且可能会造成错位。

 

方法二:(对应添加教程里的方法二)

如需鼠标经过时显示或隐藏以上UA信息和IP地址,则在对应主题footer.php中添加代码:

  1. <script>
  2.     jQuery(function(){
  3.         $(".comment-body").hover(function(){
  4.             $(this).find(".ua-info").toggle();
  5.         },function(){
  6.             $(this).find(".ua-info").toggle();
  7.         });
  8.     });
  9. </script>

 

如果显示和隐藏效果相反,则在在对应主题style.css文件内或自定义CSS处,加以下css代码调整

  1. .ua-info {
  2.  display:none;/*设置隐藏*/
  3.   margin-left:8px;
  4. }

 

 

若文章图片、下载链接等信息出错,请在评论区留言反馈,博主将第一时间更新!如果喜欢,请打赏支持本站,谢谢大家!
  • 我的QQ
  • QQ扫一扫
  • weinxin
  • 我的微信公众号
  • 微信扫一扫
  • weinxin

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

目前评论:38   其中:访客  36   博主  2

    • sssda sssda 1 来自天朝的朋友 广东省潮州市 联通

      不错学习了

      • 的士速递测试 的士速递测试 2 来自天朝的朋友 重庆市 移动

        厉害了厉害了

        • 谢谢分享 谢谢分享 2 来自天朝的朋友 中国 移动

          谢谢分享

          • wzq wzq 2 来自天朝的朋友 江西省赣州市 联通

            看看

            • qq qq 0 来自天朝的朋友 江西省赣州市 联通

              • ks ks 0 来自天朝的朋友 江西省赣州市 联通

                • 小媳妇 小媳妇 2 来自天朝的朋友 中国 移动

                  媳妇媳妇

                  • 小熊资源网 小熊资源网 0 来自天朝的朋友 广东省广州市 电信

                    兄嘚

                    • 双双对对爸爸 双双对对爸爸 1 来自天朝的朋友 浙江省宁波市 电信

                      真心不错啊!

                      • 23 23 2 谷歌浏览器 Windows 10 美国 CloudFlare公司CDN节点

                        不错

                        • 21312 21312 2 来自天朝的朋友 谷歌浏览器 Windows 7 江苏省苏州市 电信

                          试试

                          • 吊儿啷当 吊儿啷当 1 来自天朝的朋友 谷歌浏览器 Windows 7 江苏省苏州市 电信

                            哈哈

                            • 我来了 我来了 2 来自天朝的朋友 谷歌浏览器 Windows 7 江苏省苏州市 电信

                              我来了

                              • 学习了 学习了 0 来自天朝的朋友 谷歌浏览器 Windows 7 江苏省苏州市 电信

                                学习了

                                • xichengwan xichengwan 4 来自天朝的朋友 火狐浏览器 Windows 10 河南省郑州市 联通

                                  不错学习了