mirror of
https://github.com/WilliamsNY/contain-element.git
synced 2024-09-07 20:41:22 -04:00
Add new external functions to return the current width and height, and update the description of the getWidth and getHeight functions to make it more clear that they return the original width and height supplied for the element
This commit is contained in:
parent
7dae4c63fa
commit
23a7babcfb
3 changed files with 13 additions and 5 deletions
|
@ -45,8 +45,10 @@ window.onload = function() {
|
|||
* `setValign(valign)`: Set the vertical alignment (run `update()` to apply).
|
||||
* `setHalign(halign)`: Set the horizontal alignment (run `update()` to apply).
|
||||
* `setFit(fit)`: Set the object fit (run `update()` to apply).
|
||||
* `getWidth()`: Return the current width.
|
||||
* `getHeight()`: Return the current height.
|
||||
* `getWidth()`: Return the element width.
|
||||
* `getHeight()`: Return the element height.
|
||||
* `getCurrentWidth()`: Return the current width.
|
||||
* `getCurrentHeight()`: Return the current height.
|
||||
* `getValign()`: Return the current vertical alignment.
|
||||
* `getHalign()`: Return the current horizontal alignment.
|
||||
* `getFit()`: Return the current object fit.
|
||||
|
|
|
@ -121,12 +121,18 @@ function ContainElement(options) {
|
|||
// External function to set fit
|
||||
this.setFit = function(newFit) { fit = newFit; };
|
||||
|
||||
// External function to return the current elementWidth
|
||||
// External function to return the elementWidth
|
||||
this.getWidth = function() { return elementWidth; };
|
||||
|
||||
// External function to return the current elementHeight
|
||||
// External function to return the elementHeight
|
||||
this.getHeight = function() { return elementHeight; };
|
||||
|
||||
// External function to return the current width
|
||||
this.getCurrentWidth = function() { return scaleFactor * elementWidth; };
|
||||
|
||||
// External function to return the current height
|
||||
this.getCurrentHeight = function() { return scaleFactor * elementHeight; };
|
||||
|
||||
// External function to return the current valign
|
||||
this.getValign = function() { return valign; };
|
||||
|
||||
|
|
2
contain-element.min.js
vendored
2
contain-element.min.js
vendored
|
@ -1 +1 @@
|
|||
function ContainElement(t){function e(){var t=n.parentElement.offsetWidth,h=n.parentElement.offsetHeight;if(t&&h){if(i="cover"===r?t>h/l*s?t/s:h/l:"contain"===r?h>t/s*l?t/s:h/l:1,a?n.style.transform="scale("+i+")":(n.style.width=s*i+"px",n.style.height=l*i+"px"),t!==s*i)switch(f){case"left":n.style.left="0px";break;case"right":n.style.left=0-(s*i-t)+"px";break;default:n.style.left=0-(s*i-t)/2+"px"}else n.style.left="0px";if(h!==l*i)switch(o){case"top":n.style.top="0px";break;case"bottom":n.style.top=0-(l*i-h)+"px";break;default:n.style.top=0-(l*i-h)/2+"px"}else n.style.top="0px"}else window.setTimeout(e,30)}var i=1,n=t.element||document.getElementById(t.id),s=t.width||n.offsetWidth,l=t.height||n.offsetHeight,o=t.valign||"center",f=t.halign||"center",r=t.fit||"cover",a=t.scale;n.style.position="absolute",n.parentElement.style.overflow="hidden",a&&(n.style.transformOrigin="left top"),-1===["relative","absolute","fixed"].indexOf(window.getComputedStyle(n.parentElement,null).getPropertyValue("position"))&&(n.parentElement.style.position="relative"),e(),this.update=e,this.setWidth=function(t){s=t},this.setHeight=function(t){l=t},this.setValign=function(t){o=t},this.setHalign=function(t){f=t},this.setFit=function(t){r=t},this.getWidth=function(){return s},this.getHeight=function(){return l},this.getValign=function(){return o},this.getHalign=function(){return f},this.getFit=function(){return r},this.getScale=function(){return i}}
|
||||
function ContainElement(t){function e(){var t=n.parentElement.offsetWidth,h=n.parentElement.offsetHeight;if(t&&h){if(i="cover"===f?t>h/l*s?t/s:h/l:"contain"===f?h>t/s*l?t/s:h/l:1,a?n.style.transform="scale("+i+")":(n.style.width=s*i+"px",n.style.height=l*i+"px"),t!==s*i)switch(r){case"left":n.style.left="0px";break;case"right":n.style.left=0-(s*i-t)+"px";break;default:n.style.left=0-(s*i-t)/2+"px"}else n.style.left="0px";if(h!==l*i)switch(o){case"top":n.style.top="0px";break;case"bottom":n.style.top=0-(l*i-h)+"px";break;default:n.style.top=0-(l*i-h)/2+"px"}else n.style.top="0px"}else window.setTimeout(e,30)}var i=1,n=t.element||document.getElementById(t.id),s=t.width||n.offsetWidth,l=t.height||n.offsetHeight,o=t.valign||"center",r=t.halign||"center",f=t.fit||"cover",a=t.scale;n.style.position="absolute",n.parentElement.style.overflow="hidden",a&&(n.style.transformOrigin="left top"),-1===["relative","absolute","fixed"].indexOf(window.getComputedStyle(n.parentElement,null).getPropertyValue("position"))&&(n.parentElement.style.position="relative"),e(),this.update=e,this.setWidth=function(t){s=t},this.setHeight=function(t){l=t},this.setValign=function(t){o=t},this.setHalign=function(t){r=t},this.setFit=function(t){f=t},this.getWidth=function(){return s},this.getHeight=function(){return l},this.getCurrentWidth=function(){return i*s},this.getCurrentHeight=function(){return i*l},this.getValign=function(){return o},this.getHalign=function(){return r},this.getFit=function(){return f},this.getScale=function(){return i}}
|
Loading…
Reference in a new issue