|
|
@@ -0,0 +1,2967 @@
|
|
|
+<script setup>
|
|
|
+import { ref, onMounted, onUnmounted } from 'vue';
|
|
|
+import { useRouter } from 'vue-router';
|
|
|
+import FloatingAds from '../components/FloatingAds.vue';
|
|
|
+import FakeDownload from '../components/FakeDownload.vue';
|
|
|
+import FakeNotifications from '../components/FakeNotifications.vue';
|
|
|
+
|
|
|
+const router = useRouter();
|
|
|
+
|
|
|
+// 恶搞状态管理
|
|
|
+const adPopups = ref([]);
|
|
|
+const popupCount = ref(0);
|
|
|
+const showMainAd = ref(false);
|
|
|
+const showOverlayAd = ref(false);
|
|
|
+const showFloatingAds = ref(false);
|
|
|
+const showFakeDownload = ref(false);
|
|
|
+const showNotifications = ref(false);
|
|
|
+const showVibrationAd = ref(false);
|
|
|
+const showFakeVirus = ref(false);
|
|
|
+const showFakeUpdate = ref(false);
|
|
|
+const isMouseTrapped = ref(false);
|
|
|
+const preventClose = ref(false);
|
|
|
+const audioContext = ref(null);
|
|
|
+const showLeaveDialog = ref(false); // 自定义离开确认对话框
|
|
|
+const showCustomNotification = ref(false); // 自定义通知
|
|
|
+const customNotificationMessage = ref(''); // 通知消息
|
|
|
+const showPrankDialog = ref(false); // 恶搞对话框
|
|
|
+const prankDialogContent = ref(''); // 恶搞对话框内容
|
|
|
+
|
|
|
+// 新增超级恶心功能状态
|
|
|
+const isUltraAnnoyingMode = ref(false); // 超级恶心模式
|
|
|
+const fakeCloseButtons = ref([]); // 假关闭按钮数组
|
|
|
+const movingElements = ref(false); // 移动界面元素
|
|
|
+const invertedControls = ref(false); // 反向控制
|
|
|
+const fakeLoadingScreen = ref(false); // 假加载界面
|
|
|
+const screenShake = ref(false); // 屏幕震动
|
|
|
+const rapidColorChange = ref(false); // 快速变色
|
|
|
+const annoyanceLevel = ref(1); // 恶心等级
|
|
|
+const popupBombingActive = ref(false); // 弹窗轰炸激活状态
|
|
|
+
|
|
|
+// 增强版恼人广告文本
|
|
|
+const ultraAnnoyingTexts = [
|
|
|
+ "🎪 恭喜！您已被永久绑定到广告宇宙！",
|
|
|
+ "🔄 正在安装999999个广告插件...",
|
|
|
+ "🎭 您的浏览器已被广告占领！",
|
|
|
+ "🚀 正在传送您到广告天堂...",
|
|
|
+ "🎨 您的屏幕已被广告病毒感染！",
|
|
|
+ "🎵 正在播放24小时不间断广告音乐...",
|
|
|
+ "🎪 您已成为永恒广告体验的志愿者！",
|
|
|
+ "🔮 广告系统正在读取您的购物欲望...",
|
|
|
+ "🎯 恭喜！您已被广告永久锁定！",
|
|
|
+ "🌟 您获得了终生广告观看资格！"
|
|
|
+];
|
|
|
+
|
|
|
+// 恶搞音效生成器
|
|
|
+const createAnnoyingSound = () => {
|
|
|
+ if (!audioContext.value) {
|
|
|
+ audioContext.value = new (window.AudioContext || window.webkitAudioContext)();
|
|
|
+ }
|
|
|
+
|
|
|
+ const oscillator = audioContext.value.createOscillator();
|
|
|
+ const gainNode = audioContext.value.createGain();
|
|
|
+
|
|
|
+ oscillator.connect(gainNode);
|
|
|
+ gainNode.connect(audioContext.value.destination);
|
|
|
+
|
|
|
+ // 制造恼人的蜂鸣声
|
|
|
+ oscillator.frequency.setValueAtTime(800, audioContext.value.currentTime);
|
|
|
+ oscillator.frequency.exponentialRampToValueAtTime(400, audioContext.value.currentTime + 0.1);
|
|
|
+
|
|
|
+ gainNode.gain.setValueAtTime(0.3, audioContext.value.currentTime);
|
|
|
+ gainNode.gain.exponentialRampToValueAtTime(0.01, audioContext.value.currentTime + 0.1);
|
|
|
+
|
|
|
+ oscillator.start();
|
|
|
+ oscillator.stop(audioContext.value.currentTime + 0.1);
|
|
|
+};
|
|
|
+
|
|
|
+// 创建恼人弹窗音效
|
|
|
+const createPopupSound = () => {
|
|
|
+ if (!audioContext.value) {
|
|
|
+ audioContext.value = new (window.AudioContext || window.webkitAudioContext)();
|
|
|
+ }
|
|
|
+
|
|
|
+ const oscillator = audioContext.value.createOscillator();
|
|
|
+ const gainNode = audioContext.value.createGain();
|
|
|
+
|
|
|
+ oscillator.connect(gainNode);
|
|
|
+ gainNode.connect(audioContext.value.destination);
|
|
|
+
|
|
|
+ oscillator.frequency.setValueAtTime(1000, audioContext.value.currentTime);
|
|
|
+ gainNode.gain.setValueAtTime(0.2, audioContext.value.currentTime);
|
|
|
+ gainNode.gain.exponentialRampToValueAtTime(0.01, audioContext.value.currentTime + 0.05);
|
|
|
+
|
|
|
+ oscillator.start();
|
|
|
+ oscillator.stop(audioContext.value.currentTime + 0.05);
|
|
|
+};
|
|
|
+
|
|
|
+// 自定义通知函数 - 替代alert
|
|
|
+const showCustomNotificationFn = (message) => {
|
|
|
+ customNotificationMessage.value = message;
|
|
|
+ showCustomNotification.value = true;
|
|
|
+ createAnnoyingSound();
|
|
|
+
|
|
|
+ // 3秒后自动关闭通知
|
|
|
+ setTimeout(() => {
|
|
|
+ showCustomNotification.value = false;
|
|
|
+ }, 3000);
|
|
|
+};
|
|
|
+
|
|
|
+// 自定义恶搞对话框 - 替代confirm
|
|
|
+const showPrankDialogFn = (content, callback = null) => {
|
|
|
+ prankDialogContent.value = content;
|
|
|
+ showPrankDialog.value = true;
|
|
|
+ createAnnoyingSound();
|
|
|
+
|
|
|
+ // 如果有回调函数，保存起来
|
|
|
+ if (callback) {
|
|
|
+ window.tempPrankCallback = callback;
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 关闭恶搞对话框
|
|
|
+const closePrankDialog = (choice = false) => {
|
|
|
+ showPrankDialog.value = false;
|
|
|
+
|
|
|
+ // 如果有回调函数，执行它
|
|
|
+ if (window.tempPrankCallback) {
|
|
|
+ window.tempPrankCallback(choice);
|
|
|
+ delete window.tempPrankCallback;
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 生成随机位置（确保弹窗不重叠）
|
|
|
+const getRandomPosition = () => {
|
|
|
+ const maxWidth = window.innerWidth - 300;
|
|
|
+ const maxHeight = window.innerHeight - 200;
|
|
|
+ return {
|
|
|
+ left: `${Math.random() * maxWidth}px`,
|
|
|
+ top: `${Math.random() * maxHeight}px`
|
|
|
+ };
|
|
|
+};
|
|
|
+
|
|
|
+// 创建超级恼人的弹窗
|
|
|
+const createAnnoyingPopup = () => {
|
|
|
+ const popup = {
|
|
|
+ id: Date.now() + Math.random(),
|
|
|
+ text: ultraAnnoyingTexts[Math.floor(Math.random() * ultraAnnoyingTexts.length)],
|
|
|
+ position: getRandomPosition(),
|
|
|
+ zIndex: 1000 + popupCount.value
|
|
|
+ };
|
|
|
+
|
|
|
+ adPopups.value.push(popup);
|
|
|
+ popupCount.value++;
|
|
|
+
|
|
|
+ // 播放恼人音效
|
|
|
+ createPopupSound();
|
|
|
+
|
|
|
+ // 让页面震动（如果支持）
|
|
|
+ if (navigator.vibrate) {
|
|
|
+ navigator.vibrate([100, 50, 100]);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 随机改变页面标题
|
|
|
+ const annoyingTitles = [
|
|
|
+ "🚨 紧急通知！",
|
|
|
+ "💰 恭喜中奖！",
|
|
|
+ "⚠️ 安全警告！",
|
|
|
+ "🎉 限时特价！",
|
|
|
+ "📱 系统通知",
|
|
|
+ "🔥 爆款推荐！"
|
|
|
+ ];
|
|
|
+ document.title = annoyingTitles[Math.floor(Math.random() * annoyingTitles.length)];
|
|
|
+};
|
|
|
+
|
|
|
+// 强制关闭弹窗（移除恶意阻拦行为）
|
|
|
+const closePopup = (id) => {
|
|
|
+ const popup = adPopups.value.find(p => p.id === id);
|
|
|
+
|
|
|
+ // 简化关闭逻辑，移除恶意阻拦
|
|
|
+ adPopups.value = adPopups.value.filter(popup => popup.id !== id);
|
|
|
+
|
|
|
+ // 关闭弹窗后偶尔创建一个新的（而不是两个）
|
|
|
+ if (Math.random() > 0.7 && adPopups.value.length < 3) {
|
|
|
+ setTimeout(() => {
|
|
|
+ createAnnoyingPopup();
|
|
|
+ }, 1000);
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 点击广告的恶搞行为
|
|
|
+const clickAd = () => {
|
|
|
+ createAnnoyingSound();
|
|
|
+
|
|
|
+ // 随机恶搞行为
|
|
|
+ const pranks = [
|
|
|
+ () => showCustomNotificationFn("恭喜！您已成功被骗！这是一个恶搞网站！😄"),
|
|
|
+ () => {
|
|
|
+ showCustomNotificationFn("正在为您下载1000个文件...");
|
|
|
+ showFakeDownload.value = true;
|
|
|
+ },
|
|
|
+ () => {
|
|
|
+ showCustomNotificationFn("检测到病毒！正在启动全盘扫描...");
|
|
|
+ showFakeVirus.value = true;
|
|
|
+ router.push('/virus');
|
|
|
+ },
|
|
|
+ () => {
|
|
|
+ showCustomNotificationFn("您的中奖信息已发送到火星！请等待外星人联系您！");
|
|
|
+ createMultiplePopups();
|
|
|
+ },
|
|
|
+ () => {
|
|
|
+ window.location.href = "https://www.youtube.com/watch?v=dQw4w9WgXcQ"; // Rick Roll
|
|
|
+ }
|
|
|
+ ];
|
|
|
+
|
|
|
+ const randomPrank = pranks[Math.floor(Math.random() * pranks.length)];
|
|
|
+ randomPrank();
|
|
|
+};
|
|
|
+
|
|
|
+// 创建多个弹窗轰炸（减少数量）
|
|
|
+const createMultiplePopups = () => {
|
|
|
+ // 减少弹窗数量从5个到3个
|
|
|
+ for (let i = 0; i < 3; i++) {
|
|
|
+ setTimeout(() => {
|
|
|
+ createAnnoyingPopup();
|
|
|
+ }, i * 500);
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 鼠标陷阱（鼠标移动到某些区域会触发弹窗）
|
|
|
+const handleMouseMove = (event) => {
|
|
|
+ if (isMouseTrapped.value && Math.random() > 0.98) {
|
|
|
+ createAnnoyingPopup();
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 阻止用户离开页面
|
|
|
+const blockPageLeave = (e) => {
|
|
|
+ e.preventDefault();
|
|
|
+ e.returnValue = '🎁 广告正在加载您的专属奖品！确定要离开吗？';
|
|
|
+ return '🎁 广告正在加载您的专属奖品！确定要离开吗？';
|
|
|
+};
|
|
|
+
|
|
|
+// 禁用各种快捷键
|
|
|
+const disableShortcuts = (e) => {
|
|
|
+ if (e.key === 'F12' ||
|
|
|
+ (e.ctrlKey && e.shiftKey && e.key === 'I') ||
|
|
|
+ (e.ctrlKey && e.key === 'u') ||
|
|
|
+ (e.ctrlKey && e.key === 'U') ||
|
|
|
+ (e.altKey && e.key === 'F4') ||
|
|
|
+ (e.ctrlKey && e.key === 'w') ||
|
|
|
+ (e.ctrlKey && e.key === 'W')) {
|
|
|
+ e.preventDefault();
|
|
|
+ showCustomNotificationFn('🚫 开发者工具已被广告商禁用！');
|
|
|
+ createAnnoyingSound();
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 禁用右键菜单
|
|
|
+const disableRightClick = (e) => {
|
|
|
+ e.preventDefault();
|
|
|
+ showCustomNotificationFn('🚫 右键功能已被广告保护！');
|
|
|
+ createAnnoyingSound();
|
|
|
+ return false;
|
|
|
+};
|
|
|
+
|
|
|
+// 检测页面失焦
|
|
|
+const handlePageBlur = () => {
|
|
|
+ showCustomNotificationFn('💰 检测到您想离开！广告正在为您计算奖金！');
|
|
|
+ window.focus();
|
|
|
+ createAnnoyingSound();
|
|
|
+};
|
|
|
+
|
|
|
+// 创建假关闭按钮
|
|
|
+const createFakeCloseButtons = () => {
|
|
|
+ for (let i = 0; i < 15; i++) {
|
|
|
+ fakeCloseButtons.value.push({
|
|
|
+ id: Date.now() + i,
|
|
|
+ x: Math.random() * (window.innerWidth - 60),
|
|
|
+ y: Math.random() * (window.innerHeight - 60),
|
|
|
+ clicked: false,
|
|
|
+ text: Math.random() > 0.5 ? '❌' : '🚪'
|
|
|
+ });
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 点击假关闭按钮
|
|
|
+const clickFakeCloseButton = (buttonId) => {
|
|
|
+ const button = fakeCloseButtons.value.find(b => b.id === buttonId);
|
|
|
+ if (button) {
|
|
|
+ button.clicked = true;
|
|
|
+ annoyanceLevel.value++;
|
|
|
+
|
|
|
+ showCustomNotificationFn("😈 这也是假的关闭按钮！广告等级提升！");
|
|
|
+ createAnnoyingSound();
|
|
|
+
|
|
|
+ // 创建更多假按钮
|
|
|
+ createFakeCloseButtons();
|
|
|
+
|
|
|
+ // 激活更多恶心功能
|
|
|
+ if (annoyanceLevel.value > 3) {
|
|
|
+ activateUltraAnnoyingMode();
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 激活超级恶心模式
|
|
|
+const activateUltraAnnoyingMode = () => {
|
|
|
+ isUltraAnnoyingMode.value = true;
|
|
|
+ showCustomNotificationFn("🎪 恭喜解锁超级广告轰炸模式！");
|
|
|
+
|
|
|
+ // 启动各种恶心效果
|
|
|
+ setTimeout(() => movingElements.value = true, 500);
|
|
|
+ setTimeout(() => invertedControls.value = true, 1000);
|
|
|
+ setTimeout(() => screenShake.value = true, 1500);
|
|
|
+ setTimeout(() => rapidColorChange.value = true, 2000);
|
|
|
+ setTimeout(() => popupBombingActive.value = true, 2500);
|
|
|
+
|
|
|
+ // 开始疯狂弹窗轰炸
|
|
|
+ startPopupBombing();
|
|
|
+
|
|
|
+ // 开始移动所有按钮
|
|
|
+ startMovingElements();
|
|
|
+};
|
|
|
+
|
|
|
+// 弹窗轰炸
|
|
|
+const startPopupBombing = () => {
|
|
|
+ if (popupBombingActive.value) {
|
|
|
+ setInterval(() => {
|
|
|
+ if (isUltraAnnoyingMode.value && adPopups.value.length < 10) {
|
|
|
+ for (let i = 0; i < 2; i++) {
|
|
|
+ setTimeout(() => {
|
|
|
+ createAnnoyingPopup();
|
|
|
+ }, i * 300);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }, 1500); // 更频繁的弹窗
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 移动元素功能
|
|
|
+const startMovingElements = () => {
|
|
|
+ setInterval(() => {
|
|
|
+ if (movingElements.value) {
|
|
|
+ // 让所有按钮随机移动位置
|
|
|
+ const buttons = document.querySelectorAll('.popup-btn, .mega-button, .overlay-btn');
|
|
|
+ buttons.forEach(button => {
|
|
|
+ if (Math.random() > 0.7) {
|
|
|
+ const randomX = (Math.random() - 0.5) * 100;
|
|
|
+ const randomY = (Math.random() - 0.5) * 100;
|
|
|
+ button.style.transform = `translate(${randomX}px, ${randomY}px) rotate(${Math.random() * 20 - 10}deg)`;
|
|
|
+
|
|
|
+ setTimeout(() => {
|
|
|
+ button.style.transform = 'none';
|
|
|
+ }, 2000);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }, 3000);
|
|
|
+};
|
|
|
+
|
|
|
+// 增强版继续恶搞体验
|
|
|
+const continueAnnoyingExperience = () => {
|
|
|
+ annoyanceLevel.value++;
|
|
|
+
|
|
|
+ // 根据点击次数增加恶心程度
|
|
|
+ if (annoyanceLevel.value <= 3) {
|
|
|
+ const fakeMessages = [
|
|
|
+ "🤡 想回去？你想多了！",
|
|
|
+ "😈 这里就是你的新家！",
|
|
|
+ "🎪 欢迎来到广告监狱！"
|
|
|
+ ];
|
|
|
+ showCustomNotificationFn(fakeMessages[annoyanceLevel.value - 1]);
|
|
|
+ } else if (annoyanceLevel.value <= 6) {
|
|
|
+ const escalationMessages = [
|
|
|
+ "🔥 广告强度正在飙升...",
|
|
|
+ "⚡ 系统正在释放更多广告能量...",
|
|
|
+ "🌪️ 广告风暴即将席卷而来..."
|
|
|
+ ];
|
|
|
+ showCustomNotificationFn(escalationMessages[annoyanceLevel.value - 4]);
|
|
|
+
|
|
|
+ // 开始移动界面元素
|
|
|
+ movingElements.value = true;
|
|
|
+ createFakeCloseButtons();
|
|
|
+ } else if (annoyanceLevel.value <= 10) {
|
|
|
+ showCustomNotificationFn("🚀 恭喜触发终极广告轰炸模式！");
|
|
|
+ activateUltraAnnoyingMode();
|
|
|
+
|
|
|
+ // 启动假加载
|
|
|
+ showFakeLoading();
|
|
|
+ } else {
|
|
|
+ // 超过10次点击，给假的"怜悯"选项
|
|
|
+ showPrankDialogFn(
|
|
|
+ '🙏 您已经尝试逃离了' + annoyanceLevel.value + '次！\n\n真的想显示离开选项吗？\n\n（提示：选"否"可能会更糟糕）',
|
|
|
+ (choice) => {
|
|
|
+ if (choice) {
|
|
|
+ // 即使用户选择"是"，也继续恶搞
|
|
|
+ setTimeout(() => {
|
|
|
+ showCustomNotificationFn("😈 刚才只是在测试您的耐心！广告继续！");
|
|
|
+ activateUltraAnnoyingMode();
|
|
|
+ createFakeCloseButtons();
|
|
|
+ }, 2000);
|
|
|
+ } else {
|
|
|
+ showCustomNotificationFn("🎉 您选择了继续广告体验！恶心等级MAX！");
|
|
|
+ annoyanceLevel.value = 999;
|
|
|
+ activateUltraAnnoyingMode();
|
|
|
+
|
|
|
+ // 疯狂轰炸
|
|
|
+ for (let i = 0; i < 5; i++) {
|
|
|
+ setTimeout(() => createAnnoyingPopup(), i * 1000);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ );
|
|
|
+ }
|
|
|
+
|
|
|
+ // 每次点击都触发更多恶搞内容
|
|
|
+ triggerPrankContent();
|
|
|
+ createAnnoyingSound();
|
|
|
+};
|
|
|
+
|
|
|
+// 触发恶搞内容
|
|
|
+const triggerPrankContent = () => {
|
|
|
+ const prankActions = [
|
|
|
+ () => createMultiplePopups(),
|
|
|
+ () => {
|
|
|
+ document.body.style.filter = 'hue-rotate(' + Math.random() * 360 + 'deg) brightness(' + (0.5 + Math.random()) + ')';
|
|
|
+ setTimeout(() => {
|
|
|
+ document.body.style.filter = 'none';
|
|
|
+ }, 3000);
|
|
|
+ },
|
|
|
+ () => {
|
|
|
+ document.body.style.transform = 'rotate(' + (Math.random() * 6 - 3) + 'deg) scale(' + (0.95 + Math.random() * 0.1) + ')';
|
|
|
+ setTimeout(() => {
|
|
|
+ document.body.style.transform = 'none';
|
|
|
+ }, 2000);
|
|
|
+ },
|
|
|
+ () => showFakeLoading(),
|
|
|
+ () => createFakeCloseButtons(),
|
|
|
+ () => {
|
|
|
+ // 让整个页面闪烁
|
|
|
+ document.body.style.opacity = '0.5';
|
|
|
+ setTimeout(() => {
|
|
|
+ document.body.style.opacity = '1';
|
|
|
+ }, 500);
|
|
|
+ }
|
|
|
+ ];
|
|
|
+
|
|
|
+ const randomAction = prankActions[Math.floor(Math.random() * prankActions.length)];
|
|
|
+ randomAction();
|
|
|
+};
|
|
|
+
|
|
|
+// 假加载屏幕
|
|
|
+const showFakeLoading = () => {
|
|
|
+ fakeLoadingScreen.value = true;
|
|
|
+ showCustomNotificationFn("正在连接广告母星...");
|
|
|
+
|
|
|
+ let progress = 0;
|
|
|
+ const loadingInterval = setInterval(() => {
|
|
|
+ progress += Math.random() * 3;
|
|
|
+ if (progress >= 99.8) {
|
|
|
+ progress = 99.8;
|
|
|
+ clearInterval(loadingInterval);
|
|
|
+
|
|
|
+ // 假装加载失败，然后重新开始
|
|
|
+ setTimeout(() => {
|
|
|
+ fakeLoadingScreen.value = false;
|
|
|
+ showCustomNotificationFn("连接失败！正在重新建立广告链接...");
|
|
|
+
|
|
|
+ // 重新开始假加载
|
|
|
+ setTimeout(() => {
|
|
|
+ if (isUltraAnnoyingMode.value) {
|
|
|
+ showFakeLoading();
|
|
|
+ }
|
|
|
+ }, 3000);
|
|
|
+ }, 5000);
|
|
|
+ }
|
|
|
+ }, 150);
|
|
|
+};
|
|
|
+
|
|
|
+// 生成随机访问者编号
|
|
|
+const getRandomVisitorNumber = () => {
|
|
|
+ return (1000000 + Math.floor(Math.random() * 1000)).toLocaleString();
|
|
|
+};
|
|
|
+
|
|
|
+// 生成随机倒计时
|
|
|
+const getRandomTime = () => {
|
|
|
+ const hours = Math.floor(Math.random() * 24).toString().padStart(2, '0');
|
|
|
+ const minutes = Math.floor(Math.random() * 60).toString().padStart(2, '0');
|
|
|
+ const seconds = Math.floor(Math.random() * 60).toString().padStart(2, '0');
|
|
|
+ return `${hours}:${minutes}:${seconds}`;
|
|
|
+};
|
|
|
+
|
|
|
+// 生成随机IP地址
|
|
|
+const getRandomIP = () => {
|
|
|
+ return `${Math.floor(Math.random() * 255)}.${Math.floor(Math.random() * 255)}.${Math.floor(Math.random() * 255)}.${Math.floor(Math.random() * 255)}`;
|
|
|
+};
|
|
|
+
|
|
|
+// 生成随机奖品价值
|
|
|
+const getRandomPrizeValue = () => {
|
|
|
+ return (Math.random() * 10000000 + 1000000).toFixed(0);
|
|
|
+};
|
|
|
+
|
|
|
+// 生成随机病毒数量
|
|
|
+const getRandomVirusCount = () => {
|
|
|
+ return Math.floor(Math.random() * 999) + 1;
|
|
|
+};
|
|
|
+
|
|
|
+// 显示自定义离开确认对话框
|
|
|
+const showCustomLeaveDialog = () => {
|
|
|
+ showLeaveDialog.value = true;
|
|
|
+ createAnnoyingSound();
|
|
|
+};
|
|
|
+
|
|
|
+// 用户确认离开
|
|
|
+const confirmLeave = () => {
|
|
|
+ const farewell = [
|
|
|
+ "👋 感谢体验恶搞广告！",
|
|
|
+ "💔 我们会想念您的！",
|
|
|
+ "🎭 希望您玩得开心！",
|
|
|
+ "🔄 随时欢迎回来继续恶搞！",
|
|
|
+ "😄 成功逃脱广告轰炸！"
|
|
|
+ ];
|
|
|
+
|
|
|
+ showCustomNotificationFn(farewell[Math.floor(Math.random() * farewell.length)]);
|
|
|
+ showLeaveDialog.value = false;
|
|
|
+
|
|
|
+ // 延迟跳转，让用户看到通知
|
|
|
+ setTimeout(() => {
|
|
|
+ router.push('/');
|
|
|
+ }, 1500);
|
|
|
+};
|
|
|
+
|
|
|
+// 用户选择继续留下
|
|
|
+const stayAndContinue = () => {
|
|
|
+ showLeaveDialog.value = false;
|
|
|
+ showCustomNotificationFn("🎉 明智的选择！广告轰炸继续！");
|
|
|
+
|
|
|
+ // 重新激活所有恶搞功能
|
|
|
+ showMainAd.value = true;
|
|
|
+ showOverlayAd.value = true;
|
|
|
+ createMultiplePopups();
|
|
|
+ createAnnoyingSound();
|
|
|
+};
|
|
|
+
|
|
|
+// 增强版恶搞轮盘
|
|
|
+const showLuckyWheel = ref(false);
|
|
|
+const wheelSpinning = ref(false);
|
|
|
+const wheelResult = ref('');
|
|
|
+const luckyWheelPrizes = [
|
|
|
+ '🎁 恭喜获得空气一份！',
|
|
|
+ '💰 恭喜获得梦想一个！',
|
|
|
+ '🏠 恭喜获得云彩别墅！',
|
|
|
+ '🚗 恭喜获得想象跑车！',
|
|
|
+ '💎 恭喜获得虚拟钻石！',
|
|
|
+ '🎪 恭喜获得永恒恶搞！',
|
|
|
+ '🎭 恭喜获得无限套路！',
|
|
|
+ '🎨 恭喜获得画饼技能！'
|
|
|
+];
|
|
|
+
|
|
|
+// 疯狂弹窗类型
|
|
|
+const popupTypes = [
|
|
|
+ 'urgent-winner', 'fake-security', 'celebrity-call', 'limited-time',
|
|
|
+ 'virus-warning', 'bank-notification', 'system-update', 'exclusive-offer',
|
|
|
+ 'friend-recommendation', 'government-notice', 'lucky-draw', 'prize-expired'
|
|
|
+];
|
|
|
+
|
|
|
+// 弹窗轰炸计数器
|
|
|
+const popupBombCount = ref(0);
|
|
|
+const maxPopups = ref(20); // 最大同时弹窗数
|
|
|
+
|
|
|
+// 创建疯狂弹窗
|
|
|
+const createCrazyPopup = (type = null) => {
|
|
|
+ if (adPopups.value.length >= maxPopups.value) {
|
|
|
+ // 如果达到最大数量，移除最老的弹窗
|
|
|
+ adPopups.value.shift();
|
|
|
+ }
|
|
|
+
|
|
|
+ const popupType = type || popupTypes[Math.floor(Math.random() * popupTypes.length)];
|
|
|
+ const popup = {
|
|
|
+ id: Date.now() + Math.random(),
|
|
|
+ type: popupType,
|
|
|
+ text: getCrazyPopupText(popupType),
|
|
|
+ position: getRandomPosition(),
|
|
|
+ zIndex: 1000 + popupCount.value,
|
|
|
+ isMoving: Math.random() > 0.7,
|
|
|
+ color: getRandomColor(),
|
|
|
+ size: Math.random() > 0.5 ? 'large' : 'normal'
|
|
|
+ };
|
|
|
+
|
|
|
+ adPopups.value.push(popup);
|
|
|
+ popupCount.value++;
|
|
|
+ popupBombCount.value++;
|
|
|
+
|
|
|
+ // 播放恼人音效
|
|
|
+ createPopupSound();
|
|
|
+
|
|
|
+ // 页面震动
|
|
|
+ if (navigator.vibrate) {
|
|
|
+ navigator.vibrate([100, 50, 100]);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 随机改变页面标题
|
|
|
+ updateAnnoyingTitle();
|
|
|
+};
|
|
|
+
|
|
|
+// 获取疯狂弹窗文本
|
|
|
+const getCrazyPopupText = (type) => {
|
|
|
+ const popupTexts = {
|
|
|
+ 'urgent-winner': [
|
|
|
+ '🚨 紧急通知：您是第99999位访客！立即领取999万！',
|
|
|
+ '⚠️ 警告：奖品库存仅剩1份！马上领取！',
|
|
|
+ '🔥 热烈祝贺：您被选为超级幸运用户！'
|
|
|
+ ],
|
|
|
+ 'fake-security': [
|
|
|
+ '🔒 安全提醒：检测到异常访问，请立即验证身份！',
|
|
|
+ '🛡️ 系统保护：为保护您的奖品，请完成安全认证！',
|
|
|
+ '⚡ 防护警告：发现可疑活动，请立即处理！'
|
|
|
+ ],
|
|
|
+ 'celebrity-call': [
|
|
|
+ '📞 马🐴来电：恭喜您中奖！请接听重要电话！',
|
|
|
+ '📱 雷🐯留言：我也是在这里发家致富的！',
|
|
|
+ '💬 刘🐧推荐：错过这次机会您会后悔终生！'
|
|
|
+ ],
|
|
|
+ 'limited-time': [
|
|
|
+ '⏰ 限时特价：仅剩3分59秒！错过再等100年！',
|
|
|
+ '⏳ 倒计时：距离活动结束还有2小时！',
|
|
|
+ '🕐 最后机会：优惠即将结束，立即行动！'
|
|
|
+ ],
|
|
|
+ 'virus-warning': [
|
|
|
+ '🦠 病毒警告：检测到恶意软件！立即下载杀毒软件！',
|
|
|
+ '⚠️ 安全威胁：您的电脑已被感染！马上清理！',
|
|
|
+ '🔥 紧急：发现木马病毒！点击立即清除！'
|
|
|
+ ],
|
|
|
+ 'bank-notification': [
|
|
|
+ '🏦 银行通知：您的账户有999万待入账！',
|
|
|
+ '💳 支付提醒：检测到大额转账，请确认身份！',
|
|
|
+ '💰 财务通知：您的投资已获得超额收益！'
|
|
|
+ ],
|
|
|
+ 'system-update': [
|
|
|
+ '🔄 系统更新：正在安装重要安全补丁...',
|
|
|
+ '⚙️ 程序升级：恶搞系统正在升级到2.0版本！',
|
|
|
+ '🔧 维护通知：系统将在5秒后重启！'
|
|
|
+ ],
|
|
|
+ 'exclusive-offer': [
|
|
|
+ '🎁 专属优惠：仅限今日！VIP会员免费升级！',
|
|
|
+ '⭐ 特别邀请：您已被选为内测用户！',
|
|
|
+ '🏆 独家福利：恭喜获得终身免费资格！'
|
|
|
+ ],
|
|
|
+ 'friend-recommendation': [
|
|
|
+ '👥 好友推荐：您的朋友李小明推荐您参加！',
|
|
|
+ '🤝 社交分享：已有10000+好友成功中奖！',
|
|
|
+ '💫 口碑推荐：99.9%用户都选择了我们！'
|
|
|
+ ],
|
|
|
+ 'government-notice': [
|
|
|
+ '🏛️ 官方通知：根据新政策，您有资格领取补贴！',
|
|
|
+ '📜 政府公告：恭喜您符合特殊奖励条件！',
|
|
|
+ '🎖️ 国家认证：您已获得官方认可资格！'
|
|
|
+ ],
|
|
|
+ 'lucky-draw': [
|
|
|
+ '🎰 幸运抽奖：恭喜您获得转盘机会！立即参与！',
|
|
|
+ '🎲 运气爆棚：今天是您的幸运日！',
|
|
|
+ '🌟 天选之子：您的运气值已达到MAX！'
|
|
|
+ ],
|
|
|
+ 'prize-expired': [
|
|
|
+ '⏰ 奖品到期：您的奖品将在60秒后作废！',
|
|
|
+ '🚨 紧急提醒：未领取的奖品即将清空！',
|
|
|
+ '⚠️ 最后通牒：过期奖品无法找回！'
|
|
|
+ ]
|
|
|
+ };
|
|
|
+
|
|
|
+ const texts = popupTexts[type] || popupTexts['urgent-winner'];
|
|
|
+ return texts[Math.floor(Math.random() * texts.length)];
|
|
|
+};
|
|
|
+
|
|
|
+// 获取随机颜色
|
|
|
+const getRandomColor = () => {
|
|
|
+ const colors = [
|
|
|
+ 'linear-gradient(45deg, #ff6b6b, #ee5a24)',
|
|
|
+ 'linear-gradient(45deg, #feca57, #ff9ff3)',
|
|
|
+ 'linear-gradient(45deg, #48dbfb, #0abde3)',
|
|
|
+ 'linear-gradient(45deg, #1dd1a1, #10ac84)',
|
|
|
+ 'linear-gradient(45deg, #a55eea, #8c7ae6)',
|
|
|
+ 'linear-gradient(45deg, #fd79a8, #e84393)',
|
|
|
+ 'linear-gradient(45deg, #fdcb6e, #e17055)',
|
|
|
+ 'linear-gradient(45deg, #6c5ce7, #a29bfe)'
|
|
|
+ ];
|
|
|
+ return colors[Math.floor(Math.random() * colors.length)];
|
|
|
+};
|
|
|
+
|
|
|
+// 更新恼人标题
|
|
|
+const updateAnnoyingTitle = () => {
|
|
|
+ const titles = [
|
|
|
+ '🚨 ' + popupBombCount.value + '个弹窗已激活！',
|
|
|
+ '🎪 恶搞进度：' + Math.min(popupBombCount.value * 5, 100) + '%',
|
|
|
+ '💥 弹窗轰炸中...请勿关闭！',
|
|
|
+ '🎯 您已被' + popupBombCount.value + '个广告锁定！',
|
|
|
+ '🔥 广告强度：' + Math.min(annoyanceLevel.value * 20, 100) + '%',
|
|
|
+ '⚡ 系统繁忙：处理中' + popupBombCount.value + '个任务',
|
|
|
+ '🌪️ 广告风暴等级：' + Math.min(Math.floor(popupBombCount.value / 5), 10)
|
|
|
+ ];
|
|
|
+ document.title = titles[Math.floor(Math.random() * titles.length)];
|
|
|
+};
|
|
|
+
|
|
|
+// 超级弹窗轰炸模式
|
|
|
+const activateSuperPopupBombing = () => {
|
|
|
+ showCustomNotificationFn("🎪 超级弹窗轰炸模式已激活！");
|
|
|
+
|
|
|
+ // 连续创建多个不同类型的弹窗
|
|
|
+ for (let i = 0; i < 5; i++) {
|
|
|
+ setTimeout(() => {
|
|
|
+ createCrazyPopup(popupTypes[i % popupTypes.length]);
|
|
|
+ }, i * 500);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 启动持续轰炸
|
|
|
+ const bombingInterval = setInterval(() => {
|
|
|
+ if (isUltraAnnoyingMode.value && adPopups.value.length < maxPopups.value) {
|
|
|
+ for (let i = 0; i < 3; i++) {
|
|
|
+ setTimeout(() => {
|
|
|
+ createCrazyPopup();
|
|
|
+ }, i * 200);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }, 2000);
|
|
|
+
|
|
|
+ // 30秒后减缓频率（但不停止）
|
|
|
+ setTimeout(() => {
|
|
|
+ clearInterval(bombingInterval);
|
|
|
+
|
|
|
+ // 启动温和一些的持续轰炸
|
|
|
+ setInterval(() => {
|
|
|
+ if (isUltraAnnoyingMode.value && Math.random() > 0.3) {
|
|
|
+ createCrazyPopup();
|
|
|
+ }
|
|
|
+ }, 3000);
|
|
|
+ }, 30000);
|
|
|
+};
|
|
|
+
|
|
|
+// 显示幸运转盘
|
|
|
+const showLuckyWheelPopup = () => {
|
|
|
+ showLuckyWheel.value = true;
|
|
|
+ showCustomNotificationFn("🎰 恭喜！您获得了专属转盘机会！");
|
|
|
+ createAnnoyingSound();
|
|
|
+};
|
|
|
+
|
|
|
+// 转动转盘
|
|
|
+const spinWheel = () => {
|
|
|
+ if (wheelSpinning.value) return;
|
|
|
+
|
|
|
+ wheelSpinning.value = true;
|
|
|
+ createAnnoyingSound();
|
|
|
+
|
|
|
+ // 模拟转盘旋转
|
|
|
+ setTimeout(() => {
|
|
|
+ wheelSpinning.value = false;
|
|
|
+ wheelResult.value = luckyWheelPrizes[Math.floor(Math.random() * luckyWheelPrizes.length)];
|
|
|
+
|
|
|
+ // 显示中奖结果
|
|
|
+ setTimeout(() => {
|
|
|
+ showCustomNotificationFn(`🎉 转盘结果：${wheelResult.value}`);
|
|
|
+
|
|
|
+ // 继续恶搞 - 要求再次转盘
|
|
|
+ setTimeout(() => {
|
|
|
+ showCustomNotificationFn("✨ 再转一次可获得更大奖品！");
|
|
|
+ activateSuperPopupBombing(); // 激活超级弹窗轰炸
|
|
|
+ }, 2000);
|
|
|
+ }, 1000);
|
|
|
+ }, 3000);
|
|
|
+};
|
|
|
+
|
|
|
+// 关闭幸运转盘（假的）
|
|
|
+const closeLuckyWheel = () => {
|
|
|
+ // 假装关闭，实际上创建更多弹窗
|
|
|
+ showLuckyWheel.value = false;
|
|
|
+ showCustomNotificationFn("🎪 关闭转盘？那就来更多弹窗吧！");
|
|
|
+ activateSuperPopupBombing();
|
|
|
+};
|
|
|
+
|
|
|
+// 增强版触发随机恶搞内容
|
|
|
+const triggerRandomPrankContent = () => {
|
|
|
+ const prankActions = [
|
|
|
+ () => createCrazyPopup('urgent-winner'),
|
|
|
+ () => createCrazyPopup('fake-security'),
|
|
|
+ () => createCrazyPopup('celebrity-call'),
|
|
|
+ () => showLuckyWheelPopup(),
|
|
|
+ () => activateSuperPopupBombing(),
|
|
|
+ () => {
|
|
|
+ // 创建多个假关闭按钮
|
|
|
+ for (let i = 0; i < 10; i++) {
|
|
|
+ fakeCloseButtons.value.push({
|
|
|
+ id: Date.now() + i + Math.random(),
|
|
|
+ x: Math.random() * (window.innerWidth - 50),
|
|
|
+ y: Math.random() * (window.innerHeight - 50),
|
|
|
+ text: ['❌', '✕', '×', '✖', '⨯'][Math.floor(Math.random() * 5)],
|
|
|
+ clicked: false
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ () => {
|
|
|
+ // 疯狂改变页面样式
|
|
|
+ document.body.style.filter = `hue-rotate(${Math.random() * 360}deg) saturate(${1 + Math.random() * 2}) brightness(${0.5 + Math.random()})`;
|
|
|
+ setTimeout(() => {
|
|
|
+ document.body.style.filter = 'none';
|
|
|
+ }, 3000);
|
|
|
+ },
|
|
|
+ () => {
|
|
|
+ // 创建虚假系统消息
|
|
|
+ const systemMessages = [
|
|
|
+ 'Windows正在下载更新... 99%',
|
|
|
+ '系统即将重启以安装更新',
|
|
|
+ '检测到病毒，正在清理中...',
|
|
|
+ '内存不足，建议关闭其他程序',
|
|
|
+ 'CPU使用率过高，系统运行缓慢'
|
|
|
+ ];
|
|
|
+ showCustomNotificationFn(systemMessages[Math.floor(Math.random() * systemMessages.length)]);
|
|
|
+ }
|
|
|
+ ];
|
|
|
+
|
|
|
+ // 随机执行1-3个恶搞动作
|
|
|
+ const actionCount = Math.floor(Math.random() * 3) + 1;
|
|
|
+ for (let i = 0; i < actionCount; i++) {
|
|
|
+ setTimeout(() => {
|
|
|
+ const randomAction = prankActions[Math.floor(Math.random() * prankActions.length)];
|
|
|
+ randomAction();
|
|
|
+ }, i * 1000);
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+onMounted(() => {
|
|
|
+ // 立即显示主广告
|
|
|
+ setTimeout(() => {
|
|
|
+ showMainAd.value = true;
|
|
|
+ createAnnoyingSound();
|
|
|
+ }, 500);
|
|
|
+
|
|
|
+ // 减缓弹窗轰炸频率 - 从1.5秒改为3秒
|
|
|
+ const popupInterval = setInterval(() => {
|
|
|
+ // 限制最大弹窗数量
|
|
|
+ if (adPopups.value.length < 5) {
|
|
|
+ createAnnoyingPopup();
|
|
|
+ }
|
|
|
+ }, 3000);
|
|
|
+
|
|
|
+ // 显示各种恶搞组件
|
|
|
+ setTimeout(() => showFloatingAds.value = true, 2000);
|
|
|
+ setTimeout(() => showOverlayAd.value = true, 5000);
|
|
|
+ setTimeout(() => showNotifications.value = true, 3000);
|
|
|
+
|
|
|
+ // 激活鼠标陷阱
|
|
|
+ setTimeout(() => {
|
|
|
+ isMouseTrapped.value = true;
|
|
|
+ }, 3000);
|
|
|
+
|
|
|
+ // 立即创建假关闭按钮
|
|
|
+ createFakeCloseButtons();
|
|
|
+
|
|
|
+ // 每5秒随机播放恶心音效
|
|
|
+ setInterval(() => {
|
|
|
+ if (Math.random() > 0.6) {
|
|
|
+ createAnnoyingSound();
|
|
|
+ }
|
|
|
+ }, 5000);
|
|
|
+
|
|
|
+ // 每3秒随机更改页面标题
|
|
|
+ const annoyingTitles = [
|
|
|
+ '🎉 恭喜中奖！点击领取百万大奖！',
|
|
|
+ '⚠️ 您的电脑已被感染！立即清理！',
|
|
|
+ '💰 限时优惠！错过再等100年！',
|
|
|
+ '🚨 系统警告！请勿关闭此页面！',
|
|
|
+ '🎁 免费iPhone等你来拿！',
|
|
|
+ '⭐ 广告宇宙欢迎您的到来！',
|
|
|
+ '🔥 热门！单身美女等你聊天！',
|
|
|
+ '💎 钻石会员专属特权！'
|
|
|
+ ];
|
|
|
+
|
|
|
+ setInterval(() => {
|
|
|
+ const randomTitle = annoyingTitles[Math.floor(Math.random() * annoyingTitles.length)];
|
|
|
+ document.title = randomTitle;
|
|
|
+ }, 3000);
|
|
|
+
|
|
|
+ // 监控用户行为，恶心等级达到5时激活超级恶心模式
|
|
|
+ setInterval(() => {
|
|
|
+ if (annoyanceLevel.value >= 5 && !isUltraAnnoyingMode.value) {
|
|
|
+ activateUltraAnnoyingMode();
|
|
|
+ }
|
|
|
+
|
|
|
+ // 如果处于超级恶心模式，随机触发恶搞内容
|
|
|
+ if (isUltraAnnoyingMode.value && Math.random() > 0.7) {
|
|
|
+ triggerPrankContent();
|
|
|
+ }
|
|
|
+ }, 2000);
|
|
|
+
|
|
|
+ // 每15秒自动增加恶心等级（最大10级）
|
|
|
+ setInterval(() => {
|
|
|
+ if (annoyanceLevel.value < 10) {
|
|
|
+ annoyanceLevel.value++;
|
|
|
+ showCustomNotificationFn(`广告恶心等级提升至 ${annoyanceLevel.value} 级！`);
|
|
|
+ }
|
|
|
+ }, 15000);
|
|
|
+
|
|
|
+ // 添加键盘和右键限制（保留恶搞效果）
|
|
|
+ document.addEventListener('mousemove', handleMouseMove);
|
|
|
+ document.addEventListener('contextmenu', disableRightClick);
|
|
|
+ document.addEventListener('keydown', disableShortcuts);
|
|
|
+
|
|
|
+ // 禁用键盘快捷键，包括F5刷新、Ctrl+W关闭等
|
|
|
+ document.addEventListener('keydown', (e) => {
|
|
|
+ // 禁用F5刷新
|
|
|
+ if (e.key === 'F5') {
|
|
|
+ e.preventDefault();
|
|
|
+ showCustomNotificationFn('刷新功能已被广告系统锁定！');
|
|
|
+ createAnnoyingSound();
|
|
|
+ }
|
|
|
+
|
|
|
+ // 禁用Ctrl+W关闭窗口
|
|
|
+ if (e.ctrlKey && e.key === 'w') {
|
|
|
+ e.preventDefault();
|
|
|
+ showCustomNotificationFn('关闭功能已被广告系统接管！');
|
|
|
+ createAnnoyingSound();
|
|
|
+ }
|
|
|
+
|
|
|
+ // 禁用Alt+F4
|
|
|
+ if (e.altKey && e.key === 'F4') {
|
|
|
+ e.preventDefault();
|
|
|
+ showCustomNotificationFn('Alt+F4已被广告系统屏蔽！');
|
|
|
+ createAnnoyingSound();
|
|
|
+ }
|
|
|
+
|
|
|
+ // 禁用Ctrl+T新建标签页
|
|
|
+ if (e.ctrlKey && e.key === 't') {
|
|
|
+ e.preventDefault();
|
|
|
+ showCustomNotificationFn('新建标签页功能已被锁定！');
|
|
|
+ }
|
|
|
+
|
|
|
+ // 禁用Escape键
|
|
|
+ if (e.key === 'Escape') {
|
|
|
+ e.preventDefault();
|
|
|
+ showCustomNotificationFn('Escape键在广告宇宙中无效！');
|
|
|
+ createAnnoyingSound();
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ // 定时改变背景颜色制造闪烁效果
|
|
|
+ const colorInterval = setInterval(() => {
|
|
|
+ const colors = ['#ff6b6b', '#4ecdc4', '#45b7d1', '#96ceb4', '#ffeaa7'];
|
|
|
+ document.body.style.backgroundColor = colors[Math.floor(Math.random() * colors.length)];
|
|
|
+ }, 3000);
|
|
|
+
|
|
|
+ // 页面加载完成后开始持续的音效骚扰（减少频率）
|
|
|
+ setTimeout(() => {
|
|
|
+ const soundInterval = setInterval(() => {
|
|
|
+ if (Math.random() > 0.8) { // 从0.7改为0.8，减少音效频率
|
|
|
+ createAnnoyingSound();
|
|
|
+ }
|
|
|
+ }, 8000); // 从5秒改为8秒
|
|
|
+ }, 10000);
|
|
|
+
|
|
|
+ // 监控页面失焦事件（用户试图离开）
|
|
|
+ window.addEventListener('blur', () => {
|
|
|
+ if (isUltraAnnoyingMode.value) {
|
|
|
+ showCustomNotificationFn('想逃跑？门都没有！');
|
|
|
+ createAnnoyingSound();
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ // 20秒后随机显示假加载屏幕
|
|
|
+ setTimeout(() => {
|
|
|
+ if (Math.random() > 0.5) {
|
|
|
+ showFakeLoading();
|
|
|
+ }
|
|
|
+ }, 20000);
|
|
|
+
|
|
|
+ // 开始监控鼠标移动（反向控制）
|
|
|
+ if (invertedControls.value) {
|
|
|
+ document.addEventListener('mousemove', (e) => {
|
|
|
+ if (invertedControls.value) {
|
|
|
+ // 反向鼠标控制
|
|
|
+ const invertedX = window.innerWidth - e.clientX;
|
|
|
+ const invertedY = window.innerHeight - e.clientY;
|
|
|
+
|
|
|
+ // 创建虚假光标指示器
|
|
|
+ let fakeCursor = document.getElementById('fake-cursor');
|
|
|
+ if (!fakeCursor) {
|
|
|
+ fakeCursor = document.createElement('div');
|
|
|
+ fakeCursor.id = 'fake-cursor';
|
|
|
+ fakeCursor.style.cssText = `
|
|
|
+ position: fixed;
|
|
|
+ width: 20px;
|
|
|
+ height: 20px;
|
|
|
+ background: red;
|
|
|
+ border-radius: 50%;
|
|
|
+ pointer-events: none;
|
|
|
+ z-index: 10000;
|
|
|
+ transition: all 0.1s ease;
|
|
|
+ `;
|
|
|
+ document.body.appendChild(fakeCursor);
|
|
|
+ }
|
|
|
+
|
|
|
+ fakeCursor.style.left = invertedX + 'px';
|
|
|
+ fakeCursor.style.top = invertedY + 'px';
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ // 添加页面失焦处理
|
|
|
+ window.addEventListener('blur', handlePageBlur);
|
|
|
+});
|
|
|
+
|
|
|
+onUnmounted(() => {
|
|
|
+ // 清理事件监听器
|
|
|
+ document.removeEventListener('mousemove', handleMouseMove);
|
|
|
+ // 移除页面离开阻拦
|
|
|
+ // window.removeEventListener('beforeunload', blockPageLeave);
|
|
|
+ document.removeEventListener('contextmenu', disableRightClick);
|
|
|
+ document.removeEventListener('keydown', disableShortcuts);
|
|
|
+
|
|
|
+ // 移除页面失焦处理
|
|
|
+ window.removeEventListener('blur', handlePageBlur);
|
|
|
+});
|
|
|
+
|
|
|
+// 获取弹窗标题
|
|
|
+const getPopupTitle = (type) => {
|
|
|
+ const titles = {
|
|
|
+ 'urgent-winner': '🚨 紧急通知',
|
|
|
+ 'fake-security': '🔒 安全提醒',
|
|
|
+ 'celebrity-call': '📞 马🐴来电',
|
|
|
+ 'limited-time': '⏰ 限时特价',
|
|
|
+ 'virus-warning': '🦠 病毒警告',
|
|
|
+ 'bank-notification': '🏦 银行通知',
|
|
|
+ 'system-update': '🔄 系统更新',
|
|
|
+ 'exclusive-offer': '🎁 专属优惠',
|
|
|
+ 'friend-recommendation': '👥 好友推荐',
|
|
|
+ 'government-notice': '🏛️ 官方通知',
|
|
|
+ 'lucky-draw': '🎰 幸运抽奖',
|
|
|
+ 'prize-expired': '⏰ 奖品到期'
|
|
|
+ };
|
|
|
+ return titles[type] || titles['urgent-winner'];
|
|
|
+};
|
|
|
+
|
|
|
+// 获取弹窗图标
|
|
|
+const getPopupIcon = (type) => {
|
|
|
+ const icons = {
|
|
|
+ 'urgent-winner': '🏆',
|
|
|
+ 'fake-security': '🔒',
|
|
|
+ 'celebrity-call': '📞',
|
|
|
+ 'limited-time': '⏰',
|
|
|
+ 'virus-warning': '🦠',
|
|
|
+ 'bank-notification': '🏦',
|
|
|
+ 'system-update': '🔄',
|
|
|
+ 'exclusive-offer': '🎁',
|
|
|
+ 'friend-recommendation': '👥',
|
|
|
+ 'government-notice': '🏛️',
|
|
|
+ 'lucky-draw': '🎰',
|
|
|
+ 'prize-expired': '⏰'
|
|
|
+ };
|
|
|
+ return icons[type] || icons['urgent-winner'];
|
|
|
+};
|
|
|
+
|
|
|
+// 获取按钮文本
|
|
|
+const getActionButtonText = (type) => {
|
|
|
+ const texts = {
|
|
|
+ 'urgent-winner': '🏆 立即领取',
|
|
|
+ 'fake-security': '🔒 立即验证',
|
|
|
+ 'celebrity-call': '📞 接听电话',
|
|
|
+ 'limited-time': '🕐 立即行动',
|
|
|
+ 'virus-warning': '🦠 立即下载',
|
|
|
+ 'bank-notification': '🏦 立即转账',
|
|
|
+ 'system-update': '🔄 立即更新',
|
|
|
+ 'exclusive-offer': '🎁 VIP升级',
|
|
|
+ 'friend-recommendation': '👥 推荐好友',
|
|
|
+ 'government-notice': '🏛️ 领取补贴',
|
|
|
+ 'lucky-draw': '🎰 参与抽奖',
|
|
|
+ 'prize-expired': '⚡ 紧急领取'
|
|
|
+ };
|
|
|
+ return texts[type] || texts['urgent-winner'];
|
|
|
+};
|
|
|
+
|
|
|
+// 获取倒计时
|
|
|
+const getFakeCountdown = () => {
|
|
|
+ const now = new Date().getTime();
|
|
|
+ const end = new Date(now + 1000 * 60 * 60 * 24).getTime();
|
|
|
+ const diff = end - now;
|
|
|
+ const days = Math.floor(diff / (1000 * 60 * 60 * 24));
|
|
|
+ const hours = Math.floor((diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
|
|
|
+ const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
|
|
|
+ const seconds = Math.floor((diff % (1000 * 60)) / 1000);
|
|
|
+ return `${days}天 ${hours}小时 ${minutes}分钟 ${seconds}秒`;
|
|
|
+};
|
|
|
+
|
|
|
+// 处理弹窗操作
|
|
|
+const handlePopupAction = (popup) => {
|
|
|
+ switch (popup.type) {
|
|
|
+ case 'urgent-winner':
|
|
|
+ activateSuperPopupBombing();
|
|
|
+ break;
|
|
|
+ case 'fake-security':
|
|
|
+ createCrazyPopup('virus-warning');
|
|
|
+ break;
|
|
|
+ case 'celebrity-call':
|
|
|
+ createCrazyPopup('government-notice');
|
|
|
+ break;
|
|
|
+ case 'lucky-draw':
|
|
|
+ showLuckyWheelPopup();
|
|
|
+ break;
|
|
|
+ case 'prize-expired':
|
|
|
+ triggerRandomPrankContent();
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ // 处理其他类型的弹窗操作
|
|
|
+ break;
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<template>
|
|
|
+ <div class="fake-ad-container">
|
|
|
+ <!-- 恶搞头部 -->
|
|
|
+ <div class="header">
|
|
|
+ <button
|
|
|
+ class="back-btn"
|
|
|
+ @click="continueAnnoyingExperience"
|
|
|
+ :class="{ 'moving': movingElements, 'shake': screenShake }"
|
|
|
+ >
|
|
|
+ 继续体验
|
|
|
+ </button>
|
|
|
+ <div class="annoying-banner">
|
|
|
+ <span class="blink-text">🔥 超级特价！今日限时！🔥</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 大量假关闭按钮 -->
|
|
|
+ <div
|
|
|
+ v-for="btn in fakeCloseButtons"
|
|
|
+ :key="btn.id"
|
|
|
+ class="scattered-fake-button"
|
|
|
+ :style="{ left: btn.x + 'px', top: btn.y + 'px' }"
|
|
|
+ @click="clickFakeCloseButton(btn.id)"
|
|
|
+ :class="{ 'clicked': btn.clicked, 'moving': movingElements }"
|
|
|
+ >
|
|
|
+ {{ btn.text }}
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 假加载屏幕 -->
|
|
|
+ <div v-if="fakeLoadingScreen" class="fake-loading-overlay">
|
|
|
+ <div class="fake-loading-content">
|
|
|
+ <div class="loading-spinner"></div>
|
|
|
+ <h2>🎪 广告系统升级中...</h2>
|
|
|
+ <div class="loading-bar">
|
|
|
+ <div class="loading-progress"></div>
|
|
|
+ </div>
|
|
|
+ <p class="loading-text">正在下载更多广告内容... 99.8%</p>
|
|
|
+ <p class="loading-subtext">⚠️ 请勿离开，广告即将变得更精彩！</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 超级恶心模式指示器 -->
|
|
|
+ <div v-if="isUltraAnnoyingMode" class="ultra-mode-indicator">
|
|
|
+ <div class="mode-badge">🎪 超级广告模式已激活</div>
|
|
|
+ <div class="annoyance-meter">
|
|
|
+ <div class="meter-fill" :style="{ width: Math.min(annoyanceLevel * 10, 100) + '%' }"></div>
|
|
|
+ <span class="meter-text">恶心等级: {{ annoyanceLevel }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 移动的恶搞文本 -->
|
|
|
+ <div v-if="movingElements" class="moving-text-container">
|
|
|
+ <div class="moving-text" v-for="n in 6" :key="n">
|
|
|
+ 🎭 您已被广告永久绑定！
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 背景恶搞效果 -->
|
|
|
+ <div class="background-effects">
|
|
|
+ <div class="floating-money">💰</div>
|
|
|
+ <div class="floating-money">💎</div>
|
|
|
+ <div class="floating-money">🎁</div>
|
|
|
+ <div class="floating-money">🎉</div>
|
|
|
+ <div class="floating-money">💸</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 弹窗容器 -->
|
|
|
+ <div class="popup-container">
|
|
|
+ <div
|
|
|
+ v-for="popup in adPopups"
|
|
|
+ :key="popup.id"
|
|
|
+ class="ad-popup crazy-popup"
|
|
|
+ :class="[
|
|
|
+ `popup-${popup.type}`,
|
|
|
+ `popup-${popup.size}`,
|
|
|
+ { 'moving-popup': popup.isMoving }
|
|
|
+ ]"
|
|
|
+ :style="{
|
|
|
+ left: popup.position.left,
|
|
|
+ top: popup.position.top,
|
|
|
+ zIndex: popup.zIndex,
|
|
|
+ background: popup.color
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ <div class="popup-header crazy-header">
|
|
|
+ <span class="popup-title" v-html="getPopupTitle(popup.type)"></span>
|
|
|
+ <div class="fake-controls">
|
|
|
+ <span class="fake-minimize">➖</span>
|
|
|
+ <span class="fake-maximize">⬜</span>
|
|
|
+ <button
|
|
|
+ class="close-btn crazy-close"
|
|
|
+ @click="closePopup(popup.id)"
|
|
|
+ title="关闭弹窗"
|
|
|
+ >
|
|
|
+ ❌
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="popup-body crazy-body">
|
|
|
+ <div class="popup-icon" v-html="getPopupIcon(popup.type)"></div>
|
|
|
+ <div class="popup-text" v-html="popup.text"></div>
|
|
|
+
|
|
|
+ <!-- 根据弹窗类型显示不同按钮 -->
|
|
|
+ <div class="popup-actions">
|
|
|
+ <button
|
|
|
+ v-if="popup.type === 'urgent-winner'"
|
|
|
+ class="action-btn winner-btn"
|
|
|
+ @click="activateSuperPopupBombing"
|
|
|
+ >
|
|
|
+ 🏆 立即领取
|
|
|
+ </button>
|
|
|
+
|
|
|
+ <button
|
|
|
+ v-if="popup.type === 'fake-security'"
|
|
|
+ class="action-btn security-btn"
|
|
|
+ @click="createCrazyPopup('virus-warning')"
|
|
|
+ >
|
|
|
+ 🔒 立即验证
|
|
|
+ </button>
|
|
|
+
|
|
|
+ <button
|
|
|
+ v-if="popup.type === 'celebrity-call'"
|
|
|
+ class="action-btn celebrity-btn"
|
|
|
+ @click="createCrazyPopup('government-notice')"
|
|
|
+ >
|
|
|
+ 📞 接听电话
|
|
|
+ </button>
|
|
|
+
|
|
|
+ <button
|
|
|
+ v-if="popup.type === 'lucky-draw'"
|
|
|
+ class="action-btn lucky-btn"
|
|
|
+ @click="showLuckyWheelPopup"
|
|
|
+ >
|
|
|
+ 🎰 参与抽奖
|
|
|
+ </button>
|
|
|
+
|
|
|
+ <button
|
|
|
+ v-if="popup.type === 'prize-expired'"
|
|
|
+ class="action-btn urgent-btn"
|
|
|
+ @click="triggerRandomPrankContent"
|
|
|
+ >
|
|
|
+ ⚡ 紧急领取
|
|
|
+ </button>
|
|
|
+
|
|
|
+ <!-- 通用按钮 -->
|
|
|
+ <button
|
|
|
+ class="action-btn default-btn"
|
|
|
+ @click="handlePopupAction(popup)"
|
|
|
+ >
|
|
|
+ {{ getActionButtonText(popup.type) }}
|
|
|
+ </button>
|
|
|
+
|
|
|
+ <button
|
|
|
+ class="action-btn cancel-btn"
|
|
|
+ @click="createCrazyPopup()"
|
|
|
+ >
|
|
|
+ ❌ 拒绝
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 假的进度条 -->
|
|
|
+ <div v-if="popup.type === 'system-update'" class="fake-progress">
|
|
|
+ <div class="progress-bar">
|
|
|
+ <div class="progress-fill"></div>
|
|
|
+ </div>
|
|
|
+ <span class="progress-text">系统更新中... 99.9%</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 假的倒计时 -->
|
|
|
+ <div v-if="popup.type === 'limited-time' || popup.type === 'prize-expired'" class="fake-countdown">
|
|
|
+ <span class="countdown-label">剩余时间：</span>
|
|
|
+ <span class="countdown-timer">{{ getFakeCountdown() }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 超级恼人的主广告 -->
|
|
|
+ <div v-if="showMainAd" class="main-ad animate__animated animate__zoomIn">
|
|
|
+ <div class="main-ad-content">
|
|
|
+ <h3 class="rainbow-text">🎊 超级大奖 🎊</h3>
|
|
|
+ <p class="blink-text mega-text">您是第{{ getRandomVisitorNumber() }}位访问者！</p>
|
|
|
+ <div class="prize-showcase">
|
|
|
+ <div class="prize-item">🏠 别墅一套</div>
|
|
|
+ <div class="prize-item">🚗 豪车一辆</div>
|
|
|
+ <div class="prize-item">💰 现金100万</div>
|
|
|
+ <div class="prize-item">💎 黄金10公斤</div>
|
|
|
+ </div>
|
|
|
+ <p class="urgent-text">⚠️ 24小时内领取，否则自动作废！</p>
|
|
|
+ <button class="claim-btn mega-button animate__animated animate__pulse animate__infinite" @click="clickAd">
|
|
|
+ 🎯 立即领取全部奖品！
|
|
|
+ </button>
|
|
|
+ <div class="fake-timer">
|
|
|
+ 倒计时：{{ getRandomTime() }}
|
|
|
+ </div>
|
|
|
+ <button class="close-main-ad" @click="continueAnnoyingExperience">×</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 全屏覆盖恶搞广告 - 永远显示 -->
|
|
|
+ <div v-if="showOverlayAd" class="overlay-ad animate__animated animate__fadeIn">
|
|
|
+ <div class="overlay-content">
|
|
|
+ <h2 class="rainbow-text">🎁 永恒天降大奖！🎁</h2>
|
|
|
+ <p class="mega-text">您的永恒IP地址 {{ getRandomIP() }}</p>
|
|
|
+ <div class="prize-wheel"></div>
|
|
|
+ <p class="blink-text">无限奖品总价值：¥{{ getRandomPrizeValue() }}</p>
|
|
|
+ <button class="overlay-btn mega-button" @click="clickAd">
|
|
|
+ 🏆 永远转动幸运轮盘！
|
|
|
+ </button>
|
|
|
+ <div class="warning-text">
|
|
|
+ ⚠️ 不领取将永远待在这里！
|
|
|
+ </div>
|
|
|
+ <button class="overlay-close" @click="continueAnnoyingExperience">×</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 假病毒警告 -->
|
|
|
+ <div v-if="showFakeVirus" class="virus-warning animate__animated animate__flash">
|
|
|
+ <h2>🚨 检测到严重病毒感染！🚨</h2>
|
|
|
+ <p>已发现 {{ getRandomVirusCount() }} 个恶意软件！</p>
|
|
|
+ <button @click="showFakeVirus = false">立即修复</button>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 浮动广告组件 -->
|
|
|
+ <FloatingAds v-if="showFloatingAds" />
|
|
|
+
|
|
|
+ <!-- 假下载组件 -->
|
|
|
+ <FakeDownload v-if="showFakeDownload" />
|
|
|
+
|
|
|
+ <!-- 假通知组件 -->
|
|
|
+ <FakeNotifications v-if="showNotifications" />
|
|
|
+
|
|
|
+ <!-- 自定义离开确认对话框 -->
|
|
|
+ <div v-if="showLeaveDialog" class="leave-dialog-overlay">
|
|
|
+ <div class="leave-dialog">
|
|
|
+ <div class="leave-dialog-header">
|
|
|
+ <h3>🎯 真的要离开广告天堂吗？</h3>
|
|
|
+ </div>
|
|
|
+ <div class="leave-dialog-content">
|
|
|
+ <p>离开就意味着你将错过：</p>
|
|
|
+ <ul class="miss-list">
|
|
|
+ <li>💰 100万现金大奖</li>
|
|
|
+ <li>🏠 豪华别墅一套</li>
|
|
|
+ <li>🚗 限量版跑车</li>
|
|
|
+ <li>💎 钻石珠宝礼盒</li>
|
|
|
+ <li>🎪 永恒的广告体验</li>
|
|
|
+ </ul>
|
|
|
+ <p class="final-plea">再想想吧，机会难得！</p>
|
|
|
+ </div>
|
|
|
+ <div class="leave-dialog-buttons">
|
|
|
+ <button @click="stayAndContinue" class="stay-button">留下来享受！</button>
|
|
|
+ <button @click="confirmLeave" class="leave-button">我意已决</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 自定义通知 - 替代alert -->
|
|
|
+ <div v-if="showCustomNotification" class="custom-notification">
|
|
|
+ <div class="notification-content">
|
|
|
+ <div class="notification-icon">🔔</div>
|
|
|
+ <div class="notification-message">{{ customNotificationMessage }}</div>
|
|
|
+ <button class="notification-close" @click="showCustomNotification = false">×</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 自定义恶搞对话框 - 替代confirm -->
|
|
|
+ <div v-if="showPrankDialog" class="prank-dialog-overlay">
|
|
|
+ <div class="prank-dialog">
|
|
|
+ <div class="prank-dialog-header">
|
|
|
+ <h3>🎭 恶搞提示</h3>
|
|
|
+ </div>
|
|
|
+ <div class="prank-dialog-content">
|
|
|
+ <p>{{ prankDialogContent }}</p>
|
|
|
+ </div>
|
|
|
+ <div class="prank-dialog-buttons">
|
|
|
+ <button @click="closePrankDialog(true)" class="prank-yes-button">是</button>
|
|
|
+ <button @click="closePrankDialog(false)" class="prank-no-button">否</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 幸运转盘弹窗 -->
|
|
|
+ <div v-if="showLuckyWheel" class="lucky-wheel-overlay">
|
|
|
+ <div class="lucky-wheel-container">
|
|
|
+ <div class="wheel-header">
|
|
|
+ <h2>🎰 超级幸运转盘 🎰</h2>
|
|
|
+ <button class="wheel-close" @click="closeLuckyWheel">❌</button>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="wheel-content">
|
|
|
+ <div class="wheel-display" :class="{ 'spinning': wheelSpinning }">
|
|
|
+ <div class="wheel-segment" v-for="(prize, index) in luckyWheelPrizes" :key="index">
|
|
|
+ {{ prize.split(' ')[0] }}
|
|
|
+ </div>
|
|
|
+ <div class="wheel-pointer">👆</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="wheel-result" v-if="wheelResult">
|
|
|
+ <h3>🎉 恭喜您获得：</h3>
|
|
|
+ <p class="result-text">{{ wheelResult }}</p>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="wheel-buttons">
|
|
|
+ <button class="spin-button" @click="spinWheel" :disabled="wheelSpinning">
|
|
|
+ {{ wheelSpinning ? '转盘中...' : '🎲 开始转盘' }}
|
|
|
+ </button>
|
|
|
+ <button class="spin-again-button" @click="spinWheel">
|
|
|
+ ✨ 再转一次
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="wheel-tips">
|
|
|
+ <p>💡 提示：每次转盘都有惊喜！</p>
|
|
|
+ <p>🔥 连续转盘可获得更大奖品！</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.fake-ad-container {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100vw;
|
|
|
+ height: 100vh;
|
|
|
+ background: linear-gradient(45deg, #ff6b6b, #4ecdc4, #45b7d1, #96ceb4);
|
|
|
+ background-size: 400% 400%;
|
|
|
+ animation: gradientShift 3s ease infinite;
|
|
|
+ overflow: hidden;
|
|
|
+ font-family: 'Arial', sans-serif;
|
|
|
+}
|
|
|
+
|
|
|
+/* 背景渐变动画 */
|
|
|
+@keyframes gradientShift {
|
|
|
+ 0% { background-position: 0% 50%; }
|
|
|
+ 50% { background-position: 100% 50%; }
|
|
|
+ 100% { background-position: 0% 50%; }
|
|
|
+}
|
|
|
+
|
|
|
+.header {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ padding: 15px;
|
|
|
+ background: linear-gradient(90deg, #ff6b6b, #feca57);
|
|
|
+ box-shadow: 0 4px 20px rgba(0,0,0,0.3);
|
|
|
+ position: relative;
|
|
|
+ z-index: 100;
|
|
|
+}
|
|
|
+
|
|
|
+.back-btn {
|
|
|
+ padding: 10px 20px;
|
|
|
+ background: linear-gradient(45deg, #3498db, #2980b9);
|
|
|
+ color: white;
|
|
|
+ border: none;
|
|
|
+ border-radius: 25px;
|
|
|
+ cursor: pointer;
|
|
|
+ font-weight: bold;
|
|
|
+ box-shadow: 0 4px 15px rgba(52, 152, 219, 0.4);
|
|
|
+ transition: all 0.3s ease;
|
|
|
+}
|
|
|
+
|
|
|
+.back-btn:hover {
|
|
|
+ transform: scale(1.1);
|
|
|
+ box-shadow: 0 6px 20px rgba(52, 152, 219, 0.6);
|
|
|
+}
|
|
|
+
|
|
|
+.annoying-banner {
|
|
|
+ flex: 1;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: white;
|
|
|
+ text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
|
|
|
+}
|
|
|
+
|
|
|
+/* 漂浮背景效果 */
|
|
|
+.background-effects {
|
|
|
+ position: absolute;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ pointer-events: none;
|
|
|
+}
|
|
|
+
|
|
|
+.floating-money {
|
|
|
+ position: absolute;
|
|
|
+ font-size: 40px;
|
|
|
+ opacity: 0.7;
|
|
|
+ animation: float 6s ease-in-out infinite;
|
|
|
+}
|
|
|
+
|
|
|
+.floating-money:nth-child(1) { left: 10%; animation-delay: 0s; }
|
|
|
+.floating-money:nth-child(2) { left: 30%; animation-delay: 1s; }
|
|
|
+.floating-money:nth-child(3) { left: 50%; animation-delay: 2s; }
|
|
|
+.floating-money:nth-child(4) { left: 70%; animation-delay: 3s; }
|
|
|
+.floating-money:nth-child(5) { left: 90%; animation-delay: 4s; }
|
|
|
+
|
|
|
+@keyframes float {
|
|
|
+ 0%, 100% { transform: translateY(100vh) rotate(0deg); }
|
|
|
+ 50% { transform: translateY(-100px) rotate(180deg); }
|
|
|
+}
|
|
|
+
|
|
|
+.popup-container {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100vw;
|
|
|
+ height: 100vh;
|
|
|
+ pointer-events: none;
|
|
|
+ z-index: 9999;
|
|
|
+}
|
|
|
+
|
|
|
+.crazy-popup {
|
|
|
+ position: absolute;
|
|
|
+ width: 320px;
|
|
|
+ min-height: 200px;
|
|
|
+ background: linear-gradient(135deg, #ff6b6b, #feca57, #48dbfb, #ff9ff3);
|
|
|
+ background-size: 400% 400%;
|
|
|
+ animation: gradientShift 2s ease infinite;
|
|
|
+ border-radius: 15px;
|
|
|
+ box-shadow: 0 15px 35px rgba(0, 0, 0, 0.3);
|
|
|
+ border: 3px solid #fff;
|
|
|
+ pointer-events: auto;
|
|
|
+ overflow: hidden;
|
|
|
+ transform-origin: center;
|
|
|
+}
|
|
|
+
|
|
|
+.popup-small { width: 280px; min-height: 180px; }
|
|
|
+.popup-medium { width: 350px; min-height: 220px; }
|
|
|
+.popup-large { width: 420px; min-height: 280px; }
|
|
|
+
|
|
|
+/* 不同类型弹窗的特殊样式 */
|
|
|
+.popup-urgent-winner {
|
|
|
+ border: 5px solid #ff0000;
|
|
|
+ box-shadow: 0 0 20px rgba(255, 0, 0, 0.6);
|
|
|
+ animation: urgentPulse 1s infinite, gradientShift 2s ease infinite;
|
|
|
+}
|
|
|
+
|
|
|
+.popup-fake-security {
|
|
|
+ border: 3px solid #ffd700;
|
|
|
+ background: linear-gradient(135deg, #ff4757, #ffa502);
|
|
|
+}
|
|
|
+
|
|
|
+.popup-celebrity-call {
|
|
|
+ border: 3px solid #00ff00;
|
|
|
+ background: linear-gradient(135deg, #26de81, #20bf6b);
|
|
|
+ animation: phoneCall 2s infinite;
|
|
|
+}
|
|
|
+
|
|
|
+.popup-virus-warning {
|
|
|
+ border: 5px solid #ff0000;
|
|
|
+ background: linear-gradient(135deg, #ff3838, #ff6b6b);
|
|
|
+ animation: virusAlert 0.5s infinite;
|
|
|
+}
|
|
|
+
|
|
|
+.popup-system-update {
|
|
|
+ border: 3px solid #007bff;
|
|
|
+ background: linear-gradient(135deg, #3742fa, #2f3542);
|
|
|
+}
|
|
|
+
|
|
|
+/* 疯狂头部样式 */
|
|
|
+.crazy-header {
|
|
|
+ background: linear-gradient(90deg, #ff4757, #ff3838);
|
|
|
+ color: white;
|
|
|
+ padding: 12px 15px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ font-weight: bold;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.popup-title {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ animation: titleBlink 1s infinite;
|
|
|
+}
|
|
|
+
|
|
|
+.fake-controls {
|
|
|
+ display: flex;
|
|
|
+ gap: 8px;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.fake-minimize, .fake-maximize {
|
|
|
+ padding: 2px 6px;
|
|
|
+ background: rgba(255,255,255,0.2);
|
|
|
+ border-radius: 3px;
|
|
|
+ cursor: pointer;
|
|
|
+ font-size: 12px;
|
|
|
+}
|
|
|
+
|
|
|
+.crazy-close {
|
|
|
+ background: rgba(255,255,255,0.2);
|
|
|
+ border: none;
|
|
|
+ color: white;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ cursor: pointer;
|
|
|
+ width: 25px;
|
|
|
+ height: 25px;
|
|
|
+ border-radius: 50%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ transition: all 0.3s ease;
|
|
|
+}
|
|
|
+
|
|
|
+.crazy-close:hover {
|
|
|
+ background: rgba(255,255,255,0.4);
|
|
|
+ transform: rotate(90deg);
|
|
|
+}
|
|
|
+
|
|
|
+/* 疯狂内容样式 */
|
|
|
+.crazy-body {
|
|
|
+ padding: 20px;
|
|
|
+ text-align: center;
|
|
|
+ color: white;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+
|
|
|
+.popup-icon {
|
|
|
+ font-size: 48px;
|
|
|
+ margin-bottom: 15px;
|
|
|
+ animation: iconBounce 2s infinite;
|
|
|
+}
|
|
|
+
|
|
|
+.popup-text {
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 1.5;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
|
|
|
+}
|
|
|
+
|
|
|
+/* 弹窗按钮样式 */
|
|
|
+.popup-actions {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ gap: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.action-btn {
|
|
|
+ padding: 12px 20px;
|
|
|
+ border: none;
|
|
|
+ border-radius: 25px;
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: bold;
|
|
|
+ cursor: pointer;
|
|
|
+ transition: all 0.3s ease;
|
|
|
+ text-transform: uppercase;
|
|
|
+ letter-spacing: 1px;
|
|
|
+}
|
|
|
+
|
|
|
+.winner-btn {
|
|
|
+ background: linear-gradient(45deg, #ffd700, #ffb347);
|
|
|
+ color: #333;
|
|
|
+ animation: goldenShine 2s infinite;
|
|
|
+}
|
|
|
+
|
|
|
+.security-btn {
|
|
|
+ background: linear-gradient(45deg, #ff4757, #ff3838);
|
|
|
+ color: white;
|
|
|
+}
|
|
|
+
|
|
|
+.celebrity-btn {
|
|
|
+ background: linear-gradient(45deg, #26de81, #20bf6b);
|
|
|
+ color: white;
|
|
|
+}
|
|
|
+
|
|
|
+.lucky-btn {
|
|
|
+ background: linear-gradient(45deg, #3742fa, #2f3542);
|
|
|
+ color: white;
|
|
|
+}
|
|
|
+
|
|
|
+.urgent-btn {
|
|
|
+ background: linear-gradient(45deg, #ff6348, #ff4757);
|
|
|
+ color: white;
|
|
|
+ animation: urgentGlow 1s infinite;
|
|
|
+}
|
|
|
+
|
|
|
+.default-btn {
|
|
|
+ background: linear-gradient(45deg, #48dbfb, #0abde3);
|
|
|
+ color: white;
|
|
|
+}
|
|
|
+
|
|
|
+.cancel-btn {
|
|
|
+ background: linear-gradient(45deg, #747d8c, #57606f);
|
|
|
+ color: white;
|
|
|
+}
|
|
|
+
|
|
|
+.action-btn:hover {
|
|
|
+ transform: translateY(-3px);
|
|
|
+ box-shadow: 0 8px 25px rgba(0,0,0,0.2);
|
|
|
+}
|
|
|
+
|
|
|
+/* 假进度条 */
|
|
|
+.fake-progress {
|
|
|
+ margin-top: 15px;
|
|
|
+ padding: 10px;
|
|
|
+ background: rgba(255,255,255,0.1);
|
|
|
+ border-radius: 8px;
|
|
|
+}
|
|
|
+
|
|
|
+.progress-bar {
|
|
|
+ width: 100%;
|
|
|
+ height: 20px;
|
|
|
+ background: rgba(255,255,255,0.2);
|
|
|
+ border-radius: 10px;
|
|
|
+ overflow: hidden;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.progress-fill {
|
|
|
+ height: 100%;
|
|
|
+ width: 99.9%;
|
|
|
+ background: linear-gradient(90deg, #26de81, #20bf6b);
|
|
|
+ border-radius: 10px;
|
|
|
+ animation: progressBlink 2s infinite;
|
|
|
+}
|
|
|
+
|
|
|
+.progress-text {
|
|
|
+ color: white;
|
|
|
+ font-size: 12px;
|
|
|
+ margin-top: 8px;
|
|
|
+ display: block;
|
|
|
+}
|
|
|
+
|
|
|
+/* 假倒计时 */
|
|
|
+.fake-countdown {
|
|
|
+ margin-top: 15px;
|
|
|
+ padding: 10px;
|
|
|
+ background: rgba(255,255,255,0.1);
|
|
|
+ border-radius: 8px;
|
|
|
+ color: white;
|
|
|
+}
|
|
|
+
|
|
|
+.countdown-label {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #feca57;
|
|
|
+}
|
|
|
+
|
|
|
+.countdown-timer {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #ff6348;
|
|
|
+ animation: countdownBlink 1s infinite;
|
|
|
+}
|
|
|
+
|
|
|
+/* 移动弹窗动画 */
|
|
|
+.moving-popup {
|
|
|
+ animation: crazyMove 3s infinite linear;
|
|
|
+}
|
|
|
+
|
|
|
+/* 动画关键帧 */
|
|
|
+@keyframes urgentPulse {
|
|
|
+ 0%, 100% {
|
|
|
+ transform: scale(1);
|
|
|
+ box-shadow: 0 0 20px rgba(255, 0, 0, 0.6);
|
|
|
+ }
|
|
|
+ 50% {
|
|
|
+ transform: scale(1.05);
|
|
|
+ box-shadow: 0 0 30px rgba(255, 0, 0, 0.9);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes phoneCall {
|
|
|
+ 0%, 100% { transform: rotate(0deg); }
|
|
|
+ 25% { transform: rotate(-5deg); }
|
|
|
+ 75% { transform: rotate(5deg); }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes virusAlert {
|
|
|
+ 0%, 100% { background-position: 0% 50%; }
|
|
|
+ 50% { background-position: 100% 50%; }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes titleBlink {
|
|
|
+ 0%, 50% { opacity: 1; }
|
|
|
+ 51%, 100% { opacity: 0.7; }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes iconBounce {
|
|
|
+ 0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
|
|
|
+ 40% { transform: translateY(-10px); }
|
|
|
+ 60% { transform: translateY(-5px); }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes goldenShine {
|
|
|
+ 0% { background-position: -200px; }
|
|
|
+ 100% { background-position: 200px; }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes urgentGlow {
|
|
|
+ 0%, 100% { box-shadow: 0 0 5px rgba(255, 99, 72, 0.5); }
|
|
|
+ 50% { box-shadow: 0 0 20px rgba(255, 99, 72, 0.8); }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes progressBlink {
|
|
|
+ 0%, 50% { width: 99.9%; }
|
|
|
+ 51%, 100% { width: 99.8%; }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes countdownBlink {
|
|
|
+ 0%, 50% { color: #ff6348; }
|
|
|
+ 51%, 100% { color: #feca57; }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes crazyMove {
|
|
|
+ 0% { transform: translate(0, 0) rotate(0deg); }
|
|
|
+ 25% { transform: translate(50px, -30px) rotate(5deg); }
|
|
|
+ 50% { transform: translate(-30px, 50px) rotate(-5deg); }
|
|
|
+ 75% { transform: translate(40px, -20px) rotate(3deg); }
|
|
|
+ 100% { transform: translate(0, 0) rotate(0deg); }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes gradientShift {
|
|
|
+ 0% { background-position: 0% 50%; }
|
|
|
+ 50% { background-position: 100% 50%; }
|
|
|
+ 100% { background-position: 0% 50%; }
|
|
|
+}
|
|
|
+
|
|
|
+/* 响应式设计 */
|
|
|
+@media (max-width: 768px) {
|
|
|
+ .crazy-popup {
|
|
|
+ width: 280px;
|
|
|
+ min-height: 180px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .popup-large {
|
|
|
+ width: 300px;
|
|
|
+ min-height: 200px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .action-btn {
|
|
|
+ padding: 10px 15px;
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .popup-icon {
|
|
|
+ font-size: 36px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+/* 主广告超级恶搞样式 */
|
|
|
+.main-ad {
|
|
|
+ position: fixed;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+ width: 90%;
|
|
|
+ max-width: 600px;
|
|
|
+ background: linear-gradient(135deg, #fff, #f8f9fa);
|
|
|
+ border-radius: 20px;
|
|
|
+ box-shadow: 0 20px 60px rgba(0,0,0,0.6);
|
|
|
+ z-index: 9999;
|
|
|
+ text-align: center;
|
|
|
+ padding: 30px;
|
|
|
+ border: 5px solid #ff6b6b;
|
|
|
+ animation: megaPulse 1s ease-in-out infinite;
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes megaPulse {
|
|
|
+ 0%, 100% { transform: translate(-50%, -50%) scale(1); }
|
|
|
+ 50% { transform: translate(-50%, -50%) scale(1.05); }
|
|
|
+}
|
|
|
+
|
|
|
+.rainbow-text {
|
|
|
+ background: linear-gradient(45deg, #ff6b6b, #4ecdc4, #45b7d1, #96ceb4, #feca57);
|
|
|
+ -webkit-background-clip: text;
|
|
|
+ -webkit-text-fill-color: transparent;
|
|
|
+ background-clip: text;
|
|
|
+ font-size: 28px;
|
|
|
+ font-weight: bold;
|
|
|
+ animation: rainbowShift 2s ease-in-out infinite;
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes rainbowShift {
|
|
|
+ 0%, 100% { filter: hue-rotate(0deg); }
|
|
|
+ 50% { filter: hue-rotate(180deg); }
|
|
|
+}
|
|
|
+
|
|
|
+.mega-text {
|
|
|
+ font-size: 20px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #e74c3c;
|
|
|
+ margin: 15px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.prize-showcase {
|
|
|
+ display: grid;
|
|
|
+ grid-template-columns: 1fr 1fr;
|
|
|
+ gap: 10px;
|
|
|
+ margin: 20px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.prize-item {
|
|
|
+ background: linear-gradient(45deg, #feca57, #ff9ff3);
|
|
|
+ padding: 10px;
|
|
|
+ border-radius: 10px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #2c3e50;
|
|
|
+ border: 2px solid #ff6b6b;
|
|
|
+}
|
|
|
+
|
|
|
+.urgent-text {
|
|
|
+ color: #e74c3c;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 16px;
|
|
|
+ margin: 15px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.mega-button {
|
|
|
+ padding: 15px 30px;
|
|
|
+ background: linear-gradient(45deg, #e74c3c, #c0392b);
|
|
|
+ color: white;
|
|
|
+ border: none;
|
|
|
+ border-radius: 30px;
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: bold;
|
|
|
+ cursor: pointer;
|
|
|
+ box-shadow: 0 8px 25px rgba(231, 76, 60, 0.4);
|
|
|
+ transition: all 0.3s ease;
|
|
|
+ margin: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.mega-button:hover {
|
|
|
+ transform: scale(1.1);
|
|
|
+ box-shadow: 0 12px 35px rgba(231, 76, 60, 0.6);
|
|
|
+}
|
|
|
+
|
|
|
+.fake-timer {
|
|
|
+ background: #2c3e50;
|
|
|
+ color: #ecf0f1;
|
|
|
+ padding: 10px;
|
|
|
+ border-radius: 8px;
|
|
|
+ font-family: 'Courier New', monospace;
|
|
|
+ font-weight: bold;
|
|
|
+ margin-top: 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.close-main-ad {
|
|
|
+ position: absolute;
|
|
|
+ top: -15px;
|
|
|
+ right: -15px;
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
+ border-radius: 50%;
|
|
|
+ background: linear-gradient(45deg, #2c3e50, #34495e);
|
|
|
+ color: white;
|
|
|
+ border: none;
|
|
|
+ font-size: 20px;
|
|
|
+ font-weight: bold;
|
|
|
+ cursor: pointer;
|
|
|
+ box-shadow: 0 4px 15px rgba(0,0,0,0.3);
|
|
|
+}
|
|
|
+
|
|
|
+/* 全屏覆盖恶搞广告 */
|
|
|
+.overlay-ad {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: linear-gradient(45deg, rgba(231, 76, 60, 0.95), rgba(155, 89, 182, 0.95));
|
|
|
+ z-index: 10000;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ backdrop-filter: blur(10px);
|
|
|
+}
|
|
|
+
|
|
|
+.overlay-content {
|
|
|
+ text-align: center;
|
|
|
+ padding: 40px;
|
|
|
+ max-width: 600px;
|
|
|
+ background: rgba(255, 255, 255, 0.95);
|
|
|
+ border-radius: 20px;
|
|
|
+ box-shadow: 0 20px 60px rgba(0,0,0,0.5);
|
|
|
+ animation: overlayBounce 2s ease-in-out infinite;
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes overlayBounce {
|
|
|
+ 0%, 100% { transform: scale(1); }
|
|
|
+ 50% { transform: scale(1.05); }
|
|
|
+}
|
|
|
+
|
|
|
+.prize-wheel {
|
|
|
+ width: 200px;
|
|
|
+ height: 200px;
|
|
|
+ margin: 20px auto;
|
|
|
+ border-radius: 50%;
|
|
|
+ background: linear-gradient(45deg, #ff6b6b, #4ecdc4, #45b7d1, #96ceb4, #feca57, #ff9ff3);
|
|
|
+ animation: spin 3s linear infinite;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ font-size: 40px;
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes spin {
|
|
|
+ 0% { transform: rotate(0deg); }
|
|
|
+ 100% { transform: rotate(360deg); }
|
|
|
+}
|
|
|
+
|
|
|
+.warning-text {
|
|
|
+ color: #e74c3c;
|
|
|
+ font-weight: bold;
|
|
|
+ margin-top: 20px;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+/* 假病毒警告 */
|
|
|
+.virus-warning {
|
|
|
+ position: fixed;
|
|
|
+ top: 20px;
|
|
|
+ right: 20px;
|
|
|
+ background: linear-gradient(45deg, #e74c3c, #c0392b);
|
|
|
+ color: white;
|
|
|
+ padding: 20px;
|
|
|
+ border-radius: 10px;
|
|
|
+ box-shadow: 0 8px 25px rgba(231, 76, 60, 0.4);
|
|
|
+ z-index: 9998;
|
|
|
+ text-align: center;
|
|
|
+ border: 3px solid #fff;
|
|
|
+}
|
|
|
+
|
|
|
+/* 闪烁文本动画 */
|
|
|
+.blink-text {
|
|
|
+ animation: blink 1s ease-in-out infinite;
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes blink {
|
|
|
+ 0%, 100% { opacity: 1; }
|
|
|
+ 50% { opacity: 0.3; }
|
|
|
+}
|
|
|
+
|
|
|
+.blink-button {
|
|
|
+ animation: buttonPulse 1.5s ease-in-out infinite;
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes buttonPulse {
|
|
|
+ 0%, 100% { transform: scale(1); box-shadow: 0 8px 25px rgba(231, 76, 60, 0.4); }
|
|
|
+ 50% { transform: scale(1.1); box-shadow: 0 12px 35px rgba(231, 76, 60, 0.8); }
|
|
|
+}
|
|
|
+
|
|
|
+/* 响应式设计 */
|
|
|
+@media (max-width: 768px) {
|
|
|
+ .ad-popup {
|
|
|
+ width: 280px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .main-ad {
|
|
|
+ width: 95%;
|
|
|
+ padding: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .rainbow-text {
|
|
|
+ font-size: 22px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .mega-text {
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prize-showcase {
|
|
|
+ grid-template-columns: 1fr;
|
|
|
+ }
|
|
|
+
|
|
|
+ .mega-button {
|
|
|
+ padding: 12px 25px;
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .overlay-content {
|
|
|
+ padding: 30px;
|
|
|
+ margin: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prize-wheel {
|
|
|
+ width: 150px;
|
|
|
+ height: 150px;
|
|
|
+ font-size: 30px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes bounceIn {
|
|
|
+ 0% { transform: scale(0.3); opacity: 0; }
|
|
|
+ 50% { transform: scale(1.05); opacity: 0.8; }
|
|
|
+ 70% { transform: scale(0.9); opacity: 0.9; }
|
|
|
+ 100% { transform: scale(1); opacity: 1; }
|
|
|
+}
|
|
|
+
|
|
|
+/* 自定义离开确认对话框样式 */
|
|
|
+.leave-dialog-overlay {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: rgba(0, 0, 0, 0.8);
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ z-index: 10000;
|
|
|
+ animation: fadeIn 0.3s ease-in-out;
|
|
|
+}
|
|
|
+
|
|
|
+.leave-dialog {
|
|
|
+ background: linear-gradient(135deg, #ff6b6b, #feca57, #48dbfb, #ff9ff3);
|
|
|
+ background-size: 400% 400%;
|
|
|
+ animation: gradientShift 3s ease infinite, dialogBounce 0.5s ease-out;
|
|
|
+ border-radius: 20px;
|
|
|
+ padding: 30px;
|
|
|
+ max-width: 500px;
|
|
|
+ width: 90%;
|
|
|
+ text-align: center;
|
|
|
+ box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
|
|
|
+ border: 3px solid #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.leave-dialog-header h3 {
|
|
|
+ margin: 0 0 20px 0;
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #fff;
|
|
|
+ text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
|
|
|
+}
|
|
|
+
|
|
|
+.leave-dialog-content {
|
|
|
+ margin-bottom: 25px;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.leave-dialog-content p {
|
|
|
+ margin: 10px 0;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+
|
|
|
+.miss-list {
|
|
|
+ list-style: none;
|
|
|
+ padding: 0;
|
|
|
+ margin: 15px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.miss-list li {
|
|
|
+ margin: 8px 0;
|
|
|
+ padding: 8px;
|
|
|
+ background: rgba(255, 255, 255, 0.2);
|
|
|
+ border-radius: 10px;
|
|
|
+ font-weight: bold;
|
|
|
+ animation: listItemPulse 2s ease-in-out infinite;
|
|
|
+}
|
|
|
+
|
|
|
+.miss-list li:nth-child(odd) {
|
|
|
+ animation-delay: 0.5s;
|
|
|
+}
|
|
|
+
|
|
|
+.final-plea {
|
|
|
+ font-style: italic;
|
|
|
+ color: #ffff00;
|
|
|
+ font-size: 18px;
|
|
|
+ text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
|
|
|
+}
|
|
|
+
|
|
|
+.leave-dialog-buttons {
|
|
|
+ display: flex;
|
|
|
+ gap: 15px;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+
|
|
|
+.leave-dialog-buttons button {
|
|
|
+ padding: 12px 25px;
|
|
|
+ border: none;
|
|
|
+ border-radius: 25px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ cursor: pointer;
|
|
|
+ transition: all 0.3s ease;
|
|
|
+ text-transform: uppercase;
|
|
|
+}
|
|
|
+
|
|
|
+.stay-button {
|
|
|
+ background: linear-gradient(45deg, #00f260, #0575e6);
|
|
|
+ color: white;
|
|
|
+ box-shadow: 0 4px 15px rgba(0, 242, 96, 0.4);
|
|
|
+}
|
|
|
+
|
|
|
+.stay-button:hover {
|
|
|
+ transform: translateY(-2px);
|
|
|
+ box-shadow: 0 6px 20px rgba(0, 242, 96, 0.6);
|
|
|
+}
|
|
|
+
|
|
|
+.leave-button {
|
|
|
+ background: linear-gradient(45deg, #ff416c, #ff4b2b);
|
|
|
+ color: white;
|
|
|
+ box-shadow: 0 4px 15px rgba(255, 65, 108, 0.4);
|
|
|
+}
|
|
|
+
|
|
|
+.leave-button:hover {
|
|
|
+ transform: translateY(-2px);
|
|
|
+ box-shadow: 0 6px 20px rgba(255, 65, 108, 0.6);
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes gradientShift {
|
|
|
+ 0% { background-position: 0% 50%; }
|
|
|
+ 50% { background-position: 100% 50%; }
|
|
|
+ 100% { background-position: 0% 50%; }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes dialogBounce {
|
|
|
+ 0% { transform: scale(0.3) rotate(-10deg); opacity: 0; }
|
|
|
+ 50% { transform: scale(1.1) rotate(5deg); opacity: 0.8; }
|
|
|
+ 100% { transform: scale(1) rotate(0deg); opacity: 1; }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes listItemPulse {
|
|
|
+ 0%, 100% { transform: scale(1); }
|
|
|
+ 50% { transform: scale(1.05); }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes fadeIn {
|
|
|
+ from { opacity: 0; }
|
|
|
+ to { opacity: 1; }
|
|
|
+}
|
|
|
+
|
|
|
+/* 响应式设计 */
|
|
|
+@media (max-width: 768px) {
|
|
|
+ .leave-dialog {
|
|
|
+ padding: 20px;
|
|
|
+ margin: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .leave-dialog-header h3 {
|
|
|
+ font-size: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .leave-dialog-content {
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .leave-dialog-buttons {
|
|
|
+ flex-direction: column;
|
|
|
+ }
|
|
|
+
|
|
|
+ .leave-dialog-buttons button {
|
|
|
+ width: 100%;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+/* 自定义通知 - 替代alert */
|
|
|
+.custom-notification {
|
|
|
+ position: fixed;
|
|
|
+ top: 20px;
|
|
|
+ right: 20px;
|
|
|
+ background: rgba(255, 255, 255, 0.9);
|
|
|
+ padding: 10px 20px;
|
|
|
+ border-radius: 10px;
|
|
|
+ box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
|
|
|
+ z-index: 10000;
|
|
|
+}
|
|
|
+
|
|
|
+.notification-content {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.notification-icon {
|
|
|
+ font-size: 24px;
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.notification-message {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+
|
|
|
+.notification-close {
|
|
|
+ background: none;
|
|
|
+ border: none;
|
|
|
+ font-size: 20px;
|
|
|
+ cursor: pointer;
|
|
|
+ margin-left: auto;
|
|
|
+}
|
|
|
+
|
|
|
+/* 自定义恶搞对话框 - 替代confirm */
|
|
|
+.prank-dialog-overlay {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: rgba(0, 0, 0, 0.8);
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ z-index: 10000;
|
|
|
+ animation: fadeIn 0.3s ease-in-out;
|
|
|
+}
|
|
|
+
|
|
|
+.prank-dialog {
|
|
|
+ background: linear-gradient(135deg, #ff6b6b, #feca57, #48dbfb, #ff9ff3);
|
|
|
+ background-size: 400% 400%;
|
|
|
+ animation: gradientShift 3s ease infinite, dialogBounce 0.5s ease-out;
|
|
|
+ border-radius: 20px;
|
|
|
+ padding: 30px;
|
|
|
+ max-width: 500px;
|
|
|
+ width: 90%;
|
|
|
+ text-align: center;
|
|
|
+ box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
|
|
|
+ border: 3px solid #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.prank-dialog-header h3 {
|
|
|
+ margin: 0 0 20px 0;
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #fff;
|
|
|
+ text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
|
|
|
+}
|
|
|
+
|
|
|
+.prank-dialog-content {
|
|
|
+ margin-bottom: 25px;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.prank-dialog-buttons {
|
|
|
+ display: flex;
|
|
|
+ gap: 15px;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+
|
|
|
+.prank-yes-button, .prank-no-button {
|
|
|
+ padding: 12px 25px;
|
|
|
+ border: none;
|
|
|
+ border-radius: 25px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ cursor: pointer;
|
|
|
+ transition: all 0.3s ease;
|
|
|
+ text-transform: uppercase;
|
|
|
+}
|
|
|
+
|
|
|
+.prank-yes-button {
|
|
|
+ background: linear-gradient(45deg, #00f260, #0575e6);
|
|
|
+ color: white;
|
|
|
+ box-shadow: 0 4px 15px rgba(0, 242, 96, 0.4);
|
|
|
+}
|
|
|
+
|
|
|
+.prank-yes-button:hover {
|
|
|
+ transform: translateY(-2px);
|
|
|
+ box-shadow: 0 6px 20px rgba(0, 242, 96, 0.6);
|
|
|
+}
|
|
|
+
|
|
|
+.prank-no-button {
|
|
|
+ background: linear-gradient(45deg, #ff416c, #ff4b2b);
|
|
|
+ color: white;
|
|
|
+ box-shadow: 0 4px 15px rgba(255, 65, 108, 0.4);
|
|
|
+}
|
|
|
+
|
|
|
+.prank-no-button:hover {
|
|
|
+ transform: translateY(-2px);
|
|
|
+ box-shadow: 0 6px 20px rgba(255, 65, 108, 0.6);
|
|
|
+}
|
|
|
+
|
|
|
+/* 自定义恶搞对话框 - 替代confirm */
|
|
|
+.prank-dialog-overlay {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: rgba(0, 0, 0, 0.8);
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ z-index: 10000;
|
|
|
+ animation: fadeIn 0.3s ease-in-out;
|
|
|
+}
|
|
|
+
|
|
|
+.prank-dialog {
|
|
|
+ background: linear-gradient(135deg, #ff6b6b, #feca57, #48dbfb, #ff9ff3);
|
|
|
+ background-size: 400% 400%;
|
|
|
+ animation: gradientShift 3s ease infinite, dialogBounce 0.5s ease-out;
|
|
|
+ border-radius: 20px;
|
|
|
+ padding: 30px;
|
|
|
+ max-width: 500px;
|
|
|
+ width: 90%;
|
|
|
+ text-align: center;
|
|
|
+ box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
|
|
|
+ border: 3px solid #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.prank-dialog-header h3 {
|
|
|
+ margin: 0 0 20px 0;
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #fff;
|
|
|
+ text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
|
|
|
+}
|
|
|
+
|
|
|
+.prank-dialog-content {
|
|
|
+ margin-bottom: 25px;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.prank-dialog-buttons {
|
|
|
+ display: flex;
|
|
|
+ gap: 15px;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+
|
|
|
+.prank-yes-button, .prank-no-button {
|
|
|
+ padding: 12px 25px;
|
|
|
+ border: none;
|
|
|
+ border-radius: 25px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ cursor: pointer;
|
|
|
+ transition: all 0.3s ease;
|
|
|
+ text-transform: uppercase;
|
|
|
+}
|
|
|
+
|
|
|
+.prank-yes-button {
|
|
|
+ background: linear-gradient(45deg, #00f260, #0575e6);
|
|
|
+ color: white;
|
|
|
+ box-shadow: 0 4px 15px rgba(0, 242, 96, 0.4);
|
|
|
+}
|
|
|
+
|
|
|
+.prank-yes-button:hover {
|
|
|
+ transform: translateY(-2px);
|
|
|
+ box-shadow: 0 6px 20px rgba(0, 242, 96, 0.6);
|
|
|
+}
|
|
|
+
|
|
|
+.prank-no-button {
|
|
|
+ background: linear-gradient(45deg, #ff416c, #ff4b2b);
|
|
|
+ color: white;
|
|
|
+ box-shadow: 0 4px 15px rgba(255, 65, 108, 0.4);
|
|
|
+}
|
|
|
+
|
|
|
+.prank-no-button:hover {
|
|
|
+ transform: translateY(-2px);
|
|
|
+ box-shadow: 0 6px 20px rgba(255, 65, 108, 0.6);
|
|
|
+}
|
|
|
+
|
|
|
+/* 超级恶心模式新增样式 */
|
|
|
+
|
|
|
+/* 散落的假关闭按钮 */
|
|
|
+.scattered-fake-button {
|
|
|
+ position: fixed;
|
|
|
+ width: 50px;
|
|
|
+ height: 50px;
|
|
|
+ background: linear-gradient(45deg, #e74c3c, #c0392b);
|
|
|
+ color: white;
|
|
|
+ border: none;
|
|
|
+ border-radius: 50%;
|
|
|
+ font-size: 24px;
|
|
|
+ cursor: pointer;
|
|
|
+ z-index: 9999;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ box-shadow: 0 4px 15px rgba(231, 76, 60, 0.4);
|
|
|
+ animation: floatAroundCrazy 3s ease-in-out infinite;
|
|
|
+ transition: all 0.3s ease;
|
|
|
+}
|
|
|
+
|
|
|
+.scattered-fake-button:hover {
|
|
|
+ transform: scale(1.3);
|
|
|
+ background: linear-gradient(45deg, #ff0000, #cc0000);
|
|
|
+ box-shadow: 0 6px 20px rgba(255, 0, 0, 0.6);
|
|
|
+}
|
|
|
+
|
|
|
+.scattered-fake-button.clicked {
|
|
|
+ background: linear-gradient(45deg, #2ecc71, #27ae60);
|
|
|
+ animation: clickedExplosion 1s ease-out;
|
|
|
+}
|
|
|
+
|
|
|
+.scattered-fake-button.moving {
|
|
|
+ animation: crazyMove 2s linear infinite;
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes floatAroundCrazy {
|
|
|
+ 0%, 100% { transform: translate(0, 0) rotate(0deg) scale(1); }
|
|
|
+ 25% { transform: translate(20px, -30px) rotate(90deg) scale(1.1); }
|
|
|
+ 50% { transform: translate(-20px, 20px) rotate(180deg) scale(0.9); }
|
|
|
+ 75% { transform: translate(30px, 10px) rotate(270deg) scale(1.2); }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes clickedExplosion {
|
|
|
+ 0% { transform: scale(1) rotate(0deg); }
|
|
|
+ 25% { transform: scale(2) rotate(90deg); opacity: 1; }
|
|
|
+ 50% { transform: scale(3) rotate(180deg); opacity: 0.5; }
|
|
|
+ 75% { transform: scale(4) rotate(270deg); opacity: 0.2; }
|
|
|
+ 100% { transform: scale(1) rotate(360deg); opacity: 1; }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes crazyMove {
|
|
|
+ 0% { transform: translate(0, 0) rotate(0deg); }
|
|
|
+ 25% { transform: translate(100px, -50px) rotate(180deg); }
|
|
|
+ 50% { transform: translate(-100px, 100px) rotate(360deg); }
|
|
|
+ 75% { transform: translate(50px, -100px) rotate(540deg); }
|
|
|
+ 100% { transform: translate(0, 0) rotate(720deg); }
|
|
|
+}
|
|
|
+
|
|
|
+/* 假加载屏幕 */
|
|
|
+.fake-loading-overlay {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: linear-gradient(45deg, #1a1a1a, #2c3e50, #34495e);
|
|
|
+ background-size: 400% 400%;
|
|
|
+ animation: gradientShift 2s ease infinite;
|
|
|
+ z-index: 10003;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+
|
|
|
+.fake-loading-content {
|
|
|
+ text-align: center;
|
|
|
+ color: white;
|
|
|
+ padding: 50px;
|
|
|
+ background: rgba(0, 0, 0, 0.9);
|
|
|
+ border-radius: 20px;
|
|
|
+ box-shadow: 0 20px 60px rgba(0, 0, 0, 0.7);
|
|
|
+ border: 3px solid #e74c3c;
|
|
|
+ animation: loadingContentPulse 1.5s ease-in-out infinite;
|
|
|
+}
|
|
|
+
|
|
|
+.loading-spinner {
|
|
|
+ width: 100px;
|
|
|
+ height: 100px;
|
|
|
+ margin: 0 auto 30px;
|
|
|
+ border: 10px solid #3498db;
|
|
|
+ border-top: 10px solid #e74c3c;
|
|
|
+ border-right: 10px solid #f39c12;
|
|
|
+ border-bottom: 10px solid #2ecc71;
|
|
|
+ border-radius: 50%;
|
|
|
+ animation: spinCrazy 0.8s linear infinite;
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes spinCrazy {
|
|
|
+ 0% { transform: rotate(0deg) scale(1); }
|
|
|
+ 25% { transform: rotate(90deg) scale(1.1); }
|
|
|
+ 50% { transform: rotate(180deg) scale(0.9); }
|
|
|
+ 75% { transform: rotate(270deg) scale(1.2); }
|
|
|
+ 100% { transform: rotate(360deg) scale(1); }
|
|
|
+}
|
|
|
+
|
|
|
+.loading-bar {
|
|
|
+ width: 400px;
|
|
|
+ height: 30px;
|
|
|
+ background: #34495e;
|
|
|
+ border-radius: 15px;
|
|
|
+ margin: 25px auto;
|
|
|
+ overflow: hidden;
|
|
|
+ box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.5);
|
|
|
+}
|
|
|
+
|
|
|
+.loading-progress {
|
|
|
+ height: 100%;
|
|
|
+ background: linear-gradient(45deg, #e74c3c, #f39c12, #2ecc71, #3498db);
|
|
|
+ background-size: 400% 400%;
|
|
|
+ width: 99.8%;
|
|
|
+ animation: loadingProgressShift 2s ease-in-out infinite;
|
|
|
+ border-radius: 15px;
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes loadingProgressShift {
|
|
|
+ 0%, 100% { background-position: 0% 50%; width: 99.8%; }
|
|
|
+ 50% { background-position: 100% 50%; width: 99.85%; }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes loadingContentPulse {
|
|
|
+ 0%, 100% { transform: scale(1); }
|
|
|
+ 50% { transform: scale(1.02); }
|
|
|
+}
|
|
|
+
|
|
|
+/* 超级恶心模式指示器 */
|
|
|
+.ultra-mode-indicator {
|
|
|
+ position: fixed;
|
|
|
+ top: 50%;
|
|
|
+ left: 20px;
|
|
|
+ transform: translateY(-50%);
|
|
|
+ background: rgba(0, 0, 0, 0.9);
|
|
|
+ padding: 20px;
|
|
|
+ border-radius: 15px;
|
|
|
+ z-index: 9998;
|
|
|
+ border: 3px solid #e74c3c;
|
|
|
+ animation: indicatorPulse 2s ease-in-out infinite;
|
|
|
+}
|
|
|
+
|
|
|
+.mode-badge {
|
|
|
+ background: linear-gradient(45deg, #e74c3c, #f39c12);
|
|
|
+ color: white;
|
|
|
+ padding: 10px 15px;
|
|
|
+ border-radius: 20px;
|
|
|
+ font-weight: bold;
|
|
|
+ text-align: center;
|
|
|
+ margin-bottom: 15px;
|
|
|
+ animation: badgeBlink 1s ease-in-out infinite;
|
|
|
+}
|
|
|
+
|
|
|
+.annoyance-meter {
|
|
|
+ position: relative;
|
|
|
+ width: 200px;
|
|
|
+ height: 25px;
|
|
|
+ background: #34495e;
|
|
|
+ border-radius: 12px;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.meter-fill {
|
|
|
+ height: 100%;
|
|
|
+ background: linear-gradient(45deg, #2ecc71, #f39c12, #e74c3c);
|
|
|
+ transition: width 0.5s ease;
|
|
|
+ border-radius: 12px;
|
|
|
+}
|
|
|
+
|
|
|
+.meter-text {
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+ color: white;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 12px;
|
|
|
+ text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes indicatorPulse {
|
|
|
+ 0%, 100% { transform: translateY(-50%) scale(1); }
|
|
|
+ 50% { transform: translateY(-50%) scale(1.05); }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes badgeBlink {
|
|
|
+ 0%, 100% { opacity: 1; }
|
|
|
+ 50% { opacity: 0.7; }
|
|
|
+}
|
|
|
+
|
|
|
+/* 移动文本容器 */
|
|
|
+.moving-text-container {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ pointer-events: none;
|
|
|
+ z-index: 9997;
|
|
|
+}
|
|
|
+
|
|
|
+.moving-text {
|
|
|
+ position: absolute;
|
|
|
+ font-size: 28px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #e74c3c;
|
|
|
+ text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
|
|
|
+ animation: textCrazyMove 6s linear infinite;
|
|
|
+}
|
|
|
+
|
|
|
+.moving-text:nth-child(1) {
|
|
|
+ left: 5%;
|
|
|
+ animation-delay: 0s;
|
|
|
+ color: #e74c3c;
|
|
|
+}
|
|
|
+
|
|
|
+.moving-text:nth-child(2) {
|
|
|
+ left: 25%;
|
|
|
+ animation-delay: 1s;
|
|
|
+ color: #f39c12;
|
|
|
+}
|
|
|
+
|
|
|
+.moving-text:nth-child(3) {
|
|
|
+ left: 45%;
|
|
|
+ animation-delay: 2s;
|
|
|
+ color: #2ecc71;
|
|
|
+}
|
|
|
+
|
|
|
+.moving-text:nth-child(4) {
|
|
|
+ left: 65%;
|
|
|
+ animation-delay: 3s;
|
|
|
+ color: #3498db;
|
|
|
+}
|
|
|
+
|
|
|
+.moving-text:nth-child(5) {
|
|
|
+ left: 85%;
|
|
|
+ animation-delay: 4s;
|
|
|
+ color: #9b59b6;
|
|
|
+}
|
|
|
+
|
|
|
+.moving-text:nth-child(6) {
|
|
|
+ left: 95%;
|
|
|
+ animation-delay: 5s;
|
|
|
+ color: #e91e63;
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes textCrazyMove {
|
|
|
+ 0% { transform: translateY(100vh) rotate(0deg) scale(1); opacity: 1; }
|
|
|
+ 25% { transform: translateY(75vh) rotate(90deg) scale(1.2); opacity: 0.8; }
|
|
|
+ 50% { transform: translateY(50vh) rotate(180deg) scale(0.8); opacity: 0.9; }
|
|
|
+ 75% { transform: translateY(25vh) rotate(270deg) scale(1.5); opacity: 0.7; }
|
|
|
+ 100% { transform: translateY(-50px) rotate(360deg) scale(1); opacity: 0; }
|
|
|
+}
|
|
|
+
|
|
|
+/* 移动和震动效果 */
|
|
|
+.moving {
|
|
|
+ animation: elementMove 4s ease-in-out infinite !important;
|
|
|
+}
|
|
|
+
|
|
|
+.shake {
|
|
|
+ animation: violentShake 0.3s ease-in-out infinite !important;
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes elementMove {
|
|
|
+ 0%, 100% { transform: translate(0, 0) rotate(0deg); }
|
|
|
+ 25% { transform: translate(15px, -10px) rotate(2deg); }
|
|
|
+ 50% { transform: translate(-10px, 15px) rotate(-2deg); }
|
|
|
+ 75% { transform: translate(10px, -5px) rotate(1deg); }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes violentShake {
|
|
|
+ 0%, 100% { transform: translate(0, 0) rotate(0deg); }
|
|
|
+ 10% { transform: translate(-3px, 2px) rotate(1deg); }
|
|
|
+ 20% { transform: translate(3px, -2px) rotate(-1deg); }
|
|
|
+ 30% { transform: translate(-2px, 3px) rotate(1deg); }
|
|
|
+ 40% { transform: translate(2px, -3px) rotate(-1deg); }
|
|
|
+ 50% { transform: translate(-3px, -2px) rotate(1deg); }
|
|
|
+ 60% { transform: translate(3px, 2px) rotate(-1deg); }
|
|
|
+ 70% { transform: translate(-2px, -3px) rotate(1deg); }
|
|
|
+ 80% { transform: translate(2px, 3px) rotate(-1deg); }
|
|
|
+ 90% { transform: translate(-3px, 2px) rotate(1deg); }
|
|
|
+}
|
|
|
+
|
|
|
+/* 全局恶心效果增强 */
|
|
|
+.fake-ad-container.ultra-annoying {
|
|
|
+ animation: containerCrazy 3s ease-in-out infinite;
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes containerCrazy {
|
|
|
+ 0%, 100% {
|
|
|
+ transform: translateX(0) scale(1);
|
|
|
+ filter: hue-rotate(0deg);
|
|
|
+ }
|
|
|
+ 25% {
|
|
|
+ transform: translateX(-3px) scale(1.01);
|
|
|
+ filter: hue-rotate(90deg);
|
|
|
+ }
|
|
|
+ 50% {
|
|
|
+ transform: translateX(3px) scale(0.99);
|
|
|
+ filter: hue-rotate(180deg);
|
|
|
+ }
|
|
|
+ 75% {
|
|
|
+ transform: translateX(-2px) scale(1.01);
|
|
|
+ filter: hue-rotate(270deg);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+/* 快速变色效果增强 */
|
|
|
+.rapid-color-change {
|
|
|
+ animation: rapidColorCrazy 0.3s ease-in-out infinite;
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes rapidColorCrazy {
|
|
|
+ 0% { filter: hue-rotate(0deg) saturate(2) brightness(1.2); }
|
|
|
+ 20% { filter: hue-rotate(72deg) saturate(3) brightness(0.8); }
|
|
|
+ 40% { filter: hue-rotate(144deg) saturate(1.5) brightness(1.5); }
|
|
|
+ 60% { filter: hue-rotate(216deg) saturate(2.5) brightness(0.6); }
|
|
|
+ 80% { filter: hue-rotate(288deg) saturate(1.8) brightness(1.3); }
|
|
|
+ 100% { filter: hue-rotate(360deg) saturate(2) brightness(1.2); }
|
|
|
+}
|
|
|
+
|
|
|
+/* 响应式设计 */
|
|
|
+@media (max-width: 768px) {
|
|
|
+ .scattered-fake-button {
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
+ font-size: 18px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .fake-loading-content {
|
|
|
+ padding: 30px;
|
|
|
+ margin: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .loading-spinner {
|
|
|
+ width: 70px;
|
|
|
+ height: 70px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .loading-bar {
|
|
|
+ width: 280px;
|
|
|
+ height: 25px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .moving-text {
|
|
|
+ font-size: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .ultra-mode-indicator {
|
|
|
+ left: 10px;
|
|
|
+ padding: 15px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .annoyance-meter {
|
|
|
+ width: 150px;
|
|
|
+ height: 20px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+/* 幸运转盘弹窗 */
|
|
|
+.lucky-wheel-overlay {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: rgba(0, 0, 0, 0.8);
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ z-index: 10001;
|
|
|
+ animation: fadeIn 0.3s ease-in-out;
|
|
|
+}
|
|
|
+
|
|
|
+.lucky-wheel-container {
|
|
|
+ background: linear-gradient(135deg, #ff6b6b, #feca57, #48dbfb, #ff9ff3);
|
|
|
+ background-size: 400% 400%;
|
|
|
+ animation: gradientShift 3s ease infinite, dialogBounce 0.5s ease-out;
|
|
|
+ border-radius: 20px;
|
|
|
+ padding: 30px;
|
|
|
+ max-width: 500px;
|
|
|
+ width: 90%;
|
|
|
+ text-align: center;
|
|
|
+ box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
|
|
|
+ border: 3px solid #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.wheel-header {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ padding: 12px;
|
|
|
+ background: linear-gradient(45deg, #ff6b6b, #ee5a52);
|
|
|
+ color: white;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+
|
|
|
+.wheel-close {
|
|
|
+ background: rgba(255,255,255,0.2);
|
|
|
+ border: none;
|
|
|
+ color: white;
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: bold;
|
|
|
+ cursor: pointer;
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ border-radius: 50%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+
|
|
|
+.wheel-content {
|
|
|
+ margin-top: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.wheel-display {
|
|
|
+ position: relative;
|
|
|
+ width: 200px;
|
|
|
+ height: 200px;
|
|
|
+ margin: 0 auto;
|
|
|
+ border-radius: 50%;
|
|
|
+ background: linear-gradient(45deg, #ff6b6b, #4ecdc4, #45b7d1, #96ceb4, #feca57, #ff9ff3);
|
|
|
+ animation: spin 3s linear infinite;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ font-size: 40px;
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes spin {
|
|
|
+ 0% { transform: rotate(0deg); }
|
|
|
+ 100% { transform: rotate(360deg); }
|
|
|
+}
|
|
|
+
|
|
|
+.wheel-pointer {
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+ font-size: 30px;
|
|
|
+ color: white;
|
|
|
+ animation: pointerMove 3s linear infinite;
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes pointerMove {
|
|
|
+ 0% { transform: translate(-50%, -50%) rotate(0deg); }
|
|
|
+ 50% { transform: translate(-50%, -50%) rotate(180deg); }
|
|
|
+ 100% { transform: translate(-50%, -50%) rotate(360deg); }
|
|
|
+}
|
|
|
+
|
|
|
+.wheel-result {
|
|
|
+ margin-top: 20px;
|
|
|
+ color: white;
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+
|
|
|
+.result-text {
|
|
|
+ margin-top: 10px;
|
|
|
+ font-size: 18px;
|
|
|
+}
|
|
|
+
|
|
|
+.wheel-buttons {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-top: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.spin-button, .spin-again-button {
|
|
|
+ flex: 1;
|
|
|
+ padding: 12px 25px;
|
|
|
+ border: none;
|
|
|
+ border-radius: 25px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ cursor: pointer;
|
|
|
+ transition: all 0.3s ease;
|
|
|
+}
|
|
|
+
|
|
|
+.spin-button:hover, .spin-again-button:hover {
|
|
|
+ transform: translateY(-2px);
|
|
|
+ box-shadow: 0 6px 20px rgba(255, 65, 108, 0.6);
|
|
|
+}
|
|
|
+
|
|
|
+.wheel-tips {
|
|
|
+ margin-top: 20px;
|
|
|
+ color: white;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+</style>
|
