Adjust content style based on Side Menu open

ionic-v1
1

I’m working on setting a webkit filter on my ion-menu-content pane by having it watch the $ionicSideMenusController open ratio, similar to the fade-bar example. Now the issue I’m having is getting the value for the filter for brightness set to 100% initially then reduce that to 50% as the menu opens.

It seems like it should be pretty straight forward but I’m not sure what the issue is. Any ideas?

.directive('darken', function ($timeout) {
  'use strict';
  return {
    restrict: 'A',
    link: function ($scope, $element) {

      $timeout(function () {

        $scope.$watch('$ionicSideMenusController.getOpenRatio()', function (ratio) {

          $element[0].style.webkitFilter = 'brightness(100%)' + Math.abs(ratio);
        });
      });
    }
  };
})
2

Are you getting a result (ration) from the getOpenRatio method? If you console it, do you see a result?

3

@Calendee yes, getOpenRatio is returning a value, I’m currently using it for the fade bar directive. It’s not that things aren’t working but more how should I go about combining the css value with the value from getOpenRatio.

4

You said CSS. I have to run away and hide now. Sorry - no help here.