Рестайлинг элементов Youtube DOM для улучшения работы
Каждое видео Youtube имеет столбец div с двумя дочерними элементами: основным и второстепенным:
у первичного div есть дочерний элемент ytd-comments, который содержит все комментарии, и я хочу поместить его во вторичный div, но всякий раз, когда я вырезаю, вставляйте элемент ytd-comments во вторичный div все идентификаторы комментариев в ytd- div комментариев отсутствует, см. ниже этот div содержимого пуст.
Привет, код (или HTML в данном случае) - это текст, пожалуйста, не вставляйте изображения текста в вопросы (meta.stackoverflow.com/questions/285551/…).
Ответы 1
Я бы порекомендовал установить Стилус - расширение для Chrome, Firefox и Opera, которое вставляет CSS в страницы, а затем использует следующий код CSS:
#columns #secondary {
display: none;
}
#columns #primary {
display: block;
padding-left: 24px;
}
#columns #primary > div {
display: block;
position: relative;
}
#columns #primary > div > * {
width: var(--ytd-watch-flexy-player-width);
}
#columns #primary > div > ytd-comments {
position: absolute;
top: -12px;
left: calc(100% + 24px);
max-width: 45vw;
}
[редактировать]
Вау, мне очень понравился этот новый вид. Вот стиль, если вы хотите сохранить столбец #secondaryСледующий:
#columns #primary {
display: block;
padding-left: 24px;
}
#columns #primary > div {
display: block;
position: relative;
}
#columns #primary > div > * {
width: var(--ytd-watch-flexy-player-width);
}
#columns #primary > div > ytd-comments {
position: absolute;
top: -12px;
left: calc(100% + 24px);
max-width: calc(100vw - var(--ytd-watch-flexy-player-width) - (3 * 24px) - 400px);
}
#columns #secondary {
width: 400px; /* 400px in the max-width above */
}
Лучше предоставить некоторый код, который может продемонстрировать, что вы сделали до сих пор.