diff --git a/src/views/filters/eav-filters.php b/src/views/filters/eav-filters.php
index c8e82ab..940744d 100644
--- a/src/views/filters/eav-filters.php
+++ b/src/views/filters/eav-filters.php
@@ -154,7 +154,14 @@ class="slider-range"
 
                 ?>
 
-                <?= $form->field($handler, $code, [
+                <?
+                $classCss = 'js-scrollbar';
+                if (\Yii::$app->mobileDetect->isMobile) {
+                    $classCss = 'js-scrollbar-native';
+                } else {
+                    $classCss = 'js-scrollbar';
+                }
+                echo $form->field($handler, $code, [
                     'options'  => [
                         'class' => 'filter--group sx-filter ' . $class,
                         'tag'   => 'section',
@@ -164,7 +171,7 @@ class="slider-range"
 <div>
     <div class="filter--group--body">
         {$searchOptions}
-        <div class="js-scrollbar" style="max-height: 280px;">
+        <div class="{$classCss}">
         {input}
         </div>
     </div>
diff --git a/src/widgets/filters/assets/src/css/filters.css b/src/widgets/filters/assets/src/css/filters.css
index fe341e4..4a4abc4 100644
--- a/src/widgets/filters/assets/src/css/filters.css
+++ b/src/widgets/filters/assets/src/css/filters.css
@@ -41,6 +41,13 @@
     padding: 0 15px 0 15px;
 }
 
+
+.filter--group .filter--group--body .js-scrollbar,
+.filter--group .filter--group--body .js-scrollbar-native {
+    max-height: 280px;
+    overflow-x: auto;
+}
+
 .filter--group .filter--group--inner {
     /*padding: 0 10px 0 10px;*/
 }
diff --git a/src/widgets/filters/assets/src/js/filters.js b/src/widgets/filters/assets/src/js/filters.js
index 20fb0c9..17576e1 100644
--- a/src/widgets/filters/assets/src/js/filters.js
+++ b/src/widgets/filters/assets/src/js/filters.js
@@ -18,11 +18,13 @@
             });
             $('body').on("click", ".sx-btn-filter", function () {
                 $('.sx-filters-block').animate({left: '0'});
+                $('.sx-filters-block').trigger("show");
                 return false;
             });
 
             $('body').on("click", ".sx-mobile-filters-hide", function () {
                 $('.sx-filters-block').animate({left: '-100%'});
+                $('.sx-filters-block').trigger("hide");
                 return false;
             });