deblan-mirror/vanilla-tilt.js
deblan-mirror/vanilla-tilt.js
1
0
Fork 0
mirror of https://github.com/micku7zu/vanilla-tilt.js synced 2024-06-26 01:00:00 +02:00
Code Issues Projects Releases Wiki Activity

Add angle rotation to glare

Browse source
This commit is contained in:
Sergiu Sandor 2017-06-13 15:41:30 +03:00
parent 20a1d7fdf1
commit bf66b33229
1 changed files with 7 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/vanilla-tilt.js
View file

@ -113,12 +113,14 @@ export default class VanillaTilt {
let tiltX = (this.reverse * (this.settings.max / 2 - x * this.settings.max)).toFixed(2);
let tiltY = (this.reverse * (y * this.settings.max - this.settings.max / 2)).toFixed(2);
let angle = Math.atan2(this.event.clientX - (this.left + this.width / 2), -(this.event.clientY - (this.top + this.height / 2))) * (180 / Math.PI);
return {
tiltX: tiltX,
tiltY: tiltY,
percentageX: x * 100,
percentageY: y * 100
percentageY: y * 100,
angle: angle
};
}
@ -191,8 +193,8 @@ export default class VanillaTilt {
'left': '50%',
'pointer-events': 'none',
'background-image': `linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%)`,
'width': `${this.element.offsetWidth*2}px`,
'height': `${this.element.offsetWidth*2}px`,
'width': `${this.element.offsetWidth * 2}px`,
'height': `${this.element.offsetWidth * 2}px`,
'transform': 'rotate(180deg) translate(-50%, -50%)',
'transform-origin': '0% 0%',
'opacity': '0',
@ -203,8 +205,8 @@ export default class VanillaTilt {
updateGlareSize() {
Object.assign(this.glareElement.style, {
'width': `${this.element.offsetWidth*2}`,
'height': `${this.element.offsetWidth*2}`,
'width': `${this.element.offsetWidth * 2}`,
'height': `${this.element.offsetWidth * 2}`,
});
}