opc2web
with div change
by Weron2
HTML
<!DOCTYPE html>
<html>
<head>
<link id="favicon" rel="shortcut icon" type="image/png" href="red.png" />
<meta charset="utf-8">
<title>Web monitoring</title>
<script src="jquery-3.2.1.min.js"></script>
<style>
body {
background-color: #DAF7A6;
}
.tagvals {
font-size: 18px;
font-weight: bold;
display: inline-block
}
.newdiv {
float: left;
width: 100px;
height: auto;
text-align: center;
background-color: #eeeeee;
margin-right: 1px;
margin-left: 2px;
margin-top: 3px;
-webkit-box-shadow: inset 0 0 3px #000;
-ms-box-shadow: inset 0 0 3px #000;
box-shadow: inset 0 0 3px #000;
text-align: center;
}
.bigdiv {
background: #d3c7b1;
float: left;
overflow: auto;
border: 1px solid black;
overflow: hidden;
resize: both;
width: 160px;
height: 120px;
min-width: 105px;
min-height: 70px;
max-width: 900px;
max-height: 600px;
}
.hd {
text-align: center;
font-weight: bold;
border: 1px solid #9a4832;
background-color: #c28f48;
-webkit-box-shadow: inset 0 0 3px #000;
-ms-box-shadow: inset 0 0 3px #000;
box-shadow: inset 0 0 3px #000;
}
</style>
<script>
var getJSON = function(url, callback) {
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.responseType = 'json';
xhr.onload = function() {
var status = xhr.status;
if(status == 200) {
callback(null, xhr.response);
} else {
callback(status);
}
};
xhr.send();
};
setInterval(function() {
getJSON('http://localhost:45455',...