コマンドライン
このコミットが含まれているのは:
コミット
dfe979e0c1
|
@ -16,12 +16,20 @@
|
|||
background-position: center 25%;
|
||||
}
|
||||
|
||||
#dragger {
|
||||
position: absolute;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
#draggerheader {
|
||||
cursor: move;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.konsole {
|
||||
width: 600px;
|
||||
height: 300px;
|
||||
position: relative;
|
||||
margin: auto;
|
||||
margin-top: 150px;
|
||||
color: #fcfcfc;
|
||||
}
|
||||
|
||||
|
@ -88,11 +96,7 @@
|
|||
|
||||
.konsoleuser, .konsoleroot {
|
||||
background-size: cover;
|
||||
-webkit-backdrop-filter: blur(13px);
|
||||
-moz-backdrop-filter: blur(13px);
|
||||
-o-backdrop-filter: blur(13px);
|
||||
-ms-backdrop-filter: blur(13px);
|
||||
backdrop-filter: blur(13px);
|
||||
backdrop-filter: blur(17px);
|
||||
font-family: "Lucida Console", Monospace, "DejaVu Sans Mono", "Courier New", MiscFixed;
|
||||
font-size: 12px;
|
||||
/* white-space: pre; */
|
||||
|
@ -148,5 +152,50 @@
|
|||
|
||||
<!-- Scripts -->
|
||||
<script src="{{ asset('js/app.js') }}"></script>
|
||||
<script>
|
||||
// Make the DIV element draggable:
|
||||
dragElement(document.getElementById("dragger"));
|
||||
|
||||
function dragElement(elmnt) {
|
||||
var pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
|
||||
if (document.getElementById(elmnt.id + "header")) {
|
||||
// if present, the header is where you move the DIV from:
|
||||
document.getElementById(elmnt.id + "header").onmousedown = dragMouseDown;
|
||||
} else {
|
||||
// otherwise, move the DIV from anywhere inside the DIV:
|
||||
elmnt.onmousedown = dragMouseDown;
|
||||
}
|
||||
|
||||
function dragMouseDown(e) {
|
||||
e = e || window.event;
|
||||
e.preventDefault();
|
||||
// get the mouse cursor position at startup:
|
||||
pos3 = e.clientX;
|
||||
pos4 = e.clientY;
|
||||
document.onmouseup = closeDragElement;
|
||||
// call a function whenever the cursor moves:
|
||||
document.onmousemove = elementDrag;
|
||||
}
|
||||
|
||||
function elementDrag(e) {
|
||||
e = e || window.event;
|
||||
e.preventDefault();
|
||||
// calculate the new cursor position:
|
||||
pos1 = pos3 - e.clientX;
|
||||
pos2 = pos4 - e.clientY;
|
||||
pos3 = e.clientX;
|
||||
pos4 = e.clientY;
|
||||
// set the element's new position:
|
||||
elmnt.style.top = (elmnt.offsetTop - pos2) + "px";
|
||||
elmnt.style.left = (elmnt.offsetLeft - pos1) + "px";
|
||||
}
|
||||
|
||||
function closeDragElement() {
|
||||
// stop moving when mouse button is released:
|
||||
document.onmouseup = null;
|
||||
document.onmousemove = null;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -1,12 +1,14 @@
|
|||
@extends('layouts.bash')
|
||||
|
||||
@section('content')
|
||||
<div class="konsole">
|
||||
<div class="konsole_top_left"></div>
|
||||
<div class="konsole_top"><div style="width: 540px; margin: auto;">ロリ端末</div></div>
|
||||
<div class="konsole_top_min"></div>
|
||||
<div class="konsole_top_max"></div>
|
||||
<div class="konsole_top_right"></div>
|
||||
<div class="konsole" id="dragger">
|
||||
<div id="draggerheader">
|
||||
<div class="konsole_top_left"></div>
|
||||
<div class="konsole_top"><div style="width: 540px; margin: auto;">ロリ端末</div></div>
|
||||
<div class="konsole_top_min"></div>
|
||||
<div class="konsole_top_max"></div>
|
||||
<div class="konsole_top_right"></div>
|
||||
</div>
|
||||
<div class="konsole_left"></div>
|
||||
<div class="konsoleuser">
|
||||
ロリコマンドラインですね〜♡<br />
|
||||
|
|
新しいイシューから参照