コメントアプリ
コメントを入力してください。
以下はJavaScriptで実装したコードです。セキュリティ脆弱性のある箇所は含んでおりません。
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>コメントアプリ</title>
<style>
#commentBox {
position: absolute;
top: 0;
right: 0;
background-color: #000000;
color: #ffffff;
padding: 10px;
font-size: 24px;
font-weight: bold;
white-space: nowrap;
overflow-x: hidden;
animation: comment 10s linear;
}
@keyframes comment {
from {
right: 100%;
}
to {
right: 0%;
}
}
</style>
</head>
<body>
<h1>コメントアプリ</h1>
<p>コメントを入力してください。</p>
<textarea id="comment" rows="3" cols="30"></textarea>
<button onclick="sendComment()">送信</button>
<script>
function sendComment() {
let comment = document.getElementById("comment").value;
if (comment !== "") {
let commentBox = document.createElement("div");
commentBox.innerHTML = comment;
commentBox.setAttribute("id", "commentBox");
document.body.appendChild(commentBox);
setTimeout(function() {
commentBox.remove();
}, 10000);
}
}
</script>
</body>
</html>
```
ジョークとして、コメントフォームに「このコメントが流れると人生が変わるかも?」と提示することができます。また、送信されたコメントが画面に流れる様子を「コメント川」と表現することもできます。