Пущенная в ход правом боковая панель с основным содержанием текла вокруг - как?

Мы можем сделать это в base R, создав логический вектор с rowSums, а затем обновить числовые столбцы на основе этого индекса

i1 <- rowSums(data[-1] == 1) > 0
data[-1][i1,] <- NA^ !data[-1][i1,]
data
#  id V1 V2 V3
#1  A  1 NA  1
#2  B  0  0  0
#3  C NA NA  1

Если индекс должен быть основан в одном столбце, скажем «V3», измените «i1» на

i1 <- data$V3 == 1

и обновите другие числовые столбцы после подстановки строк в «i1», создайте логическую матрицу с отрицанием (! - возвращает TRUE для 0 значений и все остальные FALSE). Затем, используя NA^ на логической матрице, возвращает NA для TRUE и 1 для других значений. Поскольку существуют только двоичные значения, это можно обновить

data[i1, 2:3] <- NA^!data[i1, 2:3]
5
задан Jon Cram 6 November 2008 в 09:58
поделиться

6 ответов

Простое плавание w/противоположный исходный порядок просто не может быть сделано (черновые спецификации w/o CSS3). Прагматический подход должен сначала создать хорошее расположение, которое поддерживает Ваш желаемый исходный порядок. HTML:

<div id="content" class="noJs">
  <div id="floatSpace"></div>
  <p>Lorem ipsum ....</p>
  <p>Pellentesque ....</p>
  <div id="sidebar">content</div>
</div>

CSS:

#content {position:relative;}
#sidebar {width:150px; position:absolute; top:0; right:0;}
.noJs {padding-right:150px;}
.noJs #floatSpace {display:none;}
.js #floatSpace {float:right; width:150px;}

Это удовлетворяет всех кроме 1 и 2. Теперь, мы добавляем JS:

$(function () {
  // make floatSpace the same height as sidebar
  $('#floatSpace').height($('#sidebar').height());
  // trigger alternate layout
  $('#content')[0].className = 'js';
});

Это сделает плавание содержания вокруг #floatSpace, и #sidebar останется расположенным сверху его. Это лучше, чем перемещение #sidebar, потому что исходный порядок остается тем же (для screenreaders, которые поддерживают JavaScript, и т.д.).

Вот JSFiddle этого в действии. Это расположение действительно идет с неудачным требованием хранения floatSpace высоты в синхронизации с высотой боковой панели. Если боковая панель является динамичной или имеет лениво загружающееся содержание, необходимо повторно синхронизировать.

3
ответ дан 14 December 2019 в 04:50
поделиться

Хорошо, вот другой ответ затем, так как мы можем проигнорировать одно из требований, отскочить первое требование, где содержание переносится под боковой панелью.

#sidebar {
  float: left;
  width: 100px;
}
#actualContent {
  width: 700px;
  float: left;
}

Единственное изменение в Вашем коде - то, что необходимо поместить фактическое содержание в другую обертку.

<div id="content">
    <div id="actualContent">
        <p>...</p>
        <p>...</p>
    </div>
    <div id="sidebar">
        <p>...</p>
    </div>
</div>
2
ответ дан 14 December 2019 в 04:50
поделиться

Если можно перестроить HTML, таким образом, боковая панель перед содержанием, то это легко:

#sidebar { float: right; width: 150px; }

.. и затем просто удостоверьтесь, что очистили его впоследствии (в конце #content отделение).

Я знаю, что Ваши намерения находятся в правильном месте, служа содержанию в правильном порядке, но если Вы не ожидаете большой трафик от слабовидящих пользователей, затем я думаю, что Вы, возможно, должны были бы пересмотреть свои приоритеты.

1
ответ дан 14 December 2019 в 04:50
поделиться

К моему знанию единственный способ получить боковую панель, где Вы хотите (без очевидного переупорядочения разметки) состоит в том, чтобы установить #content { position: relative; } и #sidebar { position: absolute; right: 0; top: 0; }

К сожалению, абсолютное расположение вынет боковую панель из плавного расположения и содержания #content не избежит #sidebar как Вы требуете.

0
ответ дан 14 December 2019 в 04:50
поделиться

Я полагаю, что Вы собираетесь, должны изменить порядок на это, поместив боковую панель сначала. Затем используйте CSS float свойство (не изменяя порядок, div#sidebar закончился бы ниже абзацев по сравнению с рядом с ними). div#sidebar должен простираться по мере необходимости для высоты.

CSS:

#sidebar {
    float: right;
    width: 50px;
}

HTML:

<body>
  <div id="content">
    <div id="sidebar">
      /* has some form of fixed width */
    </div>

    <!-- paragraphs -->
  </div>
</body>

Давка @Jon [комментарий]

Хорошо... nvm. Вы заявили свой собственный ответ и отклонили его одновременно.

Вы не можете пустить в ход элемент вокруг других элементов, которые определяются перед ним. Браузер должен смочь ответить "на плавание вокруг какой?" И это смотрит на следующий элемент для запуска, продолжаясь до необходимый.

2
ответ дан 14 December 2019 в 04:50
поделиться

Я нигде не должен тестировать его прямо сейчас, и я не уверен, будет ли это работать, но Вы попытались отобразить отделение боковой панели как встроенное и идти оттуда?

0
ответ дан 14 December 2019 в 04:50
поделиться