Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support overflow: visible on the parent of the panzoom div #427

Closed
mattnathan opened this issue Nov 21, 2019 · 3 comments
Closed

Support overflow: visible on the parent of the panzoom div #427

mattnathan opened this issue Nov 21, 2019 · 3 comments

Comments

@mattnathan
Copy link

Subject of the issue

I'd like to be able to change the overflow so that I can present the panzoom element behind surrounding elements. While I could use css and !important it'd be nice to avoid that with a configuration option to change the behaviour of panzoom.

I don't need this to be fully configurable, but I do need it to be visible (or initial as that's the default).

Your environment

  • Version of panzoom: 7c9d819
  • Browser and browser version: Google Chrome | 78.0.3904.97

Expected behaviour

const parent = document.createElement('div')
const div = document.createElement('div')
parent.appendChild(div)
document.body.appendChild(parent)
const panzoom = Panzoom(div, {overflow: 'visible'})
assert.equal(parent.style.overflow, 'visible', 'Overflow option is set on the parent')

Actual behaviour

Overflow is always hidden

@timmywil
Copy link
Owner

Thanks for the issue. I'm okay with adding this.

@mattnathan
Copy link
Author

Thank you for accepting the change and for the quick turn around

timmywil added a commit that referenced this issue Dec 16, 2019
# [4.0.0](3.2.3...4.0.0) (2019-12-16)

### Bug Fixes

