2014-02-18 8 views
0

Я не уверен, насколько хорошо могу это сказать, но позвольте мне сделать это.Получить jQuery для измерения с помощью em вместо px

У меня есть сайт, основанный на jQuery; что значительная часть его содержимого создается, измеряется, & устанавливается jQuery.

Все эти измерения являются px. Мне нужно либо преобразовать их в em, либо, предпочтительно, создать функцию, которая будет конвертировать их для меня. Это было бы легко, если бы весь размер шрифта был 16px (или 100%); однако это не так. Мне нужно, чтобы определить размер шрифта контейнера &.

Прошу прощения, если это плохо сформулировано. Если бы вы поняли, что это & помогите мне, это было бы замечательно. Если вы не думаете, что это возможно, пожалуйста, не отвечайте, все возможно, это всего лишь вопрос того, сколько усилий вы готовы выдвинуть.

+0

Нам действительно нужно увидеть какой-то код для ответа. Я думаю, что наличие классов css выполняет эту работу, и jQuery добавляет классы в HTML, однако, не видя кода, я не знаю, подходит ли это для продолжения. –

+0

Существует слишком много кода для показа; & no, что не сработает. Я динамически создаю элементы и стили, и я обнаруживаю измерения, такие как ширина чего-то, и устанавливаю его как параметр var & setting другого элемента, например, = that var. Надеюсь, это поможет прояснить? –

+0

Есть ли причина, по которой вам нужно динамически создавать классы, и вы не могли бы иметь их в файле css и просто менять классы элементов dom в jQuery? –

ответ

0

Я понял. Вы можете увидеть код here.

  function px_to_em(px_value, container) { 
      //////////////////////////////// 
      // Detect Contianer Font Size // 
      //////////////////////////////// 

      //Prepend a span tag to the container for testing 
      $(container).prepend("<span id='wraping_span_to_test'></span>"); 

      //Set the span to height 1em and then save the pixel height to the container_ft_sz variable 
      container_ft_size = $("#wraping_span_to_test").css({ 
       "font-family": "inherit", 
        "font-size": "inherit", 
        "font-style": "inherit", 
        "font-variant": "inherit", 
        "font-weight": "inherit", 
        "line-height": "inherit", 
        "margin": "0 !important", 
        "padding": "0 !important", 
        "border": "0 !important", 
        "outline": "0 !important", 
        "background-color": "aqua", 
        "height": "1em", 
        "width": " 1em", 
        "display": "block" 
      }).height(); 

      //Remove the testing span 
      $("#wraping_span_to_test").remove(); 

      //Use values to convert to ems 
      var round_to = 1000; 
      return Math.round((px_value/container_ft_size) * round_to)/round_to; 
     } 

Это позволит вам найти измерение с JQuery, который измеряется пикселями & преобразовать их в измерения эм, вызывая простую функцию.

0

Это непросто. Размышляя об этом, вы можете временно вставить содержимое с шириной: 1em, измерить ширину в px и вычислить em, который вам нужен.

+1

Я не вижу, как это решение даст мне результаты, которые мне нужны, поскольку ems основаны на размере шрифта. Не могли бы вы подробнее рассказать или привести пример? –