在线人数统计和动态图片教程

资源共享 · 2024-11-24 09:59

第一波检查顺利完成,现在终于能歇口气了。趁着有空,和大家分享两个实用的技术小妙招。想知道怎么在自己的博客上显示有多少人在线吗?还有,怎么让网页上的动态图片随机播放?学会这两个小技巧,你的网页设计也会更出彩、更有趣哦。

风平浪静

前天小雪,按理说正式入冬了吧。但那天的天气却出奇的好,太阳高高挂,空气中带着一丝暖意,说冷不冷,还暖呼呼的,让人几乎忘记了冬日的严寒。

从这个月的月初开始,真的很忙,忙的昏天黑地的。工作上的事情堆积如山,让人应接不暇。好在终于告一段落了,第一波坚持顺利完成。

接下来,我们准备迎接第二波检查,听彪哥(我们老大)说第二波检查会在12月份过来,也就是下个月的样子。索性该补的资料和需要检查的记录都已经完成了99%,所以我是不着急的。

在第一波检查未到来之前,就听说公司高管也要过来开会,顺道检查一番。因此,这段时间公司和厂部也是前所未有的整洁,大概也是为了公司高管们的突击检查做好预备工作吧。所以这段时间,大家都在忙碌中保持着警惕,确保一切井然有序。

第一波检查过后,似乎一切又恢复了些许平静。趁此机会,也可以好好缓两天。虽然我知道,说不定看似平静的风浪,后面是更大的暴风雨也说不准,但至少现在,一切都显得那么正常,也便是一切安好吧。

一段简单的代码,实现"在线人数"

之前看到别人的博客底部都有一个"在线人数"的功能,对于初来乍到的我来说,很实用、也很酷。我想着要是可以在我的博客中也弄一个,那就酷毙了。结果……

去Typecho官网和Joe主题相关的插件库找了好多有关的插件,大多都是没用(或者叫你付费的),像我这样一穷二白的人,让我付费(根本就不可能, 主要还是因为穷啊 )。接着我又去百度、Gitee、Github、CSDN找……总之,不是操作流程太复杂就是让你付费!

算了,还是自己慢慢捣鼓吧。皇天不负有心人,终于还是让我给弄出来了(虽然方法很简陋、很低端),但对于我来说,功能已经足够使用了。

效果展示

刘郎阁

以最原始的方法,实现最简单的事!

具体操作

方法1

1.新建文件

在网站根目录(www、public_html、html、public、web、httpdocs、htdocs…)下创建一个 online.log 文件(用于记录、更新网站实时访问者的ip地址)

2.复制代码

复制下面代码到你的主题目录的footer.php文件中,路径:你的域名/usr/themes/Joe-master/public ,位置大概在网站运行天数的附近(看你自己放哪里)

<?php
$timeout = 60; // 超时时间(单位:秒)
$online_log = "online.log"; // 在线人数记录文件路径
$temp = array();
$entries = "";
$fp = fopen($online_log, "r");
if ($fp) {
    while (!feof($fp)) {
        $entry = fgets($fp);
        $entry = trim($entry);
        if (!empty($entry)) {
            $entry = explode(",", $entry);
            if (($entry[0] != getenv('REMOTE_ADDR')) && ($entry[1] > time())) {
                array_push($temp, $entry[0] . "," . $entry[1]);
            }
        }
    }
    fclose($fp);
} else {
    echo "无法打开在线人数记录文件";
    exit;
}
array_push($temp, getenv('REMOTE_ADDR') . "," . (time() + $timeout));
$maplers = count($temp);
$entries = implode("\n", $temp);
$fp = fopen($online_log, "w");
if ($fp) {
    flock($fp, LOCK_EX);
    fputs($fp, $entries);
    flock($fp, LOCK_UN);
    fclose($fp);
} else {
    echo "无法写入在线人数记录文件";
    exit;
}
echo "在线人数:" . $maplers . "人";
?>

3.回到你的网站,刷新即可!

方法2

1.复制代码

复制下面的代码,粘贴到footer.php的顶部位置(路径:根目录/usr/themes/Joe-master/public/footer.php)

<?php
    //首先你要有读写文件的权限,首次访问不显示,正常情况刷新即可
    $online_log = "slzxrs.dat"; //保存人数的文件到根目录,
    $timeout = 30;//30秒内没动作者,认为掉线
    $entries = file($online_log);
    $temp = array();
    for ($i=0;$i<count($entries);$i++){
        $entry = explode(",",trim($entries[$i]));
        if(($entry[0] != getenv('REMOTE_ADDR')) && ($entry[1] > time())) {
            array_push($temp,$entry[0].",".$entry[1]."\n"); //取出其他浏览者的信息,并去掉超时者,保存进$temp
        }
    }
    array_push($temp,getenv('REMOTE_ADDR').",".(time() + ($timeout))."\n"); //更新浏览者的时间
    $slzxrs = count($temp); //计算在线人数
    $entries = implode("",$temp);
    //写入文件
    $fp = fopen($online_log,"w");
    flock($fp,LOCK_EX); //flock() 不能在NFS以及其他的一些网络文件系统中正常工作
    fputs($fp,$entries);
    flock($fp,LOCK_UN);
    fclose($fp);
    $tj= "在线人数:".$slzxrs."人";