* **contain:** always set scale before using constrainXY ([761a0ec](761a0ec)), closes [#426](#426)
* **css:** fix border width retrieval in Firefox ([5d2f580](5d2f580))
* **events:** fallback to touch and mouse events ([#399](#399)) ([2c4c303](2c4c303))
* **events:** fix triggering panzoomend for one pointer event ([f23e0fa](f23e0fa)), closes [#428](#428)
* **handledown:** exclude descendents of excluded parents ([b2f943a](b2f943a)), closes [#431](#431)
* **handleup:** remove pointer regardless of isPanning state ([8938b29](8938b29)), closes [#402](#402) [#403](#403)
* **reset:** use setTransform passed to reset options ([2adbb4e](2adbb4e))
* **setoptions:** set cursor style with the option ([9c8efb4](9c8efb4))
* **setstyle:** remove unnecessary param from exposed setStyle ([c9bcf94](c9bcf94))
* **zoom:** account for smaller elements and padding/border ([3fe89a1](3fe89a1))
* **zoom:** need the before and after dimensions to constrain ([7c2c982](7c2c982)), closes [#426](#426)
* **zoom:** set min and max scale based on containment ([d05f1e7](d05f1e7)), closes [#426](#426)

### Features

* basic panning and zooming functionality ([e80270f](e80270f))
* clean slate with typescript, rollup, and semantic-release ([27a0887](27a0887))
* **centering:** switch to default transform origins ([b483cda](b483cda))
* **contain:** add contain: 'outside' option ([1571e99](1571e99))
* **events:** add custom events for panning and zooming ([#398](#398)) ([7713025](7713025))
* **exclude:** add exclude option; change clickableClass to excludeClass ([da72c32](da72c32)), closes [#411](#411)
* **handlestartevent:** add option to handle the start event ([931743a](931743a)), closes [#414](#414)
* **overflow:** add an option to override the parent's overflow ([77032bb](77032bb)), closes [#427](#427)
* add a destroy method ([#404](#404)) ([c88ef75](c88ef75))
* add animate option to transition the transforms ([d9a8e67](d9a8e67))
* **pan:** add contain: 'inside' option ([a7078e8](a7078e8))
* **pan:** add panOnlyWhenZoomed option ([5559967](5559967))
* **panzoom:** add the force option ([0ba521a](0ba521a)), closes [#413](#413)
* **zoom:** implement focal point zooming without matrices ([5d077f1](5d077f1))
* **zoom:** pinch zooming with pointer events! ([5ddbd30](5ddbd30))

### Performance Improvements

* **pan:** make move/cancel listeners passive ([f647163](f647163))

### BREAKING CHANGES

* This is a complete rewrite of the panzoom library
to be a standard JS lib that doesn't rely on jQuery,
but can still integrate as a plugin
timmywil added a commit that referenced this issue Dec 16, 2019
# [4.0.0](3.2.3...4.0.0) (2019-12-16)

### Bug Fixes

* **contain:** always set scale before using constrainXY ([761a0ec](761a0ec)), closes [#426](#426)
* **css:** fix border width retrieval in Firefox ([5d2f580](5d2f580))
* **events:** fallback to touch and mouse events ([#399](#399)) ([2c4c303](2c4c303))
* **events:** fix triggering panzoomend for one pointer event ([f23e0fa](f23e0fa)), closes [#428](#428)
* **handledown:** exclude descendents of excluded parents ([b2f943a](b2f943a)), closes [#431](#431)
* **handleup:** remove pointer regardless of isPanning state ([8938b29](8938b29)), closes [#402](#402) [#403](#403)
* **reset:** use setTransform passed to reset options ([2adbb4e](2adbb4e))
* **setoptions:** set cursor style with the option ([9c8efb4](9c8efb4))
* **setstyle:** remove unnecessary param from exposed setStyle ([c9bcf94](c9bcf94))
* **zoom:** account for smaller elements and padding/border ([3fe89a1](3fe89a1))
* **zoom:** need the before and after dimensions to constrain ([7c2c982](7c2c982)), closes [#426](#426)
* **zoom:** set min and max scale based on containment ([d05f1e7](d05f1e7)), closes [#426](#426)

### Features

* basic panning and zooming functionality ([e80270f](e80270f))
* clean slate with typescript, rollup, and semantic-release ([27a0887](27a0887))
* **centering:** switch to default transform origins ([b483cda](b483cda))
* **contain:** add contain: 'outside' option ([1571e99](1571e99))
* **events:** add custom events for panning and zooming ([#398](#398)) ([7713025](7713025))
* **exclude:** add exclude option; change clickableClass to excludeClass ([da72c32](da72c32)), closes [#411](#411)
* **handlestartevent:** add option to handle the start event ([931743a](931743a)), closes [#414](#414)
* **overflow:** add an option to override the parent's overflow ([77032bb](77032bb)), closes [#427](#427)
* add a destroy method ([#404](#404)) ([c88ef75](c88ef75))
* add animate option to transition the transforms ([d9a8e67](d9a8e67))
* **pan:** add contain: 'inside' option ([a7078e8](a7078e8))
* **pan:** add panOnlyWhenZoomed option ([5559967](5559967))
* **panzoom:** add the force option ([0ba521a](0ba521a)), closes [#413](#413)
* **zoom:** implement focal point zooming without matrices ([5d077f1](5d077f1))
* **zoom:** pinch zooming with pointer events! ([5ddbd30](5ddbd30))

### Performance Improvements

* **pan:** make move/cancel listeners passive ([f647163](f647163))

### BREAKING CHANGES

* This is a complete rewrite of the panzoom library
to be a standard JS lib that doesn't rely on jQuery,
but can still integrate as a plugin
timmywil added a commit that referenced this issue Dec 16, 2019
# [4.0.0](3.2.3...4.0.0) (2019-12-16)

### Bug Fixes

* **contain:** always set scale before using constrainXY ([761a0ec](761a0ec)), closes [#426](#426)
* **css:** fix border width retrieval in Firefox ([5d2f580](5d2f580))
* **events:** fallback to touch and mouse events ([#399](#399)) ([2c4c303](2c4c303))
* **events:** fix triggering panzoomend for one pointer event ([f23e0fa](f23e0fa)), closes [#428](#428)
* **handledown:** exclude descendents of excluded parents ([b2f943a](b2f943a)), closes [#431](#431)
* **handleup:** remove pointer regardless of isPanning state ([8938b29](8938b29)), closes [#402](#402) [#403](#403)
* **reset:** use setTransform passed to reset options ([2adbb4e](2adbb4e))
* **setoptions:** set cursor style with the option ([9c8efb4](9c8efb4))
* **setstyle:** remove unnecessary param from exposed setStyle ([c9bcf94](c9bcf94))
* **zoom:** account for smaller elements and padding/border ([3fe89a1](3fe89a1))
* **zoom:** need the before and after dimensions to constrain ([7c2c982](7c2c982)), closes [#426](#426)
* **zoom:** set min and max scale based on containment ([d05f1e7](d05f1e7)), closes [#426](#426)

### Features

* basic panning and zooming functionality ([e80270f](e80270f))
* clean slate with typescript, rollup, and semantic-release ([27a0887](27a0887))
* **centering:** switch to default transform origins ([b483cda](b483cda))
* **contain:** add contain: 'outside' option ([1571e99](1571e99))
* **events:** add custom events for panning and zooming ([#398](#398)) ([7713025](7713025))
* **exclude:** add exclude option; change clickableClass to excludeClass ([da72c32](da72c32)), closes [#411](#411)
* **handlestartevent:** add option to handle the start event ([931743a](931743a)), closes [#414](#414)
* **overflow:** add an option to override the parent's overflow ([77032bb](77032bb)), closes [#427](#427)
* add a destroy method ([#404](#404)) ([c88ef75](c88ef75))
* add animate option to transition the transforms ([d9a8e67](d9a8e67))
* **pan:** add contain: 'inside' option ([a7078e8](a7078e8))
* **pan:** add panOnlyWhenZoomed option ([5559967](5559967))
* **panzoom:** add the force option ([0ba521a](0ba521a)), closes [#413](#413)
* **zoom:** implement focal point zooming without matrices ([5d077f1](5d077f1))
* **zoom:** pinch zooming with pointer events! ([5ddbd30](5ddbd30))

### Performance Improvements

* **pan:** make move/cancel listeners passive ([f647163](f647163))

### BREAKING CHANGES

* This is a complete rewrite of the panzoom library
to be a standard JS lib that doesn't rely on jQuery,
but can still integrate as a plugin
@timmywil
Copy link
Owner

🎉 This issue has been resolved in version 4.0.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

@lock lock bot locked as resolved and limited conversation to collaborators Jun 24, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

2 participants