Bootstrap 3 modal - скользить снизу и придерживаться

Question

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

Мой jsfiddle

Я пробовал это:

.modal-slidein .modal-dialog {
  margin: 0 10px 0 0;
}

.modal-slidein .modal-header {
  border: none;
}

.modal-slidein .modal-content {
  background-color: #68cae2;
  border: none;
  border-radius: 0px;
  outline: 0;
  outline: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

Но модал застрял в верхнем левом углу. Я хочу внизу справа. Любая помощь будет отличной!

Редактировать: Извините, имел в виду правую сторону, а не левую.

javascript jquery css twitter-bootstrap

4

Tomas Jacobsen 18 Дек 2015 в 13:02

Answer 1

Вы можете сделать это со следующими изменениями:

/* set modal to right-bottom */
.modal-slidein {
    top: auto;
    left: auto;
    padding-right: 0px !important;
}

/* enable back scroll-bar */
.modal-open {
  overflow: auto !important;
}

ДЕМО

1

Parkash Kumar 18 Дек 2015 в 11:11

Answer 2

Измените свой код CSS и сделайте это:

.modal-slidein .modal-dialog {
    margin: 0 0 0 0;
    position:absolute;
    bottom:0;
    left:0;
}

0

George Vasilopoulos 18 Дек 2015 в 10:34

Answer 3

.modal-dialog.modal-sm {
    position: ABSOLUTE;
    right: 0;
    bottom: 0;
    width: 50%;
}

0

Kirk Beard 18 Дек 2015 в 11:29

Bootstrap 3 modal - скользить снизу и придерживаться

Редактировать: Извините, имел в виду правую сторону, а не левую.

3 ответа

Похожие вопросы

Новые вопросы

javascript