如何建立动态访客计数器 - php

大家好,我喜欢在WooCommerce商店(WordPress)上使用假的动态访客计数器,我喜欢在购买按钮下方添加一个,这样的计数器就是:
如何建立动态访客计数器 - php

在此示例中,它有时会减少,有时会完全增加。

我希望该数字以200-5000黑白运行,因此它不会增加到5000以上,也不会减少到200以下,也不会立即从500-200下降,它应该缓慢而稳定地增加和减少。

php参考方案

使用一些JS可以实现这一目标。使用Math.random()方法,并使用setInterval()每n秒更改一次计数。

function random(min,max)
{
    return Math.floor(Math.random()*(max-min+1)+min);
}

var initial = random(500, 2000);
var count = initial;

setInterval(function() {
  var variation = random(-5,5);

  count += variation
  console.log('You currently have ' + count + ' visitors')

}, 2000)

您可以更改变化(在-5到5之间)以及时间间隔(在这里每2秒更改一次)。

如果您使用JS,请当心,您可以在源代码中看到代码。

编辑

这是嵌入在HTML中的代码,您可以更改interval(两次更新之间的毫秒数)和variation(计数可以变化±的多少)。您可能需要将interval更改为更高的值。

奖励:CSS的一些样式

#counter-area {
  padding: 2px;
  background-color: rgba(205, 204, 204, 0.19);
  border-radius: 2px;
  width: 300px;
  height: 30px;
  line-height: 30px;
  text-align: center;
}

#counter {
  color: white;
  background-color: red;
  padding: 4px 6px;
  border-radius: 5px;
}

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>

<body>
  <div id="counter-area">Real time <span id="counter"></span> visitors right now</div>
</body>

<script>
  function r(t,r){return Math.floor(Math.random()*(r-t+1)+t)}var interval=2e3,variation=5,c=r(500,2e3);$("#counter").text(c),setInterval(function(){var t=r(-variation,variation);c+=t,$("#counter").text(c)},interval);
</script>

</html>

使用Ajax呈现html表 - php

我想知道如何实现以下项目其实我有一个php代码,可以渲染一张桌子<table id = "oldata" class ="table table-bordered"> <thead> <tr class ="success"> <th class="…

提交表单后显示模式对话框 - php

提交下载文件后,我有一张表格。我要自动而不是自动下载文件..以显示模态对话框并显示下载链接。<form name="softwareform" id="softwareform" action="../downloadlink.php" method="POST" alig…

在联系表单7生成的html内添加html元素 - php

我们正在使用Contact Form 7插件,并希望在Contact Form 7生成的html代码中引入一个附加元素(斜体(i))。联系表格7短标签:[checkbox* areas_checkbox id:ftype_box class:checkbox use_label_element "Option1" "Option…

如何使用jquery获取文本字段的val? - php

码:<script> $(document).ready(function(){ $(".comments").keyup(function(){ id = this.id; comment = $("#com"+id).val(); alert(comment); }); }); </script&…

PHP stringID无法从回显中读入onclick - javascript

我有一个音频播放器,可以在HTML中正常工作,但是当我从PHP回显调用时,似乎没有得到div ID的名称,因此它无法播放我的音频。这是我的代码:// Show audio if ($sObj->get('audio') != null) { $sAudio = $sObj->get('audio'); $a…