我正在尝试制作演示-
1.(登陆)检查浏览器大小>更改多边形大小
2.单击按钮>更改多边形大小(更小)
3.调整浏览器大小>更改多边形大小
4.调整浏览器大小>检查是否已单击按钮到更小的模式之前 > 将多边形大小更改为更小
我被困在 4 中。我不知道如何将之前的状态传递给调整大小之后。它会再次计算。
任何建议将不胜感激。
Demo
$(function(){
var adivide=0;
var winwid = $(window).width();
function setadivide(){
winwid = $(window).width();
if(winwid > 800){
adivide = 8;
}
else{
adivide = 4;
}
console.log(adivide);
};
setadivide();
var awidth;
function acal(){
awidth = parseInt( winwid / adivide);
};
acal();
function setawidth(){
$('.a').css({width: awidth, height: awidth});
};
setawidth();
//****** button
//set btn visibility
function btnvis(){
switch(adivide){
case 4:
$('.plus').show();
$('.minus').hide();
break;
case 8:
$('.plus').show();
$('.minus').hide();
break;
}
};
btnvis();
//click btn update adivide and set btn visibility
function btnclick(){
$('.plus').click(function(){
switch(adivide){
case 4:
adivide = adivide -2;
console.log(adivide);
acal();
setawidth();
$('.plus').hide();
$('.minus').show();
break;
case 8:
adivide = adivide - 2;
console.log(adivide);
acal();
setawidth();
$('.plus').hide();
$('.minus').show();
break;
}
});
$('.minus').click(function(){
switch(adivide){
case 2:
adivide = adivide + 2;
console.log(adivide);
acal();
setawidth();
$('.plus').show();
$('.minus').hide();
break;
case 6:
adivide = adivide + 2;
console.log(adivide);
acal();
setawidth();
$('.plus').show();
$('.minus').hide();
break;
}
});
};
btnclick();
//end button ******
$(window).resize(function(){
setadivide();
acal();
setawidth();
//****** button
btnvis();
//end button ******
});
});