You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
59 lines
1.5 KiB
JavaScript
59 lines
1.5 KiB
JavaScript
$(document).ready(function(){
|
|
|
|
|
|
// ------------ DRAG ------------
|
|
|
|
$( function() {
|
|
$( ".draggable" ).draggable();
|
|
});
|
|
//{ containment: [-1300,-750,1800,1250] }
|
|
// ------------ ZOOM -------------
|
|
|
|
// $(window).on('wheel', function(event){
|
|
// var zoom_wheel = 1.0;
|
|
|
|
// // deltaY obviously records vertical scroll, deltaX and deltaZ exist too
|
|
// if(event.originalEvent.deltaY < 0){
|
|
// zoom_wheel += 0.1;
|
|
// var zoom_lvl = zoom_wheel.toString();
|
|
// $('#chaos').css('transform', 'scale(' + zoom_lvl + ',' + zoom_lvl + ')');
|
|
// }
|
|
// else {
|
|
// zoom_wheel -= 0.1;
|
|
// var zoom_lvl = zoom_wheel.toString();
|
|
// $('#chaos').css('transform', 'scale(' + zoom_lvl + ',' + zoom_lvl + ')');
|
|
// }
|
|
// });
|
|
|
|
|
|
|
|
function zoom(event) {
|
|
|
|
$("body").mousemove(function(event){
|
|
var relX = event.pageX - $(this).offset().left;
|
|
var relY = event.pageY - $(this).offset().top;
|
|
|
|
var x_lvl = relX.toString();
|
|
var y_lvl = relY.toString();
|
|
$('body').css('transform-origin', x_lvl + " " + relY);
|
|
});
|
|
|
|
event.preventDefault();
|
|
|
|
scale += event.deltaY * -0.01;
|
|
|
|
// Restrict scale
|
|
scale = Math.min(Math.max(.125, scale), 4);
|
|
|
|
// Apply scale transform
|
|
el.style.transform = `scale(${scale})`;
|
|
|
|
|
|
}
|
|
|
|
let scale = 1;
|
|
const el = document.querySelector('body');
|
|
el.onwheel = zoom;
|
|
|
|
|
|
}); |