I am trying to change the height of a marquee tag depending on a calculation using javascript.
I have tried this:
/*jslint devel: true */
function maths() {
"use strict";
var x = Math.floor((Math.random() * 1080) + 1);
document.getElementByTagName("test").style.height = x;
}
window.setInterval(function () {
"use strict";
maths();
}, 1);marquee{
font-size: 40px;
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test</title>
<intercept-url pattern="/favicon.ico" access="ROLE_ANONYMOUS"/>
</head>
<body>
<marquee id="test" scrollamount="30" height="">test</marquee>
</body>
</html>Any help would be appreciated
EDIT:
I have successfully been able to change the height of a marquee tag using JavaScript. I am following the same strategy as before but instead of changing height, i want to change the scrollAmount (the scroll speed). It does not change.
Thanks
/*jslint devel: true */
var x = Math.floor((Math.random() * 1080) + 1);
var w = Math.floor((Math.random() * 40) + 1);
var section1= document.getElementById("test");
var section = document.getElementById("test");
function resize() {
"use strict";
let heightLet=x.toString() + "px";
//var marqueStyle = window.getComputedStyle(section);
section.style.height = heightLet;
marqueStyle = window.getComputedStyle(section);
}
function scroll() {
"use strict";
let speedLet=w.toString();
//var marqueStyle = window.getComputedStyle(section);
section.style.scrollAmount = speedLet;
marqueStyle = window.getComputedStyle(section);
}
function read(){
console.log(x);
}
window.onload = function () {
console.log("x="+ x);
console.log("w=" + w);
resize();
scroll();
read();
}marquee{
font-size: 40px;
border: solid;
position: absolute;
bottom: 0;
}
div{
position: relative;
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test</title>
<intercept-url pattern="/favicon.ico" access="ROLE_ANONYMOUS"/>
<link type="text/css" rel="stylesheet" href="css/marqueestyle.css">
</head>
<body onload="resize()">
<div>
<section id="test">
<marquee>test</marquee>
</section>
</div>
<script type="text/javascript" src="java.js"></script>
</body>
</html>