鼠标点击网页任意地方，出文字符号表情的特效，颜色随机
// ==UserScript==
// @name 鼠标点击特效666
// @namespace yeysou
// @license MIT
// @version 0.1.1
// @description 鼠标点击网页任意地方，出文字符号表情的特效，颜色随机
// @author yeysou
// @match *://*/*
// @grant none
// @icon data:image/png;base64,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
// @require https://code.jquery.com/jquery-3.6.0.min.js
// @require https://code.jquery.com/ui/1.12.1/jquery-ui.min.js
// ==/UserScript==
/* global $ */
function getRandomInt(min, max) {
// 确保参数为整数
min = Math.ceil(min);
max = Math.floor(max);
// 生成 [min, max] 之间的随机整数
return Math.floor(Math.random() * (max - min + 1)) + min;
}
(function() {
'use strict';
//缓慢消失
$.fn.scaleFadeOut = function(options) {
// 默认配置
const settings = $.extend({
scale: 2,// 放大倍数（2表示放大到原来的2倍）
duration: 800,// 动画持续时间(毫秒)
easing: 'swing' // 缓动函数
}, options);
const $element = $(this);
// 记录原始样式（用于动画结束后恢复，可选）
const originalTransform = $element.css('transform');
const originalOpacity = $element.css('opacity');
// 执行放大消失动画
$element.animate({
opacity: 0 // 透明度逐渐变为0
}, {
duration: settings.duration,
easing: settings.easing,
// 每帧更新缩放比例
step: function(now, fx) {
// 计算当前进度（0-1）
const progress = now === 0 ? 1 : (1 - now);
// 根据进度计算缩放比例（从1到设定的放大倍数）
const scaleValue = 1 + (settings.scale - 1) * (1 - progress);
// 应用缩放变换
$(this).css('transform', `scale(${scaleValue})`);
},
// 动画结束回调
complete: function() {
// 恢复原始样式（如果需要）
$(this).css({
transform: originalTransform,
opacity: originalOpacity
});
// 触发自定义回调
if (settings.complete) {
settings.complete.call(this);
}
}
});
// 支持链式调用
return this;
};
// 定义带弧度的跳跃效果jQuery方法
$.fn.arcBounce = function(options) {
// 默认配置
const settings = $.extend({
distance: 300, // 水平总距离
height: 150, // 跳跃高度
jumps: 3,// 跳跃次数
duration: 1000,// 单次跳跃持续时间(ms)
gravity: 0.8,// 重力系数(值越大下落越快)
damping: 0.7// 阻尼系数(每次跳跃衰减比例)
}, options);
const $element = $(this);
const originalPosition = $element.css('position');
const startLeft = parseInt($element.css('left') || 0);
const startTop = parseInt($element.css('top') || 0);
// 确保元素可以被定位
if (!['absolute', 'fixed', 'relative'].includes(originalPosition)) {
$element.css('position', 'relative');
}
// 执行多段弧形跳跃
let currentLeft = startLeft;
let currentJump = 0;
function performJump() {
if (currentJump >= settings.jumps) {
// 所有跳跃完成后的回调
if (settings.complete) {
settings.complete.call($element);
}
return;
}
// 计算当前跳跃的参数(随次数衰减)
const jumpDistance = settings.distance * Math.pow(settings.damping, currentJump);
const jumpHeight = settings.height * Math.pow(settings.damping, currentJump);
const jumpDuration = settings.duration * (1 - currentJump * 0.1); // 后续跳跃稍慢
const targetLeft = currentLeft - jumpDistance;
let startTime;
let progress = 0;
// 抛物线跳跃动画
function animate(timestamp) {
if (!startTime) startTime = timestamp;
const elapsed = timestamp - startTime;
progress = Math.min(elapsed / jumpDuration, 1);
// 计算水平位置(线性移动)
const newLeft = currentLeft - (jumpDistance * progress);
// 计算垂直位置(抛物线轨迹: y = -4h(x² - x)，形成弧形)
// 加入重力效果，使下落更快
const arcProgress = -4 * jumpHeight * (progress * progress - progress);
const gravityEffect = Math.pow(progress - 0.5, 2) * settings.gravity * jumpHeight;
const newTop = startTop - (arcProgress - gravityEffect);
// 应用新位置
$element.css({
left: newLeft + 'px',
top: newTop + 'px',
// transform: 'rotate('+progress*360+'deg)'
});
// 继续动画或结束当前跳跃
if (progress < 1) {
requestAnimationFrame(animate);
} else {
currentLeft = targetLeft;
currentJump++;
// 稍微延迟后开始下一次跳跃，增强节奏感
setTimeout(performJump, 0);
}
}
requestAnimationFrame(animate);
}
// 开始第一段跳跃
performJump();
// 支持链式调用
return this;
};
// 跳动效果函数
function bounce($element) {
const originalPosition = $element.css('position');
const originalTop = $element.css('top');
const originalLeft = $element.css('left');
const bounceDamping = 0.8; // 弹跳阻尼（每次弹起高度衰减比例，0-1之间）
// 确保元素可以被定位
if (originalPosition !== 'absolute' && originalPosition !== 'fixed') {
$element.css('position', 'relative');
}
// 记录初始位置（用于计算相对移动）
const startTop = parseInt($element.css('top') || 0);
const startLeft = parseInt($element.css('left') || 0);
/*
.animate({ top: startTop,left:startLeft-500*(1-bounceDamping)}, 200, 'swing')//落地
.animate({ top: startTop - 150*bounceDamping**2,left:startLeft-500*(1-bounceDamping**2) }, 200, 'swing')//向上跳
.animate({ top: startTop,left:startLeft-500*(1-bounceDamping**2)}, 200, 'swing')//落地
.animate({ top: startTop - 150*bounceDamping**3,left:startLeft-500*(1-bounceDamping**3) }, 200, 'swing')//向上跳
.animate({ top: startTop,left:startLeft-500*(1-bounceDamping**3)}, 200, 'swing')//落地
.animate({ top: startTop - 150*bounceDamping**4,left:startLeft-500*(1-bounceDamping**4) }, 200, 'swing')//向上跳*/
// 1. 跳动效果（向上再落下）
// 2. 落地后旋转并向左移动
$element.animate({
//left: startLeft - 800,// 向左移动200px
left:startLeft - 500,
rotate: '-720deg'// 旋转360度
}, {
duration: 2000,
easing: 'swing',
step: function(now, fx) {
// 处理旋转动画（jQuery本身不支持rotate，需要手动设置transform）
if (fx.prop === 'rotate') {
var opa= $(this).css("opacity");
$(this).css('opacity', opa-0.005);
$(this).css('transform', `rotate(${now}deg)`);
}
},
complete: () => {
//$element.remove();
$element.scaleFadeOut({
scale: 10,// 放大到3倍
duration: 500,// 1秒内完成动画
complete: function() {
// 动画结束后可以隐藏或移除元素
$(this).remove();
// 如需重复使用，可在适当时候显示
// setTimeout(() => $(this).show(), 1000);
}
});
}
});
}
var a_idx = 0;
const 前颜色码库 = new Array('00', '11', '22', '1', '44', '55', '66', '77', '88', '99',
'aa', 'bb', 'cc', 'dd', 'ee', 'ff');
const 中颜色码库 = new Array('00', '11', '22', '33', '44', '55', '66', '77', '88', '99',
'aa', 'bb', 'cc', 'dd', 'ee', 'ff');
const 后颜色码库 = new Array('00', '11', '22', '33', '44', '55', '66', '77', '88', '99',
'aa', 'bb', 'cc', 'dd', 'ee', 'ff');
var 前颜色码 ;var 中颜色码;var 后颜色码;
var timerrrr = setInterval(function(){
前颜色码 = Math.floor(Math.random() * 前颜色码库.length);
中颜色码 = Math.floor(Math.random() * 中颜色码库.length);
后颜色码 = Math.floor(Math.random() * 后颜色码库.length);
},150)
$("body").click(function(e) {
var a = new Array("我","超","牛","逼");
var $i = $("<span/>").text(a[a_idx]);
a_idx = (a_idx + 1) % a.length;
var x = e.pageX,
y = e.pageY;
var size = getRandomInt(30,60);
$i.css({
"z-index": 99999999,
"top": y-size-10,
"left": x-size,
"font-size":size,
"position": "absolute",
"font-weight": "bold",
"color": "#" + 前颜色码库[前颜色码] + 中颜色码库[中颜色码] + 后颜色码库[后颜色码]
});
$("body").append($i);
var rt = getRandomInt(2,5);
var rl = getRandomInt(3,6);
//bounce($i)
// move($i)
$i.arcBounce({
distance: rl*50, // 水平距离
height: 50*rt, // 跳跃高度
jumps: 10,// 跳跃次数
duration: 300,// 单次跳跃时间
gravity: 1,// 重力系数
damping: 0.6,// 阻尼系数
complete: function() {
// 跳跃完成后的回调函数
bounce($i);
}
});
});
})();