0

我正在尝试制作演示-
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 ******
});
});
4

1 回答 1

2

(编辑答案)

修改您的 setadivide 函数以考虑当前adivide值(即当前状态):

function setadivide(){    
    winwid = $(window).width();    
    if(winwid > 800){
        if (adivide == 2)
           adivide = 6;
        else if (adivide != 6)
           adivide = 8;
    }
    else{
        if (adivide == 6)
           adivide = 2;
        else if (adivide != 2)
           adivide = 4;
    }
    console.log(adivide);
};

修改后的演示

于 2012-11-30T07:44:51.243 回答