HTML ad tag preview - Powered by Ad Reform

Live Preview

Tag didn’t load? Click here and let us know!
1920x1080
38.6 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="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>IRON MAN - REAL HOLO SUIT</title>
<style>
body{margin:0;background:#000;overflow:hidden;font-family:monospace;color:#00f0ff;user-select:none}
#video{position:fixed;top:0;left:0;width:100vw;height:100vh;object-fit:cover;transform:scaleX(-1);z-index:1}
#holoCanvas{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:2;pointer-events:none}
.hud{position:fixed;top:0;left:0;z-index:3;width:100vw;height:100vh;box-sizing:border-box;padding:12px;border:2px solid #00f0ff;pointer-events:none;display:flex;flex-direction:column;justify-content:space-between}
.top{font-size:11px;display:flex;justify-content:space-between;border-bottom:1px solid #00f0ff;padding-bottom:5px;background:rgba(0,0,0,0.6);letter-spacing:1px}

.suit-layer{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:2;display:none;align-items:center;justify-content:center;pointer-events:none;opacity:0.9}
.suit-box{text-align:center;background:rgba(0,10,25,0.75);padding:20px;border:1px dashed #00f0ff;box-shadow:0 0 30px rgba(0,240,255,0.3)}
.suit{font-size:180px;filter:drop-shadow(0 0 30px #00f0ff) drop-shadow(0 0 60px #ff0000);animation:suitPulse 2s infinite, suitFloat 4s infinite ease-in-out}
@keyframes suitPulse{0%{filter:drop-shadow(0 0 20px #00f0ff)}50%{filter:drop-shadow(0 0 50px #00f0ff) drop-shadow(0 0 80px #ff0000)}100%{filter:drop-shadow(0 0 20px #00f0ff)}}
@keyframes suitFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-15px) scale(1.05)}}

.arc{width:70px;height:70px;border:3px solid #fff;border-radius:50%;margin:10px auto;background:radial-gradient(circle,#fff,#00f0ff,#0088ff);box-shadow:0 0 40px #00f0ff, inset 0 0 20px #fff;animation:arcSpin 2s infinite linear}
@keyframes arcSpin{0%{box-shadow:0 0 40px #00f0ff}50%{box-shadow:0 0 80px #00f0ff, 0 0 100px #fff}100%{box-shadow:0 0 40px #00f0ff}}

.controls{display:flex;justify-content:center;gap:10px;pointer-events:auto;margin-bottom:10px}
.btn{padding:10px 18px;background:rgba(0,240,255,0.15);color:#00f0ff;border:1px solid #00f0ff;font-weight:bold;box-shadow:0 0 15px rgba(0,240,255,0.3);cursor:pointer;font-family:monospace;letter-spacing:1px;transition:all 0.2s}
.btn:hover{background:#00f0ff;color:#000;box-shadow:0 0 25px #00f0ff}

.logs{height:70px;overflow-y:auto;font-size:10px;border:1px solid #00f0ff44;padding:6px;background:rgba(0,10,20,0.6);pointer-events:auto;letter-spacing:0.5px}
.logs::-webkit-scrollbar{width:3px;}
.logs::-webkit-scrollbar-thumb{background:#00f0ff;}
</style>
</head>
<body>

<!-- WEBCAM FEED -->
<video id="video" autoplay playsinline muted></video>

<!-- HOLOGRAM CANVAS -->
<canvas id="holoCanvas"></canvas>

<!-- SUIT OVERLAY LAYER -->
<div class="suit-layer" id="suitLayer">
  <div class="suit-box">
    <div style="font-size:12px;letter-spacing:3px">MARK LXXXV // HOLO-LOCK ACTIVE</div>
    <div class="suit" id="suitEmoji">🦾</div>
    <div class="arc"></div>
    <div style="font-size:10px;margin-top:10px">ARC REACTOR 100% // NANO MESH STABLE</div>
  </div>
</div>

<!-- HUD INTERFACE -->
<div class="hud">
  <div class="top">
    <span>JARVIS v9.4 // AR HOLO-SUIT</span>
    <span id="time">00:00:00</span>
    <span id="cameraStatus" style="color:#ffcc00">INITIALIZING CAMERA...</span>
  </div>

  <div>
    <div id="logs" class="logs"></div>
    <div class="controls">
      <button class="btn" onclick="startCamera()">📷 CAMERA</button>
      <button class="btn" onclick="toggleSuit()">🦾 TOGGLE SUIT</button>
      <button class="btn" onclick="triggerScan()">◧ SCAN TARGET</button>
      <button class="btn" onclick="speak('All suit systems operational, Boss.')">🎤 JARVIS VOICE</button>
    </div>
  </div>
</div>

<script>
// Time Clock
function updateTime(){
  document.getElementById('time').innerText = new Date().toLocaleTimeString();
}
setInterval(updateTime, 1000);
updateTime();

// System Log Utility
function log(msg){
  let l = document.getElementById('logs');
  let t = new Date().toLocaleTimeString();
  l.innerHTML += `<div>[${t}] > ${msg}</div>`;
  l.scrollTop = l.scrollHeight;
}

// Voice Feedback Engine
function speak(text){
  log("JARVIS: " + text);
  if('speechSynthesis' in window){
    window.speechSynthesis.cancel();
    let m = new SpeechSynthesisUtterance(text);
    m.rate = 1.0;
    m.pitch = 0.9;
    window.speechSynthesis.speak(m);
  }
}

// Camera Initialization
const video = document.getElementById('video');
async function startCamera(){
  try {
    const stream = await navigator.mediaDevices.getUserMedia({ video: { width: 1280, height: 720 }, audio: false });
    video.srcObject = stream;
    document.getElementById('cameraStatus').innerText = "CAMERA ONLINE";
    document.getElementById('cameraStatus').style.color = "#00f0ff";
    log("WEBCAM: Video feed established.");
    speak("Camera feed online, Boss.");
  } catch(err) {
    document.getElementById('cameraStatus').innerText = "CAMERA ACCESS DENIED";
    document.getElementById('cameraStatus').style.color = "#ff3333";
    log("ERROR: Camera permission denied or device missing.");
  }
}

// Toggle Suit Overlay
function toggleSuit(){
  let suit = document.getElementById('suitLayer');
  if(suit.style.display === 'flex'){
    suit.style.display = 'none';
    speak("Holographic suit overlay disengaged.");
    log("SUIT: Holographic overlay offline.");
  } else {
    suit.style.display = 'flex';
    speak("Mark 85 holographic nano suit deployed.");
    log("SUIT: Holographic overlay active.");
  }
}

// Trigger Holographic Target Scan
let scanning = false;
function triggerScan(){
  scanning = true;
  speak("Scanning perimeter for structural integrity and targets.");
  log("SCANNER: 360-Degree Target Lock Initiated.");
  setTimeout(() => {
    scanning = false;
    log("SCANNER: Perimeter clear. No threats detected.");
    speak("Scan complete. Perimeter nominal.");
  }, 3500);
}

// Holographic Reticle Canvas Drawing
const canvas = document.getElementById('holoCanvas');
const ctx = canvas.getContext('2d');

function resizeCanvas(){
  canvas.width = window.innerWidth;
  canvas.height = window.innerHeight;
}
window.addEventListener('resize', resizeCanvas);
resizeCanvas();

let angle = 0;
function drawHologramOverlay(){
  ctx.clearRect(0, 0, canvas.width, canvas.height);
  
  const cx = canvas.width / 2;
  const cy = canvas.height / 2;
  angle += 0.02;

  // Draw HUD Scanning Reticle
  ctx.save();
  ctx.translate(cx, cy);
  
  // Outer Rotating Arc Ring
  ctx.beginPath();
  ctx.arc(0, 0, 180, angle, angle + Math.PI * 1.5);
  ctx.strokeStyle = 'rgba(0, 240, 255, 0.4)';
  ctx.lineWidth = 2;
  ctx.stroke();

  // Inner Reverse Rotating Ring
  ctx.beginPath();
  ctx.arc(0, 0, 140, -angle * 1.5, -angle * 1.5 + Math.PI);
  ctx.strokeStyle = 'rgba(0, 240, 255, 0.6)';
  ctx.lineWidth = 1.5;
  ctx.setLineDash([8, 8]);
  ctx.stroke();
  ctx.setLineDash([]);

  // Scanning Crosshairs
  ctx.beginPath();
  ctx.moveTo(-200, 0); ctx.lineTo(-120, 0);
  ctx.moveTo(120, 0);  ctx.lineTo(200, 0);
  ctx.moveTo(0, -200); ctx.lineTo(0, -120);
  ctx.moveTo(0, 120);  ctx.lineTo(0, 200);
  ctx.strokeStyle = 'rgba(0, 240, 255, 0.5)';
  ctx.lineWidth = 1;
  ctx.stroke();

  // If scanning active, draw laser line sweep
  if(scanning){
    let sweepY = Math.sin(angle * 3) * 200;
    ctx.beginPath();
    ctx.moveTo(-220, sweepY);
    ctx.lineTo(220, sweepY);
    ctx.strokeStyle = '#ff0055';
    ctx.lineWidth = 2;
    ctx.shadowBlur = 15;
    ctx.shadowColor = '#ff0055';
    ctx.stroke();
  }

  ctx.restore();
  requestAnimationFrame(drawHologramOverlay);
}

// Initial Boot Engine
window.onload = function(){
  log("SYSTEM BOOT: JARVIS Mark LXXXV Holo Engine Online.");
  drawHologramOverlay();
  startCamera();
};
</script>

</body>
</html>
Landing Page

This ad does not have a landing page available
Network Timeline

Performance Summary

Requests
Domains
8KB
Transfer Size
8KB
Content Size
98.0ms
Dom Content Loaded
292.0ms
First Paint
101.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