LLWiki正在建设中,欢迎加入我们!
“MediaWiki:Gadget-pxruler.js”的版本间差异
跳转到导航
跳转到搜索
小 |
小 |
||
第34行: | 第34行: | ||
} |
} |
||
function selecting(e) { |
function selecting(e) { |
||
const body = $('body'); |
|||
x[0] = e.pageX; |
x[0] = e.pageX; |
||
y[0] = e.pageY; |
y[0] = e.pageY; |
2020年12月10日 (四) 10:46的最新版本
//<nowiki> // 由ResourceLoader直接调用,不可使用ES6语法 /** * @Name: 屏幕像素测距器 * @Author: [[moegirl:user:商火]] * @Version: 1.1 * @Source: [[moegirl:user:商火/pxruler.js]] * @Function: 计算屏幕上两个点的像素差 */ "use strict"; /*global $, wgULS*/ var x = [null, null, null], y = [null, null, null], flag = false, n = 1; const p1 = $('<p>').append(['x1:', $('<span>', {id: 'point1x'}), ' y1:', $('<span>', {id: 'point1y'})]), p2 = $('<p>').append(['x2:', $('<span>', {id: 'point2x'}), ' y2:', $('<span>', {id: 'point2y'})]), pDelta = $('<p>').append(['Δx:', $('<span>', {id: 'deltaX'}), ' Δy:', $('<span>', {id: 'deltaY'})]), p3 = $('<p>').append(['x:', $('<span>', {id: 'point3x'}), ' y:', $('<span>', {id: 'point3y'})]), table = $('<div>', {id: "pxrulertable", html: [p1, p2, pDelta, p3]}), pt = $('<div>', {class: "pxpoint"}), points = [table, pt.clone().attr('id', "point1"), pt.clone().attr('id', "point2"), pt.attr('id', "point3")], pointDiv = $('<div>', {id: 'pxrulerpoint', html: points}), toggle = $('<div>', {id: "pxruler_toggle", text: wgULS("像素测距", "像素測距")}).click(pxruler); function pxruler() { if (flag) { $('body').off('mousedown mousemove mousewheel'); } else { $('body').mousedown( setpoint ).on('mousemove mousewheel', selecting); table.find( 'span' ).text('--'); $('.pxpoint').css({left: '', top: ''}); x.fill(null); y.fill(null); n = 1; } flag = !flag; pointDiv.toggle(); } function selecting(e) { x[0] = e.pageX; y[0] = e.pageY; pt.css({left: x[0] - 4 + 'px', top: y[0] - 4 + 'px'}); $('#point3x').text(x[0]); $('#point3y').text(y[0]); } function setpoint() { x[n] = x[0]; y[n] = y[0]; points[n].css({left: x[0] - 4 + 'px', top: y[0] - 4 + 'px'}); pt.css('background-color', n === 1 ? '#6cf' : ''); $('#point' + n + 'x').text(x[0]); $('#point' + n + 'y').text(y[0]); n = 3 - n; if (!x[2]) { return; } $('#deltaX').text(x[2] - x[1]); $('#deltaY').text(y[2] - y[1]); } $(function() { pointDiv.insertAfter( '#footer' ).hide(); toggle.insertAfter( pointDiv ); }); //</nowiki> // [[category:作为模块的小工具]] [[category:编辑工具]] [[category:需要用户权限的小工具]] [[category:桌面版小工具]] // {{DEFAULTSORT:pxruler.js}}