[Javascript] Resize add/remove Class

bubino8 · 27 Nov 2017

Buongiorno.
Ho bisogno di aggiungere e rimuovere una classe quando ridimensiono il browser.
Per ora faccio in questo modo.

HTML:

<body onresize="responsiveResize()">

Codice:

<script>
    function responsiveResize(){
        var w = window.innerWidth;
        if(w <= 850){
            $(".rad-sidebar").addClass("rad-nav-min");
            $(".rad-body-wrapper").addClass("rad-nav-min");
        }/*else{
            $(".rad-sidebar").removeClass("rad-nav-min");
            $(".rad-body-wrapper").removeClass("rad-nav-min");
        }*/
    }
</script>

In questo modo sotto 850px mi aggiunge la classe correttamente. Vorrei che se ridimensiono e ritorna superiore a 850px mi riaggiunge la classe.

Grazie

bubino8 · 27 Nov 2017

Piccola aggiunga

Codice:

<script>
    $(window).resize(function () {
        responsiveResize( $('#provatest') );
    });
    function responsiveResize(section){
        var w = window.innerWidth;
        var sect = section.hasClass( "rad-nav-min" ).toString();
        if (w <= 850 && sect == "true"){
            aggiungi();
        }
        else if (w > 850 && w <= 1100){
            aggiungi();
        }
        else if (w > 1100){
            rimuovi();
        }
    }
    function rimuovi(){
        $(".rad-sidebar").removeClass("rad-nav-min");
        $(".rad-body-wrapper").removeClass("rad-nav-min");
    }
    function aggiungi(){
        $(".rad-sidebar").addClass("rad-nav-min");
        $(".rad-body-wrapper").addClass("rad-nav-min");
    }
</script>

In questo modo diciamo che funziona. Unico problema se ridimensiono velocemente funziona probabilmente non carica il CSS in tempo

Cerca

Cerca

[Javascript] Resize add/remove Class

bubino8

Utente Attivo

bubino8

Utente Attivo

Discussioni simili