У меня есть textarea, что я могу управлять функцией jquery, чтобы стать полноэкранным. Я хотел бы добавить кнопку, чтобы закрыть полноэкранный режим
моя функция, управляющая полноэкранным режимом:
function setFullScreen(cm, full) {
var wrap = cm.getWrapperElement();
if (full) {
wrap.className += " CodeMirror-fullscreen";
wrap.style.height = winHeight() + "px";
document.documentElement.style.overflow = "hidden";
} else {
wrap.className = wrap.className.replace(" CodeMirror-fullscreen", "");
wrap.style.height = "";
document.documentElement.style.overflow = "";
};
cm.refresh();
}
Я называю это следующим:
Включить полноэкранный setFullScreen(cm, !isFullScreen(cm));
: setFullScreen(cm, !isFullScreen(cm));
Отключить полноэкранный if (isFullScreen(cm)) setFullScreen(cm, false);
: if (isFullScreen(cm)) setFullScreen(cm, false);
Я хотел бы добавить кнопку, когда мое текстовое поле находится в полноэкранном режиме, я бы хотел, чтобы эта кнопка находилась внутри текстового поля в верхнем правом углу и была независимой от прокрутки (плавающей)
Есть ли способ сделать это с помощью jquery?
благодаря
Вы можете использовать position: fixed;
атрибут в CSS. Скажем, это ваша разметка HTML-кнопок
<a href = "#" id = "textarea_close_button">
<img src = "/img/close_button.png">
</a>
Ваш CSS будет выглядеть так:
#textarea_close_button{
position: fixed;
display: none; //it won't be visible until your textarea becomes fullscreen
top: 5px;
right: 5px;
height: 5px;
width: 5px;
}
Затем запустите следующую строку кода при полноэкранном просмотре своего текстового поля
$("#textarea_close_button").css({"display": "block"});
И наоборот, когда кнопка нажата