Свойство «позиция: фиксированная» не работает. Как установить другого родителя для элемента div.

iRouci

Мне нужно переместить элемент div в верхнюю часть веб-страницы.

Я использую этот код, чтобы изменить его положение:

 document.querySelectorAll('div[data-reactid="div_id_here"]')[0].style = "position: fixed; top: 0px;";

Код (разметка): Элемент действительно будет перепозиционирован, но показываться он будет не вверху страницы, а в других местах.

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

Инструкция «позиция: фиксированная», похоже, работает не относительно области просмотра, а относительно этого родительского элемента.

Я читал, что в таких случаях нужно применять «transform: none;» своему родителю.

Я так и сделал, но безуспешно. Мне интересно, можно ли установить для этого div еще одного родителя.

Например, я бы хотел, чтобы тег «body» выступал в качестве его родительского элемента, и я уверен, что тогда я смогу иметь больше контроля над ним. Возможно ли это или какое другое решение вы бы мне порекомендовали?

Спасибо, Александр

5Sasha5

Боюсь, код не работает. Я использую Tampermonkey (https://www.tampermonkey.net

), чтобы внедрить JS в веб-страницы, и вот полный сценарий...

 // ==UserScript==


// @name Reposition section


// @namespace [URL='https://lumtu.com/yti/dl55ldC9odHRwOi8vdGFtcGVybW9ua2V5Lm5V2']http://tampermonkey.net/[/URL]


// @include *finance.yahoo.com/quote/*/analysis*


// ==/UserScript==


var x = document.querySelector('section[data-test="price-targets"]');


x.style.zIndex = 20;


x.style.backgroundColor = 'lightblue';


z.style.position = 'fixed';


z.style.top = 0;


document.body.appendChild(x);

Код (JavaScript): по какой-то причине код больше не выполняется после второй строки. Александр

141414141414

Спасибо! Да, работает, хотя мне приходилось проверять это на каком-то другом сайте (с другим элементом). Он изменил расположение контента без каких-либо проблем! Он по-прежнему не работает на Yahoo, но не потому, что что-то не так с вашим скриптом.

Если вы загрузите страницу Yahoo, вы увидите, что «ценовые цели» Раздел загружается через 2-3 секунды после загрузки содержимого страницы. И я думаю именно поэтому раздел не перепозиционируется, хотя я не уверен в этом на 100%. Александр

ne2pi

Ох, я ошибся, это должно быть x, а не z. Попробуй это:

 var x = document.querySelector('section[data-test="price-targets"]');
x.style.zIndex = 20;
x.style.backgroundColor = 'lightblue';
x.style.position = 'fixed';
x.style.top = 0;
document.body.appendChild(x);

Код (разметка):

contenthouse

> Не могли бы вы поделиться ссылкой на вашу страницу здесь, пожалуйста?

Конечно, вот оно:

https://finance.yahoo.com/quote/AAPL/analysis

Элемент div, который меня интересует, - это «ценовые цели». На веб-странице он отображается справа и называется «Ценовые цели аналитика».

Тем временем мне удалось найти обходной путь. Это довольно жестоко, но очень эффективно! ;-) Сначала я применил 'видимость: скрыто' свойство в тело документа. Теперь, имея совершенно пустую страницу, я использовал 'для' цикл и применил 'позиция: фиксированная' свойство для ВСЕХ элементов div на странице. Наконец, я изменил положение «ценовые цели» элемент, а также применил 'видимость: видимый' свойство, чтобы сделать его видимым.

Итак, теперь я вижу раздел «Ценовые ориентиры аналитиков», отображаемый вверху страницы (на пустой странице), и он остается там, несмотря ни на что! Если бы я не применял 'позиция: фиксированная' для ВСЕХ элементов div на странице, он когда-нибудь (не каждый раз!) менял свое вертикальное положение, как я сказал в своем первом сообщении.

Если у вас есть более элегантный способ сделать это, дайте мне знать.

Например, JS-код, который будет перемещать один раздел/элемент на странице, не испортив все содержимое страницы.

Положение элемента должно быть установлено относительно области просмотра, и оно никогда не должно меняться независимо от того, как меняют положение другие элементы на странице.

Было бы неплохо сделать страницу пустой (кроме искомого элемента).

Существует много информации, и иногда мне нужно изолировать некоторую ее часть, чтобы я мог получить к ней более простой (быстрый) доступ.

Александр

Похожие темы	Дата
[Специалист] Эксперт по программированию на JavaScript ( + jQuery + AJAX + Node.js) [2014]	19.10.2024, 18:10
Среда Знаний. Jqueryui - Красота На Сайтах Без Напряга	19.10.2024, 18:10
Javascript advanced	19.10.2024, 18:10
Slider Revolution Responsive Jquery Plugin	19.10.2024, 18:10
Захват атрибутов дочернего элемента SVG	19.10.2024, 18:10
Нужна помощь с Json.stringify	19.10.2024, 18:10
Назначение истекшей даты и времени размещенному маркеру	19.10.2024, 18:10
Выберите несколько дней	19.10.2024, 18:10
Выбор времени и загрузка темы jquery blitzer 4	19.10.2024, 18:10
Ошибка запятой в обновлении JS	19.10.2024, 18:10

Свойство «позиция: фиксированная» не работает. Как установить другого родителя для элемента div.

iRouci

5Sasha5

141414141414

ne2pi

contenthouse

I AM

Интересно