残念ながら曖昧なタイトルです。私は、Gmailのメールボックスを作成するようなものを作るために使うことができるフレームワークがあるかどうか疑問に思っていました。たとえば、コメントを投稿するために、私は現在、Twitter BootstrapでModalを使用していますが、それはすべてのWebサイトを対象としています。フレームワークではない場合、この種のウィンドウの名前はありますか？ウィンドウ内のウィンドウhtmlフレームワーク
あなたはこのようなことを試すことができます。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Note Test Page</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!-- styles the div that holds the editable text area -->
<style>
#note-container {
position: fixed;
top: 110px;
left: 18px;
transform: translate(0%, 0%);
background: #fff;
border-width: 1px;
border-color: rgba(0, 0, 0, 0.2);
border-style: solid;
padding: 10px;
width: 550px;
z-index:8;
border-radius: 6px;
box-shadow: rgba(0, 0, 0, 0.5) 0px 5px 15px 0px;
display: none;
}
</style>
</head>
<body>
<main class="container">
<div>
<button type="button" class="btn btn-primary" onclick="openNote();">Show Note</button>
</div>
</main>
<!-- the note with editable textarea, hidden until the button is clicked -->
<div id="note-container">
<textarea id='note' name='notes' rows='12' style="width: 495px;" contenteditable="true"></textarea>
<button type="button" class="btn btn-primary" onclick="closeNote();">Close Note</button>
</div>
<!-- Required libraries
–––––––––––––––––––––––––––––––––– -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<!-- Scripts
–––––––––––––––––––––––––––––––––– -->
<script>
var focused; // variable to remember what was previously focused
//open the note
function openNote() {
focused = document.activeElement // remember the activeElement
$('#note-container').show();
$('#note').focus();
}
//close the note
function closeNote() {
$('#note-container').hide();
$(focused).focus(); // return focus to the last activeElement
}
</script>
</body>
</html>
あなたはTwitterのブートストラップモーダルのサイズを設定することができます。http://stackoverflow.com/questions/10169432/how-can-i-change-the-default-width-of-a-twitter-bootstrap -modal-box – nb1987
@ nb1987ありがとうございますが、私はウェブサイトの残りの部分を制御しない解決策を探しています – Duxducis