Error code
00.03.010
Were you logged in?
Yes
Your username (if logged in)
IAM
Your HTML
<!DOCTYPE html>
<html lang="vi">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<title>AIM Free Fire iOS - Custom Crosshair Overlay</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
background: transparent;
overflow: hidden;
height: 100vh;
width: 100vw;
position: fixed;
touch-action: none;
-webkit-touch-callout: none;
-webkit-user-select: none;
user-select: none;
}
/* Overlay container - trong suốt để hiển thị game phía sau */
.overlay-container {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 9999;
}
/* Crosshair chính */
.crosshair {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 120px;
height: 120px;
pointer-events: none;
}
/* Vòng tròn ngoài */
.circle-outer {
position: absolute;
width: 100%;
height: 100%;
border: 3px solid #00ff00;
border-radius: 50%;
box-shadow:
0 0 20px rgba(0, 255, 0, 0.8),
0 0 40px rgba(0, 255, 0, 0.4),
inset 0 0 20px rgba(0, 255, 0, 0.3);
animation: pulse-outer 2s ease-in-out infinite;
}
/* Vòng tròn trong */
.circle-inner {
position: absolute;
width: 30%;
height: 30%;
top: 35%;
left: 35%;
border: 2px solid #ff0000;
border-radius: 50%;
box-shadow: 0 0 15px rgba(255, 0, 0, 0.6);
animation: pulse-inner 1.5s ease-in-out infinite;
}
/* Điểm chấm trung tâm */
.center-dot {
position: absolute;
width: 6px;
height: 6px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: #ff0000;
border-radius: 50%;
box-shadow: 0 0 10px #ff0000;
}
/* 4 đường kẻ */
.line-top, .line-bottom, .line-left, .line-right {
position: absolute;
background: #00ff00;
box-shadow: 0 0 10px rgba(0, 255, 0, 0.8);
}
.line-top {
top: -25px;
left: 50%;
width: 2px;
height: 25px;
transform: translateX(-50%);
}
.line-bottom {
bottom: -25px;
left: 50%;
width: 2px;
height: 25px;
transform: translateX(-50%);
}
.line-left {
left: -25px;
top: 50%;
height: 2px;
width: 25px;
transform: translateY(-50%);
}
.line-right {
right: -25px;
top: 50%;
height: 2px;
width: 25px;
transform: translateY(-50%);
}
/* Hiệu ứng animations */
@keyframes pulse-outer {
0%, 100% {
transform: scale(1);
border-color: #00ff00;
}
50% {
transform: scale(1.05);
border-color: #00ffaa;
}
}
@keyframes pulse-inner {
0%, 100% {
transform: scale(1);
border-color: #ff0000;
}
50% {
transform: scale(1.15);
border-color: #ff4444;
}
}
/* Settings panel */
.settings-panel {
position: fixed;
bottom: 20px;
right: 20px;
background: rgba(0, 0, 0, 0.8);
border-radius: 15px;
padding: 15px;
pointer-events: auto;
z-index: 10000;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
}
.settings-title {
color: #00ff00;
font-size: 14px;
margin-bottom: 10px;
text-align: center;
font-weight: bold;
}
.color-buttons {
display: flex;
gap: 8px;
margin-bottom: 10px;
}
.color-btn {
width: 30px;
height: 30px;
border-radius: 50%;
border: 2px solid white;
cursor: pointer;
transition: all 0.3s;
}
.color-btn:active {
transform: scale(0.9);
}
.color-green { background: #00ff00; }
.color-red { background: #ff0000; }
.color-blue { background: #00ffff; }
.color-yellow { background: #ffff00; }
.color-white { background: #ffffff; }
.color-purple { background: #ff00ff; }
.size-buttons {
display: flex;
gap: 5px;
justify-content: center;
}
.size-btn {
background: rgba(255, 255, 255, 0.2);
border: 1px solid rgba(255, 255, 255, 0.3);
color: white;
padding: 5px 10px;
border-radius: 5px;
cursor: pointer;
font-size: 12px;
}
.size-btn:active {
background: rgba(255, 255, 255, 0.4);
}
/* Toggle button */
.toggle-btn {
position: fixed;
top: 20px;
right: 20px;
background: rgba(0, 0, 0, 0.8);
border-radius: 25px;
padding: 10px 20px;
pointer-events: auto;
z-index: 10000;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
color: #00ff00;
font-weight: bold;
cursor: pointer;
}
</style>
</head>
<body>
<!-- Overlay container -->
<div class="overlay-container" id="overlayContainer">
<div class="crosshair" id="crosshair">
<div class="circle-outer" id="circleOuter"></div>
<div class="circle-inner" id="circleInner"></div>
<div class="center-dot" id="centerDot"></div>
<div class="line-top" id="lineTop"></div>
<div class="line-bottom" id="lineBottom"></div>
<div class="line-left" id="lineLeft"></div>
<div class="line-right" id="lineRight"></div>
</div>
</div>
<!-- Toggle Button -->
<button class="toggle-btn" id="toggleBtn" onclick="toggleOverlay()">
🎯 Toggle AIM
</button>
<!-- Settings Panel -->
<div class="settings-panel" id="settingsPanel">
<div class="settings-title">⚙️ Cài đặt AIM</div>
<div class="color-buttons">
<div class="color-btn color-green" onclick="changeColor('#00ff00')"></div>
<div class="color-btn color-red" onclick="changeColor('#ff0000')"></div>
<div class="color-btn color-blue" onclick="changeColor('#00ffff')"></div>
<div class="color-btn color-yellow" onclick="changeColor('#ffff00')"></div>
<div class="color-btn color-white" onclick="changeColor('#ffffff')"></div>
<div class="color-btn color-purple" onclick="changeColor('#ff00ff')"></div>
</div>
<div class="size-buttons">
<button class="size-btn" onclick="changeSize('small')">Nhỏ</button>
<button class="size-btn" onclick="changeSize('medium')">Vừa</button>
<button class="size-btn" onclick="changeSize('large')">Lớn</button>
</div>
</div>
<script>
let isOverlayVisible = true;
let currentColor = '#00ff00';
let currentScale = 1;
// Toggle overlay visibility
function toggleOverlay() {
const overlay = document.getElementById('overlayContainer');
const btn = document.getElementById('toggleBtn');
if (isOverlayVisible) {
overlay.style.display = 'none';
btn.textContent = '🎯 Show AIM';
btn.style.color = '#ff0000';
} else {
overlay.style.display = 'block';
btn.textContent = '🎯 Toggle AIM';
btn.style.color = '#00ff00';
}
isOverlayVisible = !isOverlayVisible;
}
// Change color
function changeColor(color) {
currentColor = color;
const outerCircle = document.getElementById('circleOuter');
const innerCircle = document.getElementById('circleInner');
const centerDot = document.getElementById('centerDot');
const lines = document.querySelectorAll('[id^="line"]');
// Update outer circle
outerCircle.style.borderColor = color;
outerCircle.style.boxShadow = `
0 0 20px ${color}80,
0 0 40px ${color}40,
inset 0 0 20px ${color}30
`;
// Update inner circle
innerCircle.style.borderColor = color;
innerCircle.style.boxShadow = `0 0 15px ${color}60`;
// Update center dot
centerDot.style.backgroundColor = color;
centerDot.style.boxShadow = `0 0 10px ${color}`;
// Update lines
lines.forEach(line => {
line.style.backgroundColor = color;
line.style.boxShadow = `0 0 10px ${color}80`;
});
}
// Change size
function changeSize(size) {
const crosshair = document.getElementById('crosshair');
switch(size) {
case 'small':
currentScale = 0.7;
crosshair.style.transform = `translate(-50%, -50%) scale(0.7)`;
break;
case 'medium':
currentScale = 1;
crosshair.style.transform = `translate(-50%, -50%) scale(1)`;
break;
case 'large':
currentScale = 1.3;
crosshair.style.transform = `translate(-50%, -50%) scale(1.3)`;
break;
}
}
// Touch handling for iOS
let touchStartX = 0;
let touchStartY = 0;
let crosshairX = window.innerWidth / 2;
let crosshairY = window.innerHeight / 2;
let isDragging = false;
document.addEventListener('touchstart', (e) => {
if (e.target.closest('.settings-panel') || e.target.closest('.toggle-btn')) {
return;
}
isDragging = true;
touchStartX = e.touches[0].clientX;
touchStartY = e.touches[0].clientY;
// Store initial crosshair position
const crosshair = document.getElementById('crosshair');
const rect = crosshair.getBoundingClientRect();
crosshairX = rect.left + rect.width / 2;
crosshairY = rect.top + rect.height / 2;
});
document.addEventListener('touchmove', (e) => {
if (!isDragging) return;
e.preventDefault();
const touchX = e.touches[0].clientX;
const touchY = e.touches[0].clientY;
const deltaX = touchX - touchStartX;
const deltaY = touchY - touchStartY;
const newX = crosshairX + deltaX;
const newY = crosshairY + deltaY;
const crosshair = document.getElementById('crosshair');
crosshair.style.left = `${newX}px`;
crosshair.style.top = `${newY}px`;
crosshair.style.transform = `translate(-50%, -50%) scale(${currentScale})`;
});
document.addEventListener('touchend', () => {
isDragging = false;
});
// Mouse handling for testing in browser
document.addEventListener('mousedown', (e) => {
if (e.target.closest('.settings-panel') || e.target.closest('.toggle-btn')) {
return;
}
isDragging = true;
touchStartX = e.clientX;
touchStartY = e.clientY;
const crosshair = document.getElementById('crosshair');
const rect = crosshair.getBoundingClientRect();
crosshairX = rect.left + rect.width / 2;
crosshairY = rect.top + rect.height / 2;
});
document.addEventListener('mousemove', (e) => {
if (!isDragging) return;
const deltaX = e.clientX - touchStartX;
const deltaY = e.clientY - touchStartY;
const newX = crosshairX + deltaX;
const newY = crosshairY + deltaY;
const crosshair = document.getElementById('crosshair');
crosshair.style.left = `${newX}px`;
crosshair.style.top = `${newY}px`;
crosshair.style.transform = `translate(-50%, -50%) scale(${currentScale})`;
});
document.addEventListener('mouseup', () => {
isDragging = false;
});
// Initialize
window.addEventListener('load', () => {
// Set initial position to center
const crosshair = document.getElementById('crosshair');
crosshair.style.left = `${window.innerWidth / 2}px`;
crosshair.style.top = `${window.innerHeight / 2}px`;
});
// Handle orientation change
window.addEventListener('orientationchange', () => {
setTimeout(() => {
const crosshair = document.getElementById('crosshair');
crosshair.style.left = `${window.innerWidth / 2}px`;
crosshair.style.top = `${window.innerHeight / 2}px`;
}, 300);
});
// Prevent default touch behaviors
document.addEventListener('touchmove', (e) => {
if (isDragging) {
e.preventDefault();
}
}, { passive: false });
console.log('✅ AIM Free Fire iOS Overlay đã sẵn sàng!');
console.log('📱 Hướng dẫn sử dụng:');
console.log('1. Mở file trong Safari trên iOS');
console.log('2. Bấm nút Share > Add to Home Screen');
console.log('3. Mở app từ Home Screen');
console.log('4. Bật Guided Access để khóa màn hình');
console.log('5. Mở Free Fire và điều chỉnh AIM');
</script>
</body>
</html>
Your JavaScript
<!DOCTYPE html>
<html lang="vi">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<title>AIM Free Fire iOS - Custom Crosshair Overlay</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
background: transparent;
overflow: hidden;
height: 100vh;
width: 100vw;
position: fixed;
touch-action: none;
-webkit-touch-callout: none;
-webkit-user-select: none;
user-select: none;
}
/* Overlay container - trong suốt để hiển thị game phía sau */
.overlay-container {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 9999;
}
/* Crosshair chính */
.crosshair {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 120px;
height: 120px;
pointer-events: none;
}
/* Vòng tròn ngoài */
.circle-outer {
position: absolute;
width: 100%;
height: 100%;
border: 3px solid #00ff00;
border-radius: 50%;
box-shadow:
0 0 20px rgba(0, 255, 0, 0.8),
0 0 40px rgba(0, 255, 0, 0.4),
inset 0 0 20px rgba(0, 255, 0, 0.3);
animation: pulse-outer 2s ease-in-out infinite;
}
/* Vòng tròn trong */
.circle-inner {
position: absolute;
width: 30%;
height: 30%;
top: 35%;
left: 35%;
border: 2px solid #ff0000;
border-radius: 50%;
box-shadow: 0 0 15px rgba(255, 0, 0, 0.6);
animation: pulse-inner 1.5s ease-in-out infinite;
}
/* Điểm chấm trung tâm */
.center-dot {
position: absolute;
width: 6px;
height: 6px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: #ff0000;
border-radius: 50%;
box-shadow: 0 0 10px #ff0000;
}
/* 4 đường kẻ */
.line-top, .line-bottom, .line-left, .line-right {
position: absolute;
background: #00ff00;
box-shadow: 0 0 10px rgba(0, 255, 0, 0.8);
}
.line-top {
top: -25px;
left: 50%;
width: 2px;
height: 25px;
transform: translateX(-50%);
}
.line-bottom {
bottom: -25px;
left: 50%;
width: 2px;
height: 25px;
transform: translateX(-50%);
}
.line-left {
left: -25px;
top: 50%;
height: 2px;
width: 25px;
transform: translateY(-50%);
}
.line-right {
right: -25px;
top: 50%;
height: 2px;
width: 25px;
transform: translateY(-50%);
}
/* Hiệu ứng animations */
@keyframes pulse-outer {
0%, 100% {
transform: scale(1);
border-color: #00ff00;
}
50% {
transform: scale(1.05);
border-color: #00ffaa;
}
}
@keyframes pulse-inner {
0%, 100% {
transform: scale(1);
border-color: #ff0000;
}
50% {
transform: scale(1.15);
border-color: #ff4444;
}
}
/* Settings panel */
.settings-panel {
position: fixed;
bottom: 20px;
right: 20px;
background: rgba(0, 0, 0, 0.8);
border-radius: 15px;
padding: 15px;
pointer-events: auto;
z-index: 10000;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
}
.settings-title {
color: #00ff00;
font-size: 14px;
margin-bottom: 10px;
text-align: center;
font-weight: bold;
}
.color-buttons {
display: flex;
gap: 8px;
margin-bottom: 10px;
}
.color-btn {
width: 30px;
height: 30px;
border-radius: 50%;
border: 2px solid white;
cursor: pointer;
transition: all 0.3s;
}
.color-btn:active {
transform: scale(0.9);
}
.color-green { background: #00ff00; }
.color-red { background: #ff0000; }
.color-blue { background: #00ffff; }
.color-yellow { background: #ffff00; }
.color-white { background: #ffffff; }
.color-purple { background: #ff00ff; }
.size-buttons {
display: flex;
gap: 5px;
justify-content: center;
}
.size-btn {
background: rgba(255, 255, 255, 0.2);
border: 1px solid rgba(255, 255, 255, 0.3);
color: white;
padding: 5px 10px;
border-radius: 5px;
cursor: pointer;
font-size: 12px;
}
.size-btn:active {
background: rgba(255, 255, 255, 0.4);
}
/* Toggle button */
.toggle-btn {
position: fixed;
top: 20px;
right: 20px;
background: rgba(0, 0, 0, 0.8);
border-radius: 25px;
padding: 10px 20px;
pointer-events: auto;
z-index: 10000;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
color: #00ff00;
font-weight: bold;
cursor: pointer;
}
</style>
</head>
<body>
<!-- Overlay container -->
<div class="overlay-container" id="overlayContainer">
<div class="crosshair" id="crosshair">
<div class="circle-outer" id="circleOuter"></div>
<div class="circle-inner" id="circleInner"></div>
<div class="center-dot" id="centerDot"></div>
<div class="line-top" id="lineTop"></div>
<div class="line-bottom" id="lineBottom"></div>
<div class="line-left" id="lineLeft"></div>
<div class="line-right" id="lineRight"></div>
</div>
</div>
<!-- Toggle Button -->
<button class="toggle-btn" id="toggleBtn" onclick="toggleOverlay()">
🎯 Toggle AIM
</button>
<!-- Settings Panel -->
<div class="settings-panel" id="settingsPanel">
<div class="settings-title">⚙️ Cài đặt AIM</div>
<div class="color-buttons">
<div class="color-btn color-green" onclick="changeColor('#00ff00')"></div>
<div class="color-btn color-red" onclick="changeColor('#ff0000')"></div>
<div class="color-btn color-blue" onclick="changeColor('#00ffff')"></div>
<div class="color-btn color-yellow" onclick="changeColor('#ffff00')"></div>
<div class="color-btn color-white" onclick="changeColor('#ffffff')"></div>
<div class="color-btn color-purple" onclick="changeColor('#ff00ff')"></div>
</div>
<div class="size-buttons">
<button class="size-btn" onclick="changeSize('small')">Nhỏ</button>
<button class="size-btn" onclick="changeSize('medium')">Vừa</button>
<button class="size-btn" onclick="changeSize('large')">Lớn</button>
</div>
</div>
<script>
let isOverlayVisible = true;
let currentColor = '#00ff00';
let currentScale = 1;
// Toggle overlay visibility
function toggleOverlay() {
const overlay = document.getElementById('overlayContainer');
const btn = document.getElementById('toggleBtn');
if (isOverlayVisible) {
overlay.style.display = 'none';
btn.textContent = '🎯 Show AIM';
btn.style.color = '#ff0000';
} else {
overlay.style.display = 'block';
btn.textContent = '🎯 Toggle AIM';
btn.style.color = '#00ff00';
}
isOverlayVisible = !isOverlayVisible;
}
// Change color
function changeColor(color) {
currentColor = color;
const outerCircle = document.getElementById('circleOuter');
const innerCircle = document.getElementById('circleInner');
const centerDot = document.getElementById('centerDot');
const lines = document.querySelectorAll('[id^="line"]');
// Update outer circle
outerCircle.style.borderColor = color;
outerCircle.style.boxShadow = `
0 0 20px ${color}80,
0 0 40px ${color}40,
inset 0 0 20px ${color}30
`;
// Update inner circle
innerCircle.style.borderColor = color;
innerCircle.style.boxShadow = `0 0 15px ${color}60`;
// Update center dot
centerDot.style.backgroundColor = color;
centerDot.style.boxShadow = `0 0 10px ${color}`;
// Update lines
lines.forEach(line => {
line.style.backgroundColor = color;
line.style.boxShadow = `0 0 10px ${color}80`;
});
}
// Change size
function changeSize(size) {
const crosshair = document.getElementById('crosshair');
switch(size) {
case 'small':
currentScale = 0.7;
crosshair.style.transform = `translate(-50%, -50%) scale(0.7)`;
break;
case 'medium':
currentScale = 1;
crosshair.style.transform = `translate(-50%, -50%) scale(1)`;
break;
case 'large':
currentScale = 1.3;
crosshair.style.transform = `translate(-50%, -50%) scale(1.3)`;
break;
}
}
// Touch handling for iOS
let touchStartX = 0;
let touchStartY = 0;
let crosshairX = window.innerWidth / 2;
let crosshairY = window.innerHeight / 2;
let isDragging = false;
document.addEventListener('touchstart', (e) => {
if (e.target.closest('.settings-panel') || e.target.closest('.toggle-btn')) {
return;
}
isDragging = true;
touchStartX = e.touches[0].clientX;
touchStartY = e.touches[0].clientY;
// Store initial crosshair position
const crosshair = document.getElementById('crosshair');
const rect = crosshair.getBoundingClientRect();
crosshairX = rect.left + rect.width / 2;
crosshairY = rect.top + rect.height / 2;
});
document.addEventListener('touchmove', (e) => {
if (!isDragging) return;
e.preventDefault();
const touchX = e.touches[0].clientX;
const touchY = e.touches[0].clientY;
const deltaX = touchX - touchStartX;
const deltaY = touchY - touchStartY;
const newX = crosshairX + deltaX;
const newY = crosshairY + deltaY;
const crosshair = document.getElementById('crosshair');
crosshair.style.left = `${newX}px`;
crosshair.style.top = `${newY}px`;
crosshair.style.transform = `translate(-50%, -50%) scale(${currentScale})`;
});
document.addEventListener('touchend', () => {
isDragging = false;
});
// Mouse handling for testing in browser
document.addEventListener('mousedown', (e) => {
if (e.target.closest('.settings-panel') || e.target.closest('.toggle-btn')) {
return;
}
isDragging = true;
touchStartX = e.clientX;
touchStartY = e.clientY;
const crosshair = document.getElementById('crosshair');
const rect = crosshair.getBoundingClientRect();
crosshairX = rect.left + rect.width / 2;
crosshairY = rect.top + rect.height / 2;
});
document.addEventListener('mousemove', (e) => {
if (!isDragging) return;
const deltaX = e.clientX - touchStartX;
const deltaY = e.clientY - touchStartY;
const newX = crosshairX + deltaX;
const newY = crosshairY + deltaY;
const crosshair = document.getElementById('crosshair');
crosshair.style.left = `${newX}px`;
crosshair.style.top = `${newY}px`;
crosshair.style.transform = `translate(-50%, -50%) scale(${currentScale})`;
});
document.addEventListener('mouseup', () => {
isDragging = false;
});
// Initialize
window.addEventListener('load', () => {
// Set initial position to center
const crosshair = document.getElementById('crosshair');
crosshair.style.left = `${window.innerWidth / 2}px`;
crosshair.style.top = `${window.innerHeight / 2}px`;
});
// Handle orientation change
window.addEventListener('orientationchange', () => {
setTimeout(() => {
const crosshair = document.getElementById('crosshair');
crosshair.style.left = `${window.innerWidth / 2}px`;
crosshair.style.top = `${window.innerHeight / 2}px`;
}, 300);
});
// Prevent default touch behaviors
document.addEventListener('touchmove', (e) => {
if (isDragging) {
e.preventDefault();
}
}, { passive: false });
console.log('✅ AIM Free Fire iOS Overlay đã sẵn sàng!');
console.log('📱 Hướng dẫn sử dụng:');
console.log('1. Mở file trong Safari trên iOS');
console.log('2. Bấm nút Share > Add to Home Screen');
console.log('3. Mở app từ Home Screen');
console.log('4. Bật Guided Access để khóa màn hình');
console.log('5. Mở Free Fire và điều chỉnh AIM');
</script>
</body>
</html>
Your CSS
<!DOCTYPE html>
<html lang="vi">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<title>AIM Free Fire iOS - Custom Crosshair Overlay</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
background: transparent;
overflow: hidden;
height: 100vh;
width: 100vw;
position: fixed;
touch-action: none;
-webkit-touch-callout: none;
-webkit-user-select: none;
user-select: none;
}
/* Overlay container - trong suốt để hiển thị game phía sau */
.overlay-container {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 9999;
}
/* Crosshair chính */
.crosshair {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 120px;
height: 120px;
pointer-events: none;
}
/* Vòng tròn ngoài */
.circle-outer {
position: absolute;
width: 100%;
height: 100%;
border: 3px solid #00ff00;
border-radius: 50%;
box-shadow:
0 0 20px rgba(0, 255, 0, 0.8),
0 0 40px rgba(0, 255, 0, 0.4),
inset 0 0 20px rgba(0, 255, 0, 0.3);
animation: pulse-outer 2s ease-in-out infinite;
}
/* Vòng tròn trong */
.circle-inner {
position: absolute;
width: 30%;
height: 30%;
top: 35%;
left: 35%;
border: 2px solid #ff0000;
border-radius: 50%;
box-shadow: 0 0 15px rgba(255, 0, 0, 0.6);
animation: pulse-inner 1.5s ease-in-out infinite;
}
/* Điểm chấm trung tâm */
.center-dot {
position: absolute;
width: 6px;
height: 6px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: #ff0000;
border-radius: 50%;
box-shadow: 0 0 10px #ff0000;
}
/* 4 đường kẻ */
.line-top, .line-bottom, .line-left, .line-right {
position: absolute;
background: #00ff00;
box-shadow: 0 0 10px rgba(0, 255, 0, 0.8);
}
.line-top {
top: -25px;
left: 50%;
width: 2px;
height: 25px;
transform: translateX(-50%);
}
.line-bottom {
bottom: -25px;
left: 50%;
width: 2px;
height: 25px;
transform: translateX(-50%);
}
.line-left {
left: -25px;
top: 50%;
height: 2px;
width: 25px;
transform: translateY(-50%);
}
.line-right {
right: -25px;
top: 50%;
height: 2px;
width: 25px;
transform: translateY(-50%);
}
/* Hiệu ứng animations */
@keyframes pulse-outer {
0%, 100% {
transform: scale(1);
border-color: #00ff00;
}
50% {
transform: scale(1.05);
border-color: #00ffaa;
}
}
@keyframes pulse-inner {
0%, 100% {
transform: scale(1);
border-color: #ff0000;
}
50% {
transform: scale(1.15);
border-color: #ff4444;
}
}
/* Settings panel */
.settings-panel {
position: fixed;
bottom: 20px;
right: 20px;
background: rgba(0, 0, 0, 0.8);
border-radius: 15px;
padding: 15px;
pointer-events: auto;
z-index: 10000;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
}
.settings-title {
color: #00ff00;
font-size: 14px;
margin-bottom: 10px;
text-align: center;
font-weight: bold;
}
.color-buttons {
display: flex;
gap: 8px;
margin-bottom: 10px;
}
.color-btn {
width: 30px;
height: 30px;
border-radius: 50%;
border: 2px solid white;
cursor: pointer;
transition: all 0.3s;
}
.color-btn:active {
transform: scale(0.9);
}
.color-green { background: #00ff00; }
.color-red { background: #ff0000; }
.color-blue { background: #00ffff; }
.color-yellow { background: #ffff00; }
.color-white { background: #ffffff; }
.color-purple { background: #ff00ff; }
.size-buttons {
display: flex;
gap: 5px;
justify-content: center;
}
.size-btn {
background: rgba(255, 255, 255, 0.2);
border: 1px solid rgba(255, 255, 255, 0.3);
color: white;
padding: 5px 10px;
border-radius: 5px;
cursor: pointer;
font-size: 12px;
}
.size-btn:active {
background: rgba(255, 255, 255, 0.4);
}
/* Toggle button */
.toggle-btn {
position: fixed;
top: 20px;
right: 20px;
background: rgba(0, 0, 0, 0.8);
border-radius: 25px;
padding: 10px 20px;
pointer-events: auto;
z-index: 10000;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
color: #00ff00;
font-weight: bold;
cursor: pointer;
}
</style>
</head>
<body>
<!-- Overlay container -->
<div class="overlay-container" id="overlayContainer">
<div class="crosshair" id="crosshair">
<div class="circle-outer" id="circleOuter"></div>
<div class="circle-inner" id="circleInner"></div>
<div class="center-dot" id="centerDot"></div>
<div class="line-top" id="lineTop"></div>
<div class="line-bottom" id="lineBottom"></div>
<div class="line-left" id="lineLeft"></div>
<div class="line-right" id="lineRight"></div>
</div>
</div>
<!-- Toggle Button -->
<button class="toggle-btn" id="toggleBtn" onclick="toggleOverlay()">
🎯 Toggle AIM
</button>
<!-- Settings Panel -->
<div class="settings-panel" id="settingsPanel">
<div class="settings-title">⚙️ Cài đặt AIM</div>
<div class="color-buttons">
<div class="color-btn color-green" onclick="changeColor('#00ff00')"></div>
<div class="color-btn color-red" onclick="changeColor('#ff0000')"></div>
<div class="color-btn color-blue" onclick="changeColor('#00ffff')"></div>
<div class="color-btn color-yellow" onclick="changeColor('#ffff00')"></div>
<div class="color-btn color-white" onclick="changeColor('#ffffff')"></div>
<div class="color-btn color-purple" onclick="changeColor('#ff00ff')"></div>
</div>
<div class="size-buttons">
<button class="size-btn" onclick="changeSize('small')">Nhỏ</button>
<button class="size-btn" onclick="changeSize('medium')">Vừa</button>
<button class="size-btn" onclick="changeSize('large')">Lớn</button>
</div>
</div>
<script>
let isOverlayVisible = true;
let currentColor = '#00ff00';
let currentScale = 1;
// Toggle overlay visibility
function toggleOverlay() {
const overlay = document.getElementById('overlayContainer');
const btn = document.getElementById('toggleBtn');
if (isOverlayVisible) {
overlay.style.display = 'none';
btn.textContent = '🎯 Show AIM';
btn.style.color = '#ff0000';
} else {
overlay.style.display = 'block';
btn.textContent = '🎯 Toggle AIM';
btn.style.color = '#00ff00';
}
isOverlayVisible = !isOverlayVisible;
}
// Change color
function changeColor(color) {
currentColor = color;
const outerCircle = document.getElementById('circleOuter');
const innerCircle = document.getElementById('circleInner');
const centerDot = document.getElementById('centerDot');
const lines = document.querySelectorAll('[id^="line"]');
// Update outer circle
outerCircle.style.borderColor = color;
outerCircle.style.boxShadow = `
0 0 20px ${color}80,
0 0 40px ${color}40,
inset 0 0 20px ${color}30
`;
// Update inner circle
innerCircle.style.borderColor = color;
innerCircle.style.boxShadow = `0 0 15px ${color}60`;
// Update center dot
centerDot.style.backgroundColor = color;
centerDot.style.boxShadow = `0 0 10px ${color}`;
// Update lines
lines.forEach(line => {
line.style.backgroundColor = color;
line.style.boxShadow = `0 0 10px ${color}80`;
});
}
// Change size
function changeSize(size) {
const crosshair = document.getElementById('crosshair');
switch(size) {
case 'small':
currentScale = 0.7;
crosshair.style.transform = `translate(-50%, -50%) scale(0.7)`;
break;
case 'medium':
currentScale = 1;
crosshair.style.transform = `translate(-50%, -50%) scale(1)`;
break;
case 'large':
currentScale = 1.3;
crosshair.style.transform = `translate(-50%, -50%) scale(1.3)`;
break;
}
}
// Touch handling for iOS
let touchStartX = 0;
let touchStartY = 0;
let crosshairX = window.innerWidth / 2;
let crosshairY = window.innerHeight / 2;
let isDragging = false;
document.addEventListener('touchstart', (e) => {
if (e.target.closest('.settings-panel') || e.target.closest('.toggle-btn')) {
return;
}
isDragging = true;
touchStartX = e.touches[0].clientX;
touchStartY = e.touches[0].clientY;
// Store initial crosshair position
const crosshair = document.getElementById('crosshair');
const rect = crosshair.getBoundingClientRect();
crosshairX = rect.left + rect.width / 2;
crosshairY = rect.top + rect.height / 2;
});
document.addEventListener('touchmove', (e) => {
if (!isDragging) return;
e.preventDefault();
const touchX = e.touches[0].clientX;
const touchY = e.touches[0].clientY;
const deltaX = touchX - touchStartX;
const deltaY = touchY - touchStartY;
const newX = crosshairX + deltaX;
const newY = crosshairY + deltaY;
const crosshair = document.getElementById('crosshair');
crosshair.style.left = `${newX}px`;
crosshair.style.top = `${newY}px`;
crosshair.style.transform = `translate(-50%, -50%) scale(${currentScale})`;
});
document.addEventListener('touchend', () => {
isDragging = false;
});
// Mouse handling for testing in browser
document.addEventListener('mousedown', (e) => {
if (e.target.closest('.settings-panel') || e.target.closest('.toggle-btn')) {
return;
}
isDragging = true;
touchStartX = e.clientX;
touchStartY = e.clientY;
const crosshair = document.getElementById('crosshair');
const rect = crosshair.getBoundingClientRect();
crosshairX = rect.left + rect.width / 2;
crosshairY = rect.top + rect.height / 2;
});
document.addEventListener('mousemove', (e) => {
if (!isDragging) return;
const deltaX = e.clientX - touchStartX;
const deltaY = e.clientY - touchStartY;
const newX = crosshairX + deltaX;
const newY = crosshairY + deltaY;
const crosshair = document.getElementById('crosshair');
crosshair.style.left = `${newX}px`;
crosshair.style.top = `${newY}px`;
crosshair.style.transform = `translate(-50%, -50%) scale(${currentScale})`;
});
document.addEventListener('mouseup', () => {
isDragging = false;
});
// Initialize
window.addEventListener('load', () => {
// Set initial position to center
const crosshair = document.getElementById('crosshair');
crosshair.style.left = `${window.innerWidth / 2}px`;
crosshair.style.top = `${window.innerHeight / 2}px`;
});
// Handle orientation change
window.addEventListener('orientationchange', () => {
setTimeout(() => {
const crosshair = document.getElementById('crosshair');
crosshair.style.left = `${window.innerWidth / 2}px`;
crosshair.style.top = `${window.innerHeight / 2}px`;
}, 300);
});
// Prevent default touch behaviors
document.addEventListener('touchmove', (e) => {
if (isDragging) {
e.preventDefault();
}
}, { passive: false });
console.log('✅ AIM Free Fire iOS Overlay đã sẵn sàng!');
console.log('📱 Hướng dẫn sử dụng:');
console.log('1. Mở file trong Safari trên iOS');
console.log('2. Bấm nút Share > Add to Home Screen');
console.log('3. Mở app từ Home Screen');
console.log('4. Bật Guided Access để khóa màn hình');
console.log('5. Mở Free Fire và điều chỉnh AIM');
</script>
</body>
</html>
Error code
00.03.010
Were you logged in?
Yes
Your username (if logged in)
IAM
Your HTML
Your JavaScript
Your CSS