logo
0
0
WeChat Login

🐷 来测测你是什么猪

一个有趣的猪猪检测器网页应用,探索你内心的猪猪能量!使用AI驱动的趣味检测工具。

📋 项目简介

这是一个基于Web的趣味测试应用,用户可以通过简单的交互来检测自己是哪种类型的"猪"。应用包含了丰富的动画效果、音效反馈和多种猪猪形象。

✨ 主要功能

  • 🎯 趣味检测:通过简单操作检测用户的猪猪类型
  • 🎨 丰富形象:包含22种不同的猪猪形象
  • 🎵 音效反馈:检测过程中配有有趣的音效
  • 📱 响应式设计:适配各种设备屏幕
  • 🎭 动画效果:流畅的交互动画和视觉效果
  • 📸 图片保存:可以保存检测结果图片

🖼️ 猪猪形象列表

应用包含以下猪猪形象:

  • 🐷 基础猪猪
  • 🖤 黑色猪猪
  • ⚫ 黑白猪猪
  • 💎 水晶猪猪
  • 👹 恶魔猪猪
  • 🎎 娃娃猪猪
  • 💥 爆炸猪猪
  • 😇 天堂猪猪
  • 🔮 魔法猪猪
  • ⚙️ 机械猪猪
  • ⚽ 猪猪球
  • 🐱 猫猫猪猪
  • 👤 猪人
  • 📜 猪猪印章
  • 🍢 猪肉串
  • 💀 骷髅猪猪
  • ❄️ 雪花猪猪
  • 👻 灵魂猪猪
  • 🐗 野猪
  • 🧠 诸葛亮猪猪
  • 🧟 僵尸猪猪
  • 👤 人类形象

🛠️ 技术栈

  • 前端框架:纯HTML/CSS/JavaScript
  • 样式框架:Tailwind CSS
  • 字体:Google Fonts (Inter, Noto Sans SC)
  • 图标:Font Awesome
  • 动画:CSS3动画 + JavaScript

📁 项目结构

├── index.html              # 主页面
├── styles.css              # 样式文件
├── animations.js           # 动画效果
├── sounds.js               # 音效管理
├── save-image.js           # 图片保存功能
├── clipboard-fallback.js   # 剪贴板兼容
├── image/                  # 图片资源目录
│   ├── pig.png            # 基础猪猪图片
│   ├── black-pig.png      # 黑色猪猪
│   ├── crystal-pig.png    # 水晶猪猪
│   └── ...                # 其他猪猪图片
└── README.md              # 项目说明文档

🚀 如何使用

  1. 克隆项目

    git clone https://cnb.cool/aynuzbh/pig-test.git
    cd pig-test
    
  2. 直接运行: 由于是纯前端项目,可以直接在浏览器中打开 index.html 文件

  3. 本地服务器(推荐):

    # 使用Python
    python -m http.server 8000
    
    # 或使用Node.js
    npx serve .
    
  4. 访问 http://localhost:8000 开始使用

🎮 使用说明

  1. 打开网页后,按照提示进行操作
  2. 点击检测按钮开始测试
  3. 等待检测完成,查看你的猪猪类型
  4. 可以保存检测结果图片分享给朋友

🤝 贡献指南

欢迎提交Issue和Pull Request来改进这个项目!

📄 许可证

MIT License

👨‍💻 作者

我睡不醒

🌟 特性亮点

  • 零依赖:除了CDN资源,无需安装额外依赖
  • 轻量级:项目体积小,加载速度快
  • 跨平台:支持所有现代浏览器
  • 趣味性:适合朋友聚会和社交分享

🐷 快来测测你是什么猪吧! 🐷

About

快来测测你是什么猪猪

Language
JavaScript47.1%
HTML46.4%
CSS6.6%