three三维可调节风速与摇头的电风扇代码-html代码-BFW代码库

three三维可调节风速与摇头的电风扇代码

代码语言：html

所属分类：三维

代码描述：gemini3生成three三维可调节风速与摇头的电风扇代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>3D 交互式落地扇 (完美合体版)</title>
    <style>
        body { margin: 0; overflow: hidden; background-color: #e0e0e0; font-family: 'Segoe UI', sans-serif; }
        #controls {
            position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);
            background: rgba(255, 255, 255, 0.9); padding: 15px 25px; border-radius: 30px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.2); display: flex; gap: 15px; z-index: 10;
            backdrop-filter: blur(5px);
        }
        .btn-group { display: flex; gap: 5px; align-items: center; }
        button {
            border: none; outline: none; padding: 10px 18px; border-radius: 20px; cursor: pointer;
            font-weight: bold; transition: all 0.2s; background: #f0f0f0; color: #333;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        }
        button:hover { transform: translateY(-2px); }
        button.active { background: #2196F3; color: white; box-shadow: 0 4px 10px rgba(33, 150, 243, 0.4); }
        button.off-btn.active { background: #ff5252; box-shadow: 0 4px 10px rgba(255, 82, 82, 0.4); }
        .label { font-size: 12px; color: #666; margin-right: 5px; text-transform: uppercase; }
        #info {
            position: absolute; top: 20px; left: 20px; color: #333;
            background: rgba(255,255,255,0.8); padding: 10px; border-radius: 8px; pointer-events: none;
        }
    </style>
</head>
<body>

    <div id="controls">
        <div class="btn-group">
            <span class="label">风速</span>
            <button class="off-btn active" onclick="setSpeed(0)">OFF</button>
            <button onclick="setSpeed(1)">1</button>
            <button onclick="setSpeed(2)">2</button>
            <button onclick="setSpeed(3)">3</button>
        </div>
        <div style="width: 1px; background: #ccc; margin: 0 10px;"></div>.........完整代码请登录后点击上方下载按钮下载查看