SQS dynamic text resize js

PHOTO EMBED

Sun Sep 24 2023 13:32:05 GMT+0000 (Coordinated Universal Time)

Saved by @sagarmaurya19

var dynamicText = function() {
  var windowWidth = window.innerWidth;
  var dynamicTextContainers = document.querySelectorAll('.sqs-dynamic-text');

  for (var el of dynamicTextContainers) {
    var elementWidth = el.offsetWidth;
    var widthRatio = elementWidth / windowWidth * 100; 
    var existingRatio = el.getAttribute('data-width-percentage'); 


    if (elementWidth == windowWidth || existingRatio == widthRatio) {

      continue;
    } 

    el.setAttribute('data-width-percentage', widthRatio);
    el.style.fontSize = widthRatio + '%';

    var dynamicTextEls = document.querySelectorAll('.sqs-dynamic-text');
    for (var el of dynamicTextEls) {

//       el.style.fontSize = widthRatio + '%';

      for ( var p of el.children ){
        if ( parseInt(getComputedStyle(p).fontSize.replace("px", "")) <= 13 ) {
          p.style.fontSize = '13px';
        }
      }
    }



  }
};

dynamicText();
content_copyCOPY