0
私はhtmlの初心者で、divの左側にスクロールバーを作ろうとしています。 私はそれをgoogleにしようとしましたが、私が望む答えは見つかりませんでした。htmlの本文で別のdivにスクロールバーを作る方法
ここはhtmlの画像です。 
そして、ここで私はWebSocketのからMACアドレス情報を取得し、DIVの左側に表示しようとしているHTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Highlight dropzones with interact.js</title>
<script src="js/interact.js"></script>
<script src="js/dropzones.js"></script>
<link rel="stylesheet" href="stylesheets/dropzones.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="stylesheets/styles.css">
</head>
<body>
<object width="100%" height="100%" type="text/plain" data="/public/sensor/some.txt" border="0" >
<header>
<nav class="navbar navbar-inverse">
<div class="collapse navbar-collapse" id="navbar-collapse">
<ul class="nav navbar-nav navbar-right">
<li><a onclick="show()" id="imageLoad" target="dropzone_1">Image Load</a></li>
<li><a href="#" id="imageSave">Image Save</a></li>
</ul>
</div>
</nav>
</header>
<script src="https://cdn.socket.io/socket.io-1.4.5.js"></script>
<div name="scroll_div" id="scrolldiv1"></div>
<div class="dropzone-wrapper" name="dropzone_1" id="dropzone">
</div>
<script type="text/javascript">
function show(){
document.getElementById('dropzone').style.maxHeight = "100%";
document.getElementById('dropzone').innerHTML = "<img src= 'images/example3.jpg' class='resize_fit_center'/>"
}
</script>
<script>
function autoResizeDiv(){
document.getElementById('dropzone').style.height = window.innerHeight + 'px';
}
window.onresize = autoResizeDiv;
autoResizeDiv();
function WebSocket(){
if ("WebSocket" in window){
var channel = "<%= user%>";
var socket = io.connect("websocket address");
socket.on(channel, function (d) {
var data = JSON.parse(d);
console.log(channel + " : " + d);
var theDiv = document.getElementById(data.node_info[1].info.mac);
if(theDiv == null) {
var divTag = document.createElement("div");
divTag.id = data.node_info[1].info.mac;
divTag.className = "draggable js-drag";
divTag.innerHTML = data.node_info[1].info.mac;
document.getElementsByName('scroll_div')[0].appendChild(divTag);
}
});
socket.on('crc_err', function(packet){
console.log("crc_err : " + packet);
});
socket.on('type_err', function(packet){
console.log("type_err : " + packet);
});
}
else{
// The browser doesn't support WebSocket
// alert("WebSocket NOT supported by your Browser!");
}
}
WebSocket();
</script>
</body>
</html>
の私のコードです。 上記の図のようにスクロールバーを作成したい。私はdocument.getElementsByName('scroll_div')[0].appendChild(divTag)を使ってみましたが、ページの左側にスクロールバーを作成しません。
誰でも助けてくれますか？
ありがとうございます。
p.s.皆さんが私にCSSコードを投稿したい場合は、すぐに編集します。
はい、CSSを動作します
は、この簡単な例を見てください。投稿する。以下の回答を見てください。下記のコードスニペットにも答えがあります。あなたが助けてくれるかどうかを見てください。 – Iceman