HTML ad tag preview - Powered by Ad Reform

Live Preview

Tag didn’t load? Click here and let us know!
1920x1080
21.5 KB
Share this result

Previews are deleted daily. Get a permanent share link sent to your inbox:
Script

Open in browser
<!DOCTYPE html>
<html lang="hi">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>मोबाइल ब्राउज़र Minecraft</title>
    <style>
        body { margin: 0; overflow: hidden; user-select: none; touch-action: none; background: #000; }
        canvas { display: block; }
        #crosshair {
            position: absolute; top: 50%; left: 50%;
            width: 8px; height: 8px; background: white;
            border-radius: 50%; transform: translate(-50%, -50%);
            pointer-events: none; z-index: 10;
        }
        /* मोबाइल जॉयस्टिक/कंट्रोल्स */
        #controls {
            position: absolute; bottom: 20px; left: 20px;
            display: grid; grid-template-columns: repeat(3, 50px);
            grid-template-rows: repeat(3, 50px); gap: 5px; z-index: 10;
        }
        .btn {
            width: 50px; height: 50px; background: rgba(255,255,255,0.3);
            border: 2px solid white; border-radius: 10px; color: white;
            font-weight: bold; font-size: 18px; display: flex;
            align-items: center; justify-content: center;
            touch-action: manipulation;
        }
        .btn:active { background: rgba(255,255,255,0.6); }
        #btn-up { grid-column: 2; grid-row: 1; }
        #btn-left { grid-column: 1; grid-row: 2; }
        #btn-down { grid-column: 2; grid-row: 2; }
        #btn-right { grid-column: 3; grid-row: 2; }
    </style>
</head>
<body>
    <div id="crosshair"></div>
    
    <!-- मोबाइल बटन्स -->
    <div id="controls">
        <div class="btn" id="btn-up">↑</div>
        <div class="btn" id="btn-left">←</div>
        <div class="btn" id="btn-down">↓</div>
        <div class="btn" id="btn-right">→</div>
    </div>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
    <script>
        // 1. सीन और कैमरा सेटअप
        const scene = new THREE.Scene();
        scene.background = new THREE.Color(0x87CEEB);
        
        const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
        const renderer = new THREE.WebGLRenderer({ antialias: true });
        renderer.setSize(window.innerWidth, window.innerHeight);
        document.body.appendChild(renderer.domElement);

        // 2. रोशनी
        scene.add(new THREE.AmbientLight(0xffffff, 0.6));
        const dirLight = new THREE.DirectionalLight(0xffffff, 0.6);
        dirLight.position.set(10, 20, 15);
        scene.add(dirLight);

        // 3. ब्लॉक्स बनाना
        const geometry = new THREE.BoxGeometry(1, 1, 1);
        const material = new THREE.MeshLambertMaterial({ color: 0x4caf50 });
        for (let x = -5; x < 5; x++) {
            for (let z = -5; z < 5; z++) {
                const block = new THREE.Mesh(geometry, material);
                block.position.set(x, 0, z);
                scene.add(block);
            }
        }
        camera.position.set(0, 1.8, 5);

        // 4. मूवमेंट स्टेट
        const move = { forward: false, backward: false, left: false, right: false };

        // मोबाइल टच बटन इवेंट्स
        const setupButton = (id, direction) => {
            const btn = document.getElementById(id);
            btn.addEventListener('touchstart', (e) => { e.preventDefault(); move[direction] = true; });
            btn.addEventListener('touchend', () => move[direction] = false);
        };
        setupButton('btn-up', 'forward');
        setupButton('btn-down', 'backward');
        setupButton('btn-left', 'left');
        setupButton('btn-right', 'right');

        // 5. स्क्रीन स्वाइप करके देखना (Look Control)
        let yaw = 0, pitch = 0;
        let prevTouchX = null, prevTouchY = null;

        window.addEventListener('touchstart', (e) => {
            // अगर बटन्स पर टच नहीं किया है, तो कैमरा घुमाने के लिए कोआर्डिनेट्स लें
            if (!e.target.classList.contains('btn')) {
                prevTouchX = e.touches[0].clientX;
                prevTouchY = e.touches[0].clientY;
            }
        }, { passive: false });

        window.addEventListener('touchmove', (e) => {
            if (prevTouchX !== null && !e.target.classList.contains('btn')) {
                const touchX = e.touches[0].clientX;
                const touchY = e.touches[0].clientY;
                
                const deltaX = touchX - prevTouchX;
                const deltaY = touchY - prevTouchY;

                yaw -= deltaX * 0.005;
                pitch -= deltaY * 0.005;
                pitch = Math.max(-Math.PI / 2.5, Math.min(Math.PI / 2.5, pitch));

                prevTouchX = touchX;
                prevTouchY = touchY;
            }
        }, { passive: false });

        window.addEventListener('touchend', (e) => {
            if (!e.target.classList.contains('btn')) {
                prevTouchX = null;
                prevTouchY = null;
            }
        });

        // 6. गेम लूप
        const speed = 0.08;
        function animate() {
            requestAnimationFrame(animate);

            camera.quaternion.setFromEuler(new THREE.Euler(pitch, yaw, 0, 'YXZ'));

            const forward = new THREE.Vector3(0, 0, -1).applyQuaternion(camera.quaternion);
            forward.y = 0; forward.normalize();
            const right = new THREE.Vector3(1, 0, 0).applyQuaternion(camera.quaternion);
            right.y = 0; right.normalize();

            if (move.forward) camera.position.addScaledVector(forward, speed);
            if (move.backward) camera.position.addScaledVector(forward, -speed);
            if (move.left) camera.position.addScaledVector(right, -speed);
            if (move.right) camera.position.addScaledVector(right, speed);

            renderer.render(scene, camera);
        }

        window.addEventListener('resize', () => {
            camera.aspect = window.innerWidth / window.innerHeight;
            camera.updateProjectionMatrix();
            renderer.setSize(window.innerWidth, window.innerHeight);
        });

        animate();
    </script>
</body>
</html>
Landing Page

This ad does not have a landing page available
Network Timeline

Performance Summary

Requests
Domains
125KB
Transfer Size
596KB
Content Size
969.0ms
Dom Content Loaded
180.0ms
First Paint
969.0ms
Load Time
Domain Breakdown

Transfer Size (bytes)
Content Size (bytes)
Header Size (bytes)
Requests
Timings (ms)
Total Time
Content Breakdown

Transfer Size (bytes)
Content Size (bytes)
Header Size (bytes)
Requests