Skip to content

Instantly share code, notes, and snippets.

@rexboy7 rexboy7/example.js
Created Aug 7, 2017

Embed
What would you like to do?
/*************************************************/
// 1.When elements < 24px, say height is 16px:
highlightHeight = targetRect.height; // got 16
//
let highlightHeightWithMin = Math.max(highlightHeight, parseFloat(highlightStyle.minHeight)); // got max(16, 24) = 24
//
let offsetY = -(Math.max(0, highlightHeightWithMin - targetRect.height) / 2); // (24 - 16) > 0, so the max() is not needed.
/*************************************************/
// 2.When elements >= 24px, ex. height = 32px;
highlightHeight = targetRect.height; // 32px;
//
let highlightHeightWithMin = Math.max(highlightHeight, parseFloat(highlightStyle.minHeight)); // max(32, 24) = 32
//
let offsetY = -(Math.max(0, highlightHeightWithMin - targetRect.height) / 2); // (32 - 32) = 0, so the max() is still not needed.
/*************************************************/
// 3.When it’s a toolbar button, which has dimension of 38x32:
highlightHeight = targetRect.height; // 38px;
//
highlightHeight = highlightWidth; // 32px
//
let highlightHeightWithMin = Math.max(highlightHeight, parseFloat(highlightStyle.minHeight)); // max(32, 24) = 32
//
// Before:
let offsetY = -(Math.max(0, highlightHeightWithMin - targetRect.height) / 2); // -(Math.max(0, 32 - 38) / 2) = 0, not expected result.
// After:
let offsetY = (targetRect.height - highlightHeightWithMin) / 2; // (38 - 32) / 2 = 3, expected result.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.