How to add remove class on resize window اضافة كلاس لاحجام الشاشات

add remove class jquery angularjs arabichtml

add remove class on resize window
عندما يكون التصميم متجاوب لاحجام الشاشات نواجة بعض المشاكل حسب كل تصميم و نريد الغاء او اضافة اسايل معين في وقت معين من هنا يمكننا حل هذة المشكلة باضافة او الغاء كلاس في حجم معين من الشاشة

jQuery

$(function () {

    $(window).bind("resize", function () {
        if ($(this).width() <= 500) {
            $('div').addClass('yourClassName');
        } else {
            $('div').removeClass('yourClassName');
        }
    }).trigger('resize');
})

angularJS

app.directive('resizer', ['$window', function ($window) {
    return {
        restrict: 'A',
        link: function (scope, elem, attrs) {
            angular.element($window).on('resize', function () {
                $window.innerWidth <= 500 ?
                    elem.addClass('yourClassName') : elem.removeClass('yourClassName')
            });
        }
    }
}]);
  • AngularJS jQuery
  • addClass removeClass resize window