Получение содержимого в полную высоту в div при загрузке другой HTML страницы через JavaScript (объект / без полосы прокрутки) - PullRequest
Новая
       30

Получение содержимого в полную высоту в div при загрузке другой HTML страницы через JavaScript (объект / без полосы прокрутки)

0 голосов
/ 26 мая 2020

Прежде всего, простите меня, если я не объясню это хорошо, я еще не так много знаю о коде, я хотел загрузить другую страницу html, используя JavaScript, и код ниже - это код, который я Я использую.

HTML

<a id="test" href="#">CLICK HERE</a>

<div class="container">
    <div id="content"></div>                
</div>

JavaScript

$("#test").click(function() {
    var X = document.getElementById("content");
if(X.style.display !== "none") {
        $("#content").html('<object type="type/html" id="ContentDisplay" data="test.html" />');
}
});

CSS

#content {
    max-width: 100%;
    height: 100%;
    margin: 0 auto;
    padding: 20px;
    position: relative;
    margin-top: 5px;
    margin-bottom: 5px;
    background: rgb(0,0,0);
    border: solid 1px #fff;
}

#ContentDisplay {
height: 100%;
width: 100%;
overflow: none;
}

Но когда он загружает страницу, он показывает только небольшую часть содержимого с полосой прокрутки. Я хочу, чтобы он загружался и растягивался, чтобы показать полный контент без полосы прокрутки. Так что не имеет значения, какую страницу я загружу позже, div будет растягиваться, чтобы показать все содержимое.

Я не знаю, что мне делать, и добавлять / редактировать / изменять. Я думал о редактировании #content, например, о добавлении height: 1000px; в CSS, но это означает, что мне нужно постоянно менять его в зависимости от страницы, на которую я загружаюсь.

В основном я ' m пытается сделать высоту объекта 100%, но это не работает.

EDITED: я изменил код, но он по-прежнему не работает, как я хочу.

Это старый код ниже, я использовал раньше 

<div id="MenuBar"> <a href ="#" onclick="load_site()"> CLICK HERE </a> </div>
<div id ="content"> </div>
<script>
      function load_site(){
            document.getElementById("content").innerHTML='<object type="text/html" data="test.html" ></object>';
  }
</script>

1 Ответ

0 голосов
/ 26 мая 2020

Попробуйте сделать что-то вроде этого: 

$("#content").html('<object type="type/html" width="100%" height="100%" id="ContentDisplay" data="test.html" />');
...