41 lines
1,009 B
JavaScript
41 lines
1,009 B
JavaScript
|
// ratio of each part's height to the width of the image (1082px)
|
||
|
|
var ratios = {
|
||
|
|
"top": 1.3577,
|
||
|
|
"leggies": 0.7311,
|
||
|
|
"bottom": 0.2431
|
||
|
|
}
|
||
|
|
// ratio of the image's height to its width
|
||
|
|
var overall_ratio = 2.3318;
|
||
|
|
var leggy_factor = 0;
|
||
|
|
|
||
|
|
function update_sizes() {
|
||
|
|
let target_height = window.innerHeight - 300;
|
||
|
|
let width = target_height / overall_ratio;
|
||
|
|
if (width > window.innerWidth * 0.90) {
|
||
|
|
width = window.innerWidth * 0.90;
|
||
|
|
}
|
||
|
|
dgel('big-leggy-lynne').style.width = `${width}px`;
|
||
|
|
for (let [part, ratio] of Object.entries(ratios)) {
|
||
|
|
dgel(`bll-${part}`).style.height = `${ratio * width}px`;
|
||
|
|
}
|
||
|
|
|
||
|
|
let leggy_height = ratios['leggies'] * width;
|
||
|
|
dgel('bll-leggies').style.height = `${leggy_height + leggy_factor * 25}px`;
|
||
|
|
}
|
||
|
|
|
||
|
|
window.addEventListener('resize', update_sizes);
|
||
|
|
|
||
|
|
window.onload = function () {
|
||
|
|
this.dgel('bll-enlarge').onclick = function () {
|
||
|
|
leggy_factor++;
|
||
|
|
update_sizes();
|
||
|
|
window.scrollTo({
|
||
|
|
left: 0,
|
||
|
|
top: document.body.scrollHeight,
|
||
|
|
behavior: "smooth"
|
||
|
|
})
|
||
|
|
}
|
||
|
|
|
||
|
|
update_sizes();
|
||
|
|
}
|