Вывести абсолютно позиционированного ребенка из родителя?

  • Автор темы klyreenew
  • 79
  • Обновлено
  • 15, May 2024
  • #1
Пожалуйста иди здесь

и нажмите кнопку «Нравится» в Facebook на панели социальных сетей, расположенной слева от публикации.

После щелчка должно появиться диалоговое окно общего доступа, но оно, похоже, спрятано внутри родительского div.

Я искал в Google и пытался добавить overflow:visible в родительский div, но это не сработало.

Также есть родительский элемент div с overflow:hidden, и я изменил его на overflow:visible, но он по-прежнему отказывается работать.

Как ни странно, когда окно браузера сжимается, а панель общего доступа становится горизонтальной, диалоговое окно «Поделиться кнопкой «Нравится»» отображается правильно при нажатии.

Другая проблема связана с Firefox и IE: когда панель общего доступа становится горизонтальной при уменьшении области просмотра, кнопка Tweet загадочным образом исчезает.

Но в Chrome этого не происходит.

Это действительно странно.

Когда я использую Firebug для проверки элемента
  • , который содержит код кнопки Tweet на горизонтальной панели общего доступа, он становится полупрозрачным или что-то исчезает на заднем плане. Однако я не вижу НИКАКИХ стилей видимости: скрытого или отображения: нет.

    Я попытался переместить кнопку «Твитнуть» вниз по строке после кнопки «Нравится» в Facebook, но она, тем не менее, исчезает в горизонтальном состоянии.

    Любая помощь будет очень признательна по этим двум вопросам! Спасибо!

klyreenew


Рег
28 Dec, 2010

Тем
1

Постов
2

Баллов
12
  • 18, May 2024
  • #2
Большое спасибо! Оно работает! Теперь у меня есть другой сайт с похожей проблемой, но не совсем. Пожалуйста, посмотрите здесь: http://www.princessly.com/press/put-your-best-shoes-forward-on-your-big-day/

При нажатии кнопки «Мне нравится» в Facebook диалоговое окно «Поделиться», кажется, правильно выскакивает из родительского элемента, но каким-то образом находится за некоторыми другими элементами, поэтому не показывает свою правую половину.

Он ограничен или ограничен некоторой родительской шириной. Я пытался, но не смог найти виновника.

Можете ли вы помочь мне еще раз? Большое спасибо!
 

SexBisonManiac12


Рег
04 Dec, 2015

Тем
0

Постов
3

Баллов
3
  • 20, May 2024
  • #3
Скорее всего, что-то не так с JS-файлами Twitter.

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

Попробуйте добавить правила CSS для twitter-widget-1 и twitter-widget-0, чтобы они всегда были видны.
 
twitter-widget-1 {
width:20px;
height:61px;
position:static;
visibility:visible;
}
Код (разметка): если это не работает, добавьте стиль JS элемента в ваш JS-файл.
 

Natalya_lug


Рег
16 Jul, 2015

Тем
0

Постов
1

Баллов
1
  • 05, Jun 2024
  • #4
Ваша проблема в этом ужасном iframe name="f3ecf8a287e5a8c" - оно меняется после того, как вы нажмете кнопку «Нравится». Должен быть лучший способ добавить кнопку «Мне нравится». это как будто вы добавляете целый новый веб-сайт только для одной кнопки «Нравится».
 

gheka


Рег
08 Oct, 2015

Тем
0

Постов
2

Баллов
2
  • 08, Jun 2024
  • #5
Мне удалось найти виновника: iframe {максимальная ширина: 100%} Где-то в моих стилях этот стиль запрещает отображение iframe за пределами родительского поля на полную ширину.

Max-width ограничивает его максимальную ширину в 100% от его родительского элемента. После отключения этого теперь оно отображается полностью! Теперь единственное, что осталось, это проблема с кнопкой Твиттера.

Это действительно странно.

Я восстановил эти стили в id="twitter-widget-1": твиттер-виджет-1 { ширина: 20 пикселей; высота: 61 пикселей; положение: статическое; видимость:видимый; } Но кнопка Twitter по-прежнему отказывается отображаться в Firefox и IE. В Chrome все в порядке.

Очень странно.
 

Сергей Ли


Рег
23 Feb, 2013

Тем
1

Постов
2

Баллов
12
  • 09, Jun 2024
  • #6
Я предполагаю, что это какой-то JS, который отвечает за изменение размера Sharebar и Sharebarx.

Он добавляется с помощью JS: style="position: Absolute; видимость: скрыто; ширина: 0 пикселей; высота: 0 пикселей;" для iframe id="twitter-widget-0" и iframe id="twitter-widget-1" его нет в файле css. Это какое-то правило: Chrome читает, а FF и IE — нет.

Возможно, какая-то ошибка JS. Не можете найти в файлах JS, где это происходит, или это внешние файлы? Попробуйте добавить правила CSS для twitter-widget-1 и twitter-widget-0, чтобы они всегда были видны?
 

bogus1


Рег
06 Jan, 2014

Тем
1

Постов
3

Баллов
13
  • 11, Jun 2024
  • #7
Большое спасибо за предупреждение, @Blizzardofozz, но это все еще тот iframe, когда полоса становится горизонтальной, но он работает правильно. Я не думаю, что виноват iframe? А как насчет 2-го вопроса? Спасибо!
 

vladv1


Рег
29 Mar, 2015

Тем
0

Постов
2

Баллов
2
Тем
49554
Комментарии
57426
Опыт
552966

Интересно