上傳檔案到「web」
parent
c4f41802d5
commit
c801a2824a
@ -0,0 +1,65 @@
|
|||||||
|
$(document).ready(function () {
|
||||||
|
const resizer = $('#resizer');
|
||||||
|
const leftSide = resizer.prev();
|
||||||
|
const rightSide = resizer.next();
|
||||||
|
let x = 0;
|
||||||
|
let leftWidth = 0;
|
||||||
|
|
||||||
|
const mouseDownHandler = function (e) {
|
||||||
|
x = e.clientX;
|
||||||
|
leftWidth = leftSide.width();
|
||||||
|
|
||||||
|
$(document).on('mousemove', mouseMoveHandler);
|
||||||
|
$(document).on('mouseup', mouseUpHandler);
|
||||||
|
};
|
||||||
|
|
||||||
|
const mouseMoveHandler = function (e) {
|
||||||
|
const dx = e.clientX - x;
|
||||||
|
const newLeftWidth = ((leftWidth + dx) * 100) / resizer.parent().width();
|
||||||
|
leftSide.css('width', `${newLeftWidth}%`);
|
||||||
|
};
|
||||||
|
|
||||||
|
const mouseUpHandler = function () {
|
||||||
|
$(document).off('mousemove', mouseMoveHandler);
|
||||||
|
$(document).off('mouseup', mouseUpHandler);
|
||||||
|
};
|
||||||
|
|
||||||
|
resizer.on('mousedown', mouseDownHandler);
|
||||||
|
|
||||||
|
// Tab and content handling
|
||||||
|
const contents = $('.content-tab');
|
||||||
|
const tab = $('.tab');
|
||||||
|
|
||||||
|
tab.on('click', function () {
|
||||||
|
const id = $(this).data('content');
|
||||||
|
tab.removeClass('active');
|
||||||
|
$(this).addClass('active');
|
||||||
|
contents.removeClass('active');
|
||||||
|
$(`#${id}`).addClass('active');
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
if (id === 'about') {
|
||||||
|
$.when(
|
||||||
|
$.getScript('sketch.js'),
|
||||||
|
$.getScript('box.js')
|
||||||
|
).done(function () {
|
||||||
|
initMatterJS();
|
||||||
|
createBoxes();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const subtab = $('.subtab');
|
||||||
|
subtab.on('click', function () {
|
||||||
|
const id = $(this).data('content');
|
||||||
|
$(this).addClass('active');
|
||||||
|
contents.removeClass('active');
|
||||||
|
$(`#${id}`).addClass('active');
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
// Initially show the about tab
|
||||||
|
$('.tab[data-content="about"]').click();
|
||||||
|
});
|
||||||
|
|
Loading…
Reference in New Issue