Определите, находится ли содержимое столбца начальной загрузки слева или справа (для сортировки в Jquery) - PullRequest
Новая
       57

Определите, находится ли содержимое столбца начальной загрузки слева или справа (для сортировки в Jquery)

0 голосов
/ 05 июля 2019

Я создал страницу, где пользователи должны заполнять различную информацию, где есть теги, показывающие пользователю, где их заполнять. Содержимое может быть заполнено (col-12) или справа / слева (col-6) и если контент занимает половину страницы, я хочу иметь возможность переместить тег (синий круг) в ту же сторону, где находится контент.Пользователь сможет перемещать содержимое влево / вправо с помощью сортируемого интерфейса Jquery.

См. Изображение ниже: enter image description here

HTML-код: 

<div class="row">
  <div class="col-6">
    <div class="blockContent">
      <span class="grip-bar block-handle ui-sortable-handle"></span>
      <div class="block">
        <i class="icon icon-tag-warning hand left-info"></i>        
        <p>Field with tag to fill in:
          <input class="width-full width-dynamic input-line l-input-icon">
        </p>
      </div>
    </div>
  </div>
  <div class="col-6">
    <div class="blockContent">
      <span class="grip-bar block-handle ui-sortable-handle"></span>
      <div class="block">
        <i class="icon icon-tag-warning hand left-info"></i> 
        <p class="bold">Some text</p>       
        <p>Fill in this field:
          <input class="width-full width-dynamic input-line l-input-icon">
        </p>
      </div>
    </div>
  </div>
</div>

Любые советы или подсказки, как можно определить сторону содержимого, чтобы установить тег на правильной стороне?Или с помощью CSS или Jquery?

РЕДАКТИРОВАТЬ:

Пользователь может сгенерировать свои собственные col-6 или col-12, поэтому невозможно добавить класс, подобный "left""или" правильно "для столбца, который может использовать контент / блок (насколько я знаю).

1 Ответ

0 голосов
/ 06 июля 2019

Решил его с помощью Truextacy, который указал мне правильное направление.

При создании HTML-кода я добавил в каждый столбец класс с именем tag-left или tag-right, а затем блоки на сортируемом объекте проверяли бы сторону тега нового столбца и соответственно устанавливали CSS.

...