CSS позиционирование - сделать небольшую рамку

0

У меня есть редактор кода в Интернете и хотелось бы, чтобы введенный HTML был выполнен как мини-веб-страница в кадре в углу.

В настоящее время он выглядит как текстовый процессор слева от экрана с белым квадратом (фон черный) справа. Я хочу, чтобы пользователь входил в редактор, который должен отображаться в белом поле, как если бы там загружалась целая страница.

В настоящее время это делается в javascript, устанавливая innerHTML кадра как код как пользовательский тип, но если пользователь использует фиксированное позиционирование для элемента, этот элемент можно перемещать за пределы кадра. Как я могу заставить все оставаться в рамке, как если бы вся веб-страница уменьшалась до меньшего размера?

  • 0
    Еще лучше, разместите свой код здесь и дайте нам демо в jsfiddle.com
Теги:

1 ответ

0
Лучший ответ

Попробуйте использовать iframe - я проверил следующее относительно вашей проблемы, и это сработало.

<iframe name="myIframe" id="myIframe" style="width: 1000px; height: 100px; margin: 20px auto 0 auto;">

</iframe>
<a onclick="put()">Test</a>
<script>
    function put(){
        var LocalS = "<div style='position: fixed; width: 100px; height: 100px; background-color: black; top:0; left: 0;'></div>" // Your content to display goes  here
        document.getElementById("myIframe").src = "data:text/html;charset=utf-8," + escape(LocalS);
    }
</script>

Надеюсь это поможет

прочитайте это: установите содержимое iframe для получения дополнительной информации о помещении содержимого в iframe

Поделиться
  • 0
    Спасибо. Именно то, что я имел в виду.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню