Function to change font-size of page content

ionic-v1
1

I’m writing a function in my options.html controller to change text font-size, it works fine, but i’ve got one issue, i’m changing font-size, than i’m going back to previous page, and in that page font-size is already changed, but when i’m back to the my options.html font-size is default, if i’m going back to previous page again, font-size is still changed, every time when i’m return to my options.html fon’t size there is default, how can i overwrite default font-size by changed font-size?

here is my function:

  var range = document.getElementById('range');
  $scope.currentSize = range.value; 

$timeout(function(){
      range.addEventListener('change', function() {
        // ng-bind, current value
        var newSize = this.value;
        console.log(newSize);
        angular.element(document.querySelectorAll('.my-label, .my-save-font, .my-p-font, .my-list h2')).css('font-size', newSize + 'px');
      }, false);
    }, 20);

my html element:

                      <div class="item range range-energized">
			  <span class="smallA">A</span>
			  <input id="range" type="range" min="10" max="20" ng-value='currentSize'>
			  <span class="bigA">A</span>
			</div>

How can i change $scope.currentSize variable in this function, to store new size in it?

2

Hello @Wahtel,

I did this pen based on your issue, have a look at it. Does it resolves your problem?

Good luck!

1 Like
3

@juliosampaio thanks for your attention, but I came to the decision, that i should to abandon from idea, to use querySelectorAll.css(), and try to dynamically change style propertie.
But anyway thanks for your example)

4

Thanks for your your code tha was interesting and helpful.