?>

2.把下面的代码放在你想放的位置(比如:网站底部)

<?php echo $tj ?>

方法3

1.在主题目录下的 functions.php 文件中添加以下代码

/* Joe核心文件 */
require_once("core/core.php");

//在线人数
function online_users() {
    $filename='online.txt'; //数据文件
    $cookiename='Nanlon_OnLineCount'; //Cookie名称
    $onlinetime=30; //在线有效时间
    $online=file($filename); 
    $nowtime=$_SERVER['REQUEST_TIME']; 
    $nowonline=array(); 
    foreach($online as $line){ 
        $row=explode('|',$line); 
        $sesstime=trim($row[1]); 
        if(($nowtime - $sesstime)<=$onlinetime){
            $nowonline[$row[0]]=$sesstime;
        } 
    } 
    if(isset($_COOKIE[$cookiename])){
        $uid=$_COOKIE[$cookiename]; 
    }else{
        $vid=0;
        do{
            $vid++; 
            $uid='U'.$vid; 
        }while(array_key_exists($uid,$nowonline)); 
        setcookie($cookiename,$uid); 
    } 
    $nowonline[$uid]=$nowtime;
    $total_online=count($nowonline); 
    if($fp=@fopen($filename,'w')){ 
        if(flock($fp,LOCK_EX)){ 
            rewind($fp); 
            foreach($nowonline as $fuid=>$ftime){ 
                $fline=$fuid.'|'.$ftime."\n"; 
                @fputs($fp,$fline); 
            } 
            flock($fp,LOCK_UN); 
            fclose($fp); 
        } 
    } 
    echo "$total_online"; 
} 

2.然后在 footer.php 文件中合适的位置处添加以下代码

<?php echo online_users() ?>


"随机图片"动态显示 | 教程

在网页设计中,动态图片能够增加页面的吸引力和互动性。本教程将向您介绍如何使用CSS、PHP或HTML以及文字来实现动态图片的随机显示效果。

通过这个教程,您将学会如何为您的网页添加动态图片,并使每次访问页面时都能看到不同的图片。

具体操作

1.准备图片

首先,您需要准备一系列的图片,这些图片将在页面上进行随机显示。可以使用您自己的图片库,或者从免费图片资源网站上下载一些图片。

2.创建HTML文档

在HTML文档中,您需要创建一个图像容器,用于显示随机的图片。可以使用以下HTML代码:

<div class="image-container">
  <img src="heylie.png" id="heylie" alt="Random Image">
</div>

注意:上述代码中的 heylie.png 是一个占位图片,用于在页面加载时显示。当页面加载完成后,我们将通过CSS和PHP来动态地替换这个图片。

3.编写CSS样式

在CSS样式表中,您需要设置图像容器的样式,并通过设置背景图片来实现随机显示的效果。可以使用以下CSS代码:

.image-container {
  width: 400px; /* 根据您的需要设置宽度 */
  height: 300px; /* 根据您的需要设置高度 */
  background-size: cover;
  background-position: center;
}

4.编写PHP代码

在PHP文件中,您需要编写代码来实现随机选择并替换图像的功能。可以使用以下PHP代码:

<?php
$images = array(
  'heylie01.png',
  'heylie02.png',
  'heylie03.png',
  // 添加更多的图片路径
);

$randomImage = $images[array_rand($images)];
?>

<style>
  .image-container {
    background-image: url("<?php echo $randomImage; ?>");
  }
</style>

上述代码中,我们使用PHP的array_rand()函数从图片数组中随机选择一个图片,并将其作为背景图像应用于图像容器。

5.保存测试

将上述HTML代码与CSS和PHP代码合并到您的网页中,保存并运行该网页。您将会看到每次刷新页面时,图像容器中显示的图片都会随机变化。

小结

通过使用CSS、PHP和HTML代码,我们成功地实现了动态图片随机显示的效果。您可以根据自己的需求进行调整,添加更多的图片和样式。希望本教程能帮助您实现您网页设计中的动态图片随机显示效果,祝您成功!

在线人数 随机图片 源码分享 随笔 事业

上一篇 : 周末时光:八音盒和烤鱼

