Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 1,000,000+ packages pre-installed, including math-cover with all npm packages installed. Try it out:

var mathCover = require("math-cover")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

math-cover v0.2.1

Calculates the size and the position of a target to fit a container, adjusted to keep a focus point

math-cover

Calculates the size and the position of a target to fit a container, adjusted to keep a focus point

A mix of jquery-focuspoint and math-fit

Install

npm i math-cover

Examples

Without focus point

var cover = require('math-cover')

var target = {
  w: 200,
  h: 100
}
var parent = {
  w: 100,
  h: 200
}

// {left: -150, top: 0, width: 400, height: 200, scale: 2, position: '50% 50%'}
var obj = cover(target, parent)

With focus point

Params x and y are ratio of target.w and target.h and must be 0 <= ratio <= 1

var cover = require('math-cover')

var target = {
  w: 200,
  h: 100,
  x: .2,
  y: .2
}
var parent = {
  w: 100,
  h: 200
}

// {left: -30, top: 0, width: 400, height: 200, scale: 2, position: '10% 50%'}
var obj = cover(target, parent)

Demo

demo

npm i && npm start
KeydownAction
wrandom width
hrandom height
urandom width + height
irandom image
d or spacetoggle debug

Thanks

Mainly forked / inspired on jquery-focuspoint and math-fit

License

MIT

Metadata

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free