Develop Reference

Animate animals running accross the screen in Javascript [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 4 years ago.
Improve this question
I have a few thousand JPEGs of different animals. I want to show them moving from the left end of the screen to the right in a web browser. At any point of time there may be a few animals or a few hundred on the screen. How can I do this in Javascript?

You can for example use an already animated looped gif of an animal walking. Then you can just change the position of the gif with JS.
var elem = document.getElementById("animal");
var pos = 0;
var id = setInterval(frame, 75);
function frame() {
if (pos >= 100) {
pos = -10;
} else {
pos=pos+0.25;
elem.style.left = pos + '%';
}
}

Conversion of jQuery code into Vanilla Javascript [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 1 year ago.
Improve this question
Please help me in converting jQuery code to Vanilla javascript
$('.currency,.excludeCurrency').each(function () {
new AutoNumeric(this, {
allowDecimalPadding: "floats",
modifyValueOnWheel: false
});
});

var elements = document.querySelectorAll('.currency, .excludeCurrency');
elements.forEach((item) => {
new AutoNumeric(item, { allowDecimalPadding: "floats", modifyValueOnWheel: false });
});

There is a much easier way to do that than what Damian Peralta used:
AutoNumeric.multiple('.currency, .excludeCurrency', {
allowDecimalPadding: 'floats',
modifyValueOnWheel: false,
});

background color not working in javascript [closed]

Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 5 years ago.
Improve this question
I am new to coding, can anyone help me a solution for button4 for not working ?
document.getElementById=("button4").addEventListener("click", function() {
document.getElementById("box").style.background-color = "blue";
});

You are using wrong syntax,
document.getElementById("box").style.background-color = "blue";
should be replaced with
document.getElementById("box").style.backgroundColor = "blue";
AND
document.getElementById=("button4").addEventListener
should be
document.getElementById("button4").addEventListener
Final updated code would be
document.getElementById("button4").addEventListener("click", function() {
document.getElementById("box").style.backgroundColor = "blue";
});

Is JS input spinners exists? NO JQUERY [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 6 years ago.
Improve this question
I'm looking for js spinners as on picture below (left & right control keys).
But i don't want to use jquery in my project. If you have any snippets, useful links - please paste it here. :) Simple short code is preferred.. :)
Maybe it has another name (not spinner, but.. ?)?

function addSpinner(parent){
var very = document.createElement("div"); // create a div
var minus = document.createElement("button"); // create minus button
var plus = document.createElement("button"); // create plus button
minus.innerHTML = "-"; // draw minus sign
plus.innerHTML = "+"; // draw plus sign
var input = document.createElement("input"); // create an input
input.type = "number"; // type number
input.value = "0"; // and default is 0
very.appendChild(minus); // append the minus sign to the div
very.appendChild(input); // append the input to the div
very.appendChild(plus); // append the plus sign to the div
minus.addEventListener("click", function() {input.value = +input.value - 1});
plus.addEventListener("click", function() {input.value = +input.value + 1});
// + before input.value is to change type from string to number so we can increase/decrease number by 1
parent.appendChild(very);
}
Now you call it: addSpinner(document.body)

Edit picture on the web and export as image [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 6 years ago.
Improve this question
Hey I wonder where can I find a tool to edit image online. I want to create a tool that I give some text & an image which will write it(the text) on a specific place in the image, and allow for saving or exporting the result as jpg or png.

The accepted answer for Put text on an image and save as image explains how to do this:
window.onload = function(){
var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");
var imageObj = new Image();
imageObj.onload = function(){
context.drawImage(imageObj, 10, 10);
context.font = "20px Calibri";
context.fillText("My TEXT!", 50, 200);
// open the image in a new browser tab
// the user can right-click and save that image
var win=window.open();
win.document.write("<img src='"+canvas.toDataURL()+"'/>");
};
imageObj.src = "mail-image.jpg";
};
You can learn more about canvas here