Created
April 27, 2022 20:05
-
-
Save shurane/dc35cdfa3ca9281f6d1a72797979185f to your computer and use it in GitHub Desktop.
data:text/html, <html contenteditable> with some extra styling to make it easier to use. Just copy/paste the code in your browser and type away. Or make it a bookmarklet.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| data:text/html;charset=utf-8,<title>TextEditor</title><style>body{background:#fbfbfb;color:#333;margin:0%50auto;width:100%}textarea{background:#fbfbfb;border:0;color:#333;font-family:sans-serif;font-size:2rem;height:98%;line-height:1.4;margin:0%20auto;outline:0;padding:4rem;width:100%}button{background-color:#fbfbfb;border:1px%20#ccc%20solid;color:#999;cursor:pointer;float:right;margin:10px%200;padding:5px%2010px}@media%20(max-width:100%){body{width:100%;padding:0}textarea{padding:10px}button{float:none}}</style><body><button%20onclick="sM();%20return%20false">Email%20this</button><textarea%20contenteditable%20id=TE%20spellcheck=false%20placeholder=Write...%20autofocus></textarea><script>function%20sM(){var%20a="mailto:?subject="+escape("Text%20from%20TextEditor")+"&body="+escape(document.getElementById("TE").value);window.location.href=a};</script> |
aztmd456-collab
commented
Aug 1, 2026
<title>Ghim Tâm Đầu Full Đỏ</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
background: #0a0a0f;
min-height: 300vh;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
overflow-x: hidden;
cursor: crosshair;
}
<title>Ghim Tâm Đầu Full Đỏ</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
background: #0a0a0f;
min-height: 300vh;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
overflow-x: hidden;
cursor: crosshair;
}
/* ===== HEADER ===== */
.header {
position: fixed;
top: 0; left: 0; right: 0;
z-index: 999;
background: rgba(10,10,15,0.95);
backdrop-filter: blur(12px);
padding: 10px 20px;
border-bottom: 2px solid #ff0000;
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 10px;
}
.header .logo {
font-size: 20px;
font-weight: 900;
color: #ff0000;
text-shadow: 0 0 30px rgba(255,0,0,0.3);
animation: glowText 1.5s infinite;
}
@keyframes glowText {
0%,100% { text-shadow: 0 0 30px rgba(255,0,0,0.3); }
50% { text-shadow: 0 0 60px rgba(255,0,0,0.6); }
}
.header .badge {
background: #ff0000;
color: #fff;
font-size: 10px;
padding: 3px 12px;
border-radius: 20px;
font-weight: 700;
animation: pulse 0.5s infinite;
}
@keyframes pulse {
0%,100% { transform: scale(1); box-shadow: 0 0 20px rgba(255,0,0,0.3); }
50% { transform: scale(1.05); box-shadow: 0 0 40px rgba(255,0,0,0.6); }
}
/* ===== NHÂN VẬT ===== */
.character {
width: 160px;
margin: 100px auto 0;
position: relative;
cursor: crosshair;
}
.head {
width: 75px;
height: 75px;
background: radial-gradient(circle at 40% 35%, #2d2d44, #1a1a2e);
border-radius: 50%;
margin: 0 auto;
position: relative;
border: 2px solid #ff6b00;
box-shadow: 0 0 40px rgba(255,107,0,0.1);
transition: all 0.3s;
}
.head.hit {
border-color: #ff0000;
box-shadow: 0 0 80px rgba(255,0,0,0.5);
}
.head .center-dot {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 4px;
height: 4px;
background: #ff6b00;
border-radius: 50%;
box-shadow: 0 0 30px rgba(255,107,0,0.9);
animation: dotPulse 1s infinite;
z-index: 5;
}
@keyframes dotPulse {
0%,100% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
50% { transform: translate(-50%, -50%) scale(3); opacity: 0.3; }
}
.eye {
position: absolute;
width: 13px;
height: 13px;
background: #ff6b00;
border-radius: 50%;
top: 30px;
box-shadow: 0 0 15px rgba(255,107,0,0.3);
transition: all 0.3s;
}
.eye.hit {
background: #ff0000;
box-shadow: 0 0 40px rgba(255,0,0,0.6);
}
.eye::after {
content: '';
position: absolute;
width: 4px;
height: 4px;
background: #fff;
border-radius: 50%;
top: 2px;
left: 2px;
}
.eye.l { left: 16px; }
.eye.r { right: 16px; }
.mouth {
width: 18px;
height: 9px;
border-bottom: 2px solid #ff6b00;
border-radius: 0 0 14px 14px;
position: absolute;
bottom: 16px;
left: 50%;
transform: translateX(-50%);
transition: all 0.3s;
}
.mouth.hit {
border-bottom-color: #ff0000;
}
.neck {
width: 32px;
height: 20px;
background: #1a1a2e;
margin: -8px auto 0;
border-radius: 8px 8px 0 0;
border: 2px solid rgba(255,107,0,0.15);
border-bottom: none;
transition: all 0.3s;
}
.neck.hit {
border-color: #ff0000;
box-shadow: 0 0 30px rgba(255,0,0,0.3);
}
.body {
width: 110px;
height: 140px;
margin: 0 auto;
background: linear-gradient(180deg, #1a1a2e, #16213e);
border-radius: 50px 50px 15px 15px;
border: 2px solid rgba(255,107,0,0.15);
transition: all 0.3s;
position: relative;
overflow: hidden;
}
.body.hit {
border-color: #ff0000;
box-shadow: 0 0 60px rgba(255,0,0,0.3);
}
/* HIỆU ỨNG MÁU */
.blood {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: radial-gradient(ellipse at center, rgba(255,0,0,0.3), transparent);
opacity: 0;
transition: all 0.3s;
pointer-events: none;
border-radius: 50px 50px 15px 15px;
}
.blood.active {
opacity: 1;
}
/* ===== ĐIỂM GHIM ===== */
.aim {
position: fixed;
pointer-events: none;
z-index: 100;
transition: none;
}
.aim .outer {
width: 30px;
height: 30px;
border-radius: 50%;
border: 2.5px solid #ff0000;
position: relative;
box-shadow: 0 0 40px rgba(255,0,0,0.4);
animation: aimPulse 0.4s infinite;
}
@keyframes aimPulse {
0%,100% { transform: scale(1); border-color: #ff0000; }
50% { transform: scale(1.1); border-color: #ff4400; }
}
.aim .center {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 4px;
height: 4px;
background: #ff0000;
border-radius: 50%;
box-shadow: 0 0 30px rgba(255,0,0,1);
}
.aim .cross {
position: absolute;
background: #ff0000;
border-radius: 1px;
}
.aim .cross.t { width: 2px; height: 10px; top: -5px; left: 50%; transform: translateX(-50%); }
.aim .cross.b { width: 2px; height: 10px; bottom: -5px; left: 50%; transform: translateX(-50%); }
.aim .cross.l { width: 10px; height: 2px; left: -5px; top: 50%; transform: translateY(-50%); }
.aim .cross.r { width: 10px; height: 2px; right: -5px; top: 50%; transform: translateY(-50%); }
/* ===== VÒNG BAO ===== */
.ring {
position: fixed;
pointer-events: none;
z-index: 50;
border-radius: 50%;
border: 2px solid rgba(255,0,0,0.6);
box-shadow: 0 0 80px rgba(255,0,0,0.3);
animation: ringPulse 0.4s infinite;
opacity: 0;
transition: all 0.3s;
}
.ring.show {
opacity: 1;
}
@keyframes ringPulse {
0%,100% { transform: scale(1); }
50% { transform: scale(1.08); }
}
/* ===== STATUS ===== */
.status {
position: fixed;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
background: rgba(0,0,0,0.9);
padding: 10px 20px;
border-radius: 12px;
border: 1px solid #ff0000;
color: #aaa;
font-size: 13px;
text-align: center;
z-index: 1000;
backdrop-filter: blur(10px);
min-width: 250px;
}
.status .status-text {
color: #ff0000;
font-weight: bold;
animation: blink 0.3s infinite;
}
.status .info {
color: #ff6b00;
font-weight: bold;
}
@keyframes blink {
0%,100% { opacity: 1; }
50% { opacity: 0.3; }
}
/* ===== NỘI DUNG ===== */
.content {
max-width: 600px;
margin: 40px auto;
padding: 20px;
color: #888;
}
.content h1 {
text-align: center;
font-size: 28px;
color: #ff0000;
text-shadow: 0 0 40px rgba(255,0,0,0.3);
margin-bottom: 10px;
}
.content p {
text-align: center;
line-height: 1.8;
font-size: 15px;
}
.content .hint {
text-align: center;
margin: 20px 0 40px;
animation: bounce 2s infinite;
color: #666;
}
@keyframes bounce {
0%,100% { transform: translateY(0); }
50% { transform: translateY(8px); }
}
.card {
background: rgba(20,15,12,0.9);
padding: 18px 20px;
margin-bottom: 14px;
border-radius: 12px;
border: 1px solid rgba(255,0,0,0.15);
}
.card h3 { color: #fff; font-size: 16px; margin-bottom: 6px; }
.card h3 span { color: #ff0000; }
.card p { color: #b0a8a0; font-size: 14px; line-height: 1.6; }
.footer {
text-align: center;
color: #444;
font-size: 12px;
padding: 20px 0;
border-top: 1px solid rgba(255,0,0,0.1);
margin-top: 20px;
}
@media (max-width: 640px) {
.character { width: 130px; margin-top: 80px; }
.head { width: 60px; height: 60px; }
.eye { width: 11px; height: 11px; top: 24px; }
.eye.l { left: 12px; }
.eye.r { right: 12px; }
.eye::after { width: 3px; height: 3px; }
.mouth { width: 14px; height: 7px; bottom: 12px; }
.body { width: 90px; height: 110px; }
.aim .outer { width: 24px; height: 24px; border-width: 2px; }
.aim .cross.t,.cross.b { height: 8px; top: -4px; bottom: -4px; }
.aim .cross.l,.cross.r { width: 8px; left: -4px; right: -4px; }
.status { font-size: 11px; padding: 8px 14px; min-width: 180px; bottom: 10px; }
.content h1 { font-size: 22px; }
}
</style>
<!-- ===== HEADER ===== -->
<header class="header">
<div class="logo">🎯 GHIM TÂM ĐẦU</div>
<div class="badge">🔴 FULL ĐỎ</div>
</header>
<!-- ===== NHÂN VẬT ===== -->
<div class="character" id="character">
<div class="head" id="head">
<div class="center-dot"></div>
<div class="eye l" id="eyeL"></div>
<div class="eye r" id="eyeR"></div>
<div class="mouth" id="mouth"></div>
</div>
<div class="neck" id="neck"></div>
<div class="body" id="body">
<div class="blood" id="blood"></div>
</div>
</div>
<!-- ===== ĐIỂM GHIM ===== -->
<div class="aim" id="aim">
<div class="outer">
<div class="center"></div>
<div class="cross t"></div>
<div class="cross b"></div>
<div class="cross l"></div>
<div class="cross r"></div>
</div>
</div>
<!-- ===== VÒNG BAO ===== -->
<div class="ring" id="ring"></div>
<!-- ===== STATUS ===== -->
<div class="status">
🔴 <span class="status-text" id="statusText">FULL ĐỎ</span> |
💀 <span class="info" id="killCount">0</span> |
🎯 <span class="info" id="statusInfo">HEADSHOT</span>
</div>
<!-- ===== NỘI DUNG ===== -->
<div class="content">
<h1>🎯 GHIM TÂM ĐẦU FULL ĐỎ</h1>
<p>Auto-aim chính xác 100% - Bắn là trúng đầu</p>
<div class="hint">⬇ Cuộn để thử ⬇</div>
<div class="card">
<h3>🎯 <span>Ghim Tâm Đầu 100%</span></h3>
<p>Điểm ngắm tự động <strong>bám vào trung tâm đầu</strong> nhân vật. Bắn là trúng đầu ngay lập tức.</p>
</div>
<div class="card">
<h3>🔴 <span>Full Đỏ Toàn Bộ</span></h3>
<p>Khi bắn trúng, toàn bộ nhân vật <strong>chuyển sang màu đỏ</strong> với hiệu ứng máu bắn ra.</p>
</div>
<div class="card">
<h3>⚡ <span>Auto Lock</span></h3>
<p>Đưa điểm ngắm vào giữa màn hình → <strong>tự động khóa và bắn</strong> liên tục.</p>
</div>
<div class="footer">🎯 Ghim Tâm Đầu Full Đỏ — Made with 💀</div>
</div>
<script>
// ===== GHIM TÂM ĐẦU FULL ĐỎ =====
const aim = document.getElementById('aim');
const head = document.getElementById('head');
const ring = document.getElementById('ring');
const killCount = document.getElementById('killCount');
const body = document.getElementById('body');
const blood = document.getElementById('blood');
const eyeL = document.getElementById('eyeL');
const eyeR = document.getElementById('eyeR');
const mouth = document.getElementById('mouth');
const neck = document.getElementById('neck');
const statusText = document.getElementById('statusText');
let kills = 0;
let isLocked = false;
// Lấy vị trí đầu
function getHeadPos() {
const r = head.getBoundingClientRect();
return { x: r.left + r.width/2, y: r.top + r.height/2 };
}
// ===== FULL ĐỎ =====
function fullRed() {
// Chuyển toàn bộ nhân vật sang đỏ
head.classList.add('hit');
eyeL.classList.add('hit');
eyeR.classList.add('hit');
mouth.classList.add('hit');
neck.classList.add('hit');
body.classList.add('hit');
blood.classList.add('active');
// Tăng kill
kills++;
killCount.textContent = kills;
// Hiệu ứng rung
const char = document.getElementById('character');
char.style.transition = 'transform 0.08s';
char.style.transform = 'translateX(-4px)';
setTimeout(() => { char.style.transform = 'translateX(4px)'; }, 50);
setTimeout(() => { char.style.transform = 'translateX(0)'; }, 100);
// Vòng bao
const pos = getHeadPos();
const size = 50 + Math.random() * 40;
ring.style.width = size + 'px';
ring.style.height = size + 'px';
ring.style.left = (pos.x - size/2) + 'px';
ring.style.top = (pos.y - size/2) + 'px';
ring.classList.add('show');
// Nổ hạt
createExplosion(pos.x, pos.y);
// Reset sau 0.5s
setTimeout(() => {
head.classList.remove('hit');
eyeL.classList.remove('hit');
eyeR.classList.remove('hit');
mouth.classList.remove('hit');
neck.classList.remove('hit');
body.classList.remove('hit');
blood.classList.remove('active');
ring.classList.remove('show');
}, 500);
}
// ===== HIỆU ỨNG NỔ =====
function createExplosion(x, y) {
for (let i = 0; i < 25; i++) {
const p = document.createElement('div');
const angle = Math.random() * Math.PI * 2;
const speed = 40 + Math.random() * 180;
const size = 3 + Math.random() * 6;
p.style.cssText = `
position: fixed;
left: ${x}px;
top: ${y}px;
width: ${size}px;
height: ${size}px;
background: #ff0000;
border-radius: 50%;
pointer-events: none;
z-index: 9999;
box-shadow: 0 0 30px rgba(255,0,0,0.6);
transition: all ${0.4 + Math.random() * 0.6}s cubic-bezier(0.34, 1.56, 0.64, 1);
opacity: 1;
`;
document.body.appendChild(p);
requestAnimationFrame(() => {
p.style.transform = `translate(${Math.cos(angle) * speed}px, ${Math.sin(angle) * speed}px)`;
p.style.opacity = '0';
});
setTimeout(() => { if (p.parentNode) p.remove(); }, 1000);
}
}
// ===== CẬP NHẬT ĐIỂM GHIM =====
function updateAim() {
const pos = getHeadPos();
const size = aim.offsetWidth || 30;
// Ghim vào đầu
aim.style.top = (pos.y - size/2) + 'px';
aim.style.left = (pos.x - size/2) + 'px';
// Kiểm tra lock
const scx = window.innerWidth / 2;
const scy = window.innerHeight / 2;
const rect = aim.getBoundingClientRect();
const cx = rect.left + rect.width / 2;
const cy = rect.top + rect.height / 2;
const dist = Math.sqrt(Math.pow(cx - scx, 2) + Math.pow(cy - scy, 2));
// Auto lock + bắn
if (dist < 100 && !isLocked) {
isLocked = true;
statusText.textContent = '🔴 LOCK ON!';
fullRed();
} else if (dist >= 100 && isLocked) {
isLocked = false;
statusText.textContent = '🔴 FULL ĐỎ';
}
}
// ===== SỰ KIỆN =====
let tick = false;
window.addEventListener('scroll', () => {
if (!tick) {
requestAnimationFrame(() => { updateAim(); tick = false; });
tick = true;
}
}, { passive: true });
window.addEventListener('resize', updateAim);
window.addEventListener('load', () => setTimeout(updateAim, 100));
// Click vào nhân vật
document.getElementById('character').addEventListener('click', () => fullRed());
// Click chuột phải
document.addEventListener('contextmenu', (e) => {
e.preventDefault();
fullRed();
});
// Phím Space
document.addEventListener('keydown', (e) => {
if (e.code === 'Space') {
e.preventDefault();
fullRed();
}
});
// Tự động bắn
setInterval(() => {
if (isLocked) fullRed();
}, 1500);
console.log('🎯 GHIM TÂM ĐẦU FULL ĐỎ ĐÃ SẴN SÀNG!');
console.log('💀 Click vào nhân vật hoặc nhấn Space để bắn!');
</script>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment