Попытка получить фоновое изображение, чтобы оно оставалось «статичным» для всех размеров монитора и устройства.

Принятый ответ не работал для меня в Internet Explorer 9. Я проверил его и обнаружение браузера работало неправильно, оно обнаружило ff (firefox), когда я был в Internet Explorer.

I просто это изменение:

if ($.browser.msie) 

Вместо:

if (br == "ie") { 

В результате получился следующий код:

function insertAtCaret(areaId,text) {
    var txtarea = document.getElementById(areaId);
    var scrollPos = txtarea.scrollTop;
    var strPos = 0;
    var br = ((txtarea.selectionStart || txtarea.selectionStart == '0') ? 
        "ff" : (document.selection ? "ie" : false ) );

    if ($.browser.msie) { 
        txtarea.focus();
        var range = document.selection.createRange();
        range.moveStart ('character', -txtarea.value.length);
        strPos = range.text.length;
    }
    else if (br == "ff") strPos = txtarea.selectionStart;

    var front = (txtarea.value).substring(0,strPos);  
    var back = (txtarea.value).substring(strPos,txtarea.value.length); 
    txtarea.value=front+text+back;
    strPos = strPos + text.length;
    if (br == "ie") { 
        txtarea.focus();
        var range = document.selection.createRange();
        range.moveStart ('character', -txtarea.value.length);
        range.moveStart ('character', strPos);
        range.moveEnd ('character', 0);
        range.select();
    }
    else if (br == "ff") {
        txtarea.selectionStart = strPos;
        txtarea.selectionEnd = strPos;
        txtarea.focus();
    }
    txtarea.scrollTop = scrollPos;
}
0
задан dgknca 18 January 2019 в 14:46
поделиться

1 ответ

Вы можете попробовать это для простого примера полноэкранного фонового изображения. Вы можете отредактировать значение min-height, чтобы получить желаемый эффект.

Пример: https://codepen.io/brooksrelyt/pen/REzMZW

HTML:

<div class="full-home" style="background-image:url('https://via.placeholder.com/1200x800');" ></div>

CSS:

.full-home {
    width: 100%;
    background-repeat:no-repeat;
    background-position:50% 50%;
    background-position:50% 50%\9 !important;
    background-size: cover;
    min-height: 100vh;
}
0
ответ дан brooksrelyt 18 January 2019 в 14:46
поделиться
Другие вопросы по тегам:

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