下一篇 : 域名变更与馅饼的诱惑


  1. 揽星   访客
    2024-11-25 09:00 第25楼 中国江苏省南京市联通Windows 10 · Google Chrome

    博客没人看,所以我不好意思加这个在线人数,不如直接加一行文字,在线人数:100,哈哈

    1. 刘郎   博主
      2024-11-25 09:08 第26楼 中国贵州省移动Linux · Google Chrome
      @揽星

      这个想法挺不错 数字乐观 心里高兴 一举两得

      1. 揽星   访客
        2024-11-25 09:09 第27楼 中国江苏省南京市联通Windows 10 · Google Chrome
        @刘郎

        很奇怪,我明明是登陆用户,为啥还是访客的tag

        1. 刘郎   博主
          2024-11-25 09:14 第28楼 中国贵州省移动Linux · Google Chrome
          @揽星

          因为这个标是手搓代码加上去的 系统会根据评论者的名称 邮箱 网址来评等级 至于只否为登录用户嘛 前者权限大于后者所以…😂

          1. 揽星   访客
            2024-11-25 09:17 第29楼 中国江苏省南京市联通Windows 10 · Google Chrome
            @刘郎

            但是登陆用户也有邮箱和网址呀

            1. 刘郎   博主
              2024-11-25 09:37 第30楼 中国贵州省移动Linux · Google Chrome
              @揽星

              权限问题 qq邮箱优先 然后是固定格式邮箱 最后才是自定义邮箱 不论是否登录 系统默认执行这套方案了 这估计是我后台手搓代码造成的一个bug😳

  2. 似水流年   访客
    2024-11-25 02:55 第23楼 中国河南省移动Android · Google Chrome

    这迎检让我想起了原来单位的一年一小检两年一大检。

    1. 刘郎   博主
      2024-11-25 02:59 第24楼 中国北京市新国信通信有限公司Linux · Google Chrome
      @似水流年

      我们公司每年一头一尾都会来检查 当然 这是固定时间的 还有时候会不定时突击检查😂

  3. Qin   Lv1
    2024-11-24 22:52 第21楼 中国广西移动Windows 10 · Google Chrome

    这个功能好,但就是怕实际数字不太好看😂
    其实我更想知道右上角「博主2小时前在线」是怎么实现......😉

    1. 刘郎   博主
      2024-11-24 22:59 第22楼 中国贵州省移动Linux · Google Chrome
      @Qin

      哈哈哈 不存在的 自己写博客是给自己看的 不要在乎这个东西 在线人数统计只是一个参考数据而已 代表不了什么的 至于你说的"博主2小时…"这个 看我之前发的文章:调用博主最近登录时间

  4. ACEVS   访客
    2024-11-24 17:04 第19楼 中国山东省青岛市联通Windows 10 · Google Chrome

    折腾的好~估计php的都通用吧。

    1. 刘郎   博主
      2024-11-24 17:08 第20楼 中国贵州省移动Linux · Google Chrome
      @ACEVS

      应该都通用的吧

  5. lincol29   Lv1
    2024-11-24 16:18 第17楼 中国广东省梅州市电信iPhone · Safari

    这两个都很不错哦。到时候我在网站上加这个在线人数试试看,给力!

    1. 刘郎   博主
      2024-11-24 16:21 第18楼 中国贵州省移动Linux · Google Chrome
      @lincol29

      好的 不过这东西其实也没啥大的作用 就一个显示网站常规数据的挂件 哈哈

  6. 2024-11-24 14:02 第15楼 中国江苏省无锡市联通Android · Google Chrome

    看样子好像不错,得试一试

    1. 刘郎   博主
      2024-11-24 14:32 第16楼 中国贵州省移动Linux · Google Chrome
      @一只小白菜

      试过的都说好 哈哈

  7. 老何   访客
    2024-11-24 12:40 第13楼 中国安徽省安庆市电信Windows 10 · Google Chrome

    原来迎接检查准备材料各行各业都有啊。

    1. 刘郎   博主
      2024-11-24 13:07 第14楼 中国贵州省移动Linux · Google Chrome
      @老何

      应该是吧 反正我们补的时间挺长挺久的

  8. obaby   Lv2
    2024-11-24 11:57 第11楼 中国山东省青岛市联通Windows 10 · Google Chrome

    不显示,人太少~~

    1. 刘郎   博主
      2024-11-24 12:03 第12楼 中国贵州省移动Linux · Google Chrome
      @obaby

      只有我们这种小流量的网站才弄这些 求个心里安慰 哈哈哈

  9. keyle   Lv1
    2024-11-24 11:43 第8楼 中国上海市移动iPhone · Google Chrome

    当前显示3人在线

    1. 刘郎   博主
      2024-11-24 11:45 第10楼 中国移动Linux · Google Chrome
      @keyle

      嗯哼?

  10. 沉沦   访客
    2024-11-24 11:42 第7楼 中国河北省保定市联通iPhone · Safari

    现在折腾代码,完全可以借助 AI 来完成。我是假如想实现某个功能就把主题中可能跟这个功能有关的或者可能需要在哪里增加的相关代码一股脑儿丢给 ChatGPT ,反复提问下,很多都能搞定。

    1. 刘郎   博主
      2024-11-24 11:44 第9楼 中国移动Linux · Google Chrome
      @沉沦

      这个方法确实不错 但自己有点基础还是好的 毕竟不用反反复复去操作同一件事 挺好

| 黔ICP备2024020400号 | 萌ICP备20246777号 | | 当前有 2 人在线 |
本站已加入BLOGS·CN
订阅
Sitemap
博友圈 星球穿梭
开往-友链接力