Facebook Messenger Bot переместить позицию с помощью CSS - PullRequest
Новая
       10

Facebook Messenger Bot переместить позицию с помощью CSS

0 голосов
/ 07 сентября 2018

Я внедряю робота мессенджера на сайте и мне нужно изменить его положение (по крайней мере, снизу) и, возможно, с JS на свиток тоже.

Поскольку он реализован с использованием скрипта <body>, я не вижу, как добавить CSS, который был бы активен на нем. Я предполагаю, что условного JS было бы даже трудно достичь.

Вот самая простая версия CSS, которую я пытался реализовать: 

.fb_dialog {
    bottom: 50px
    }

1 Ответ

0 голосов
/ 08 сентября 2018

Css Position

Есть пять значений позиций:

статические родственник фиксированный абсолютный липкие

Сначала установите свойства Position и свойства: Top, Bottom, Right, Left. Я объяснил вашему классу

Небольшое объяснение значений

Положение: статическое; Он не может двигаться, он расположен на обычной странице. Пример: 

<style>.fb_dialog {
    position: static;
    Left:30px;
}
<style>

Положение: относительное; Если вы установите свойства вправо, влево, внизу, сверху, ваш элемент будет отклоняться от нормального положения Пример: 

<style>.fb_dialog {
    position: relative;
    left: 30px;

}
<style>

положение: фиксированное; Ваш элемент останется на том же месте, независимо от того, как далеко вы находитесь, он не отрегулируется Пример; 

<style>.fb_dialog {
    position: fixed;
    bottom: 0;
    right: 20;  
}
<style>

Позиция: Absolute; Элемент должен быть позиционирован с помощью Position: Relative; это заставляет элемент двигаться только в относительную позицию но если вы используете только абсолютную позицию без относительного предка, элемент переместится в область просмотра страницы. Пример: * +1022 * 

<style>.fb_dialog1 {
    position: relative;
    bottom:o;
    right: 20px;
} 

.fb_dialog{
    position: absolute;
    top: 80px;
    right: 20;
}
</style>
Position:Sticky;

В этой позиции элемент придерживается при прокрутке страницы. Позиционное значение работает для обновленной версии Internet Explore и Safari. Пример: 

<style>.fb_dialog {
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 0;
}
</style>

Есть еще один способ поставить css, используя Css # idselector. Какие бы элементы вы не использовали, например div, p и т. Д. Вы можете стилизовать свой элемент, используя идентификатор Пример: 

 <style> #fb_dialog {
    position:absolute;
    right: 20;   
}
</style>

<p id="fb_dialog">some text here.</p>

...