Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 2 years ago.
Improve this question
I have this array : const colorsarray = ['#F2387C', '#8A26A6', '#06ADBF', '#F2CE16']
And I have a list of item with unknown number of item, what I want to achieve is, I want to use these colors as a background color of item, but I want the colors to stay in order.
Example
Item 1 => bg:#F2387C
Item 2 => bg:#8A26A6
Item 3 => bg:#06ADBF
Item 4 => bg:#F2CE16
Item 5 => bg:#F2387C Go back to the first color
Item 6 => bg:#8A26A6 Go back to the second color
...
All I have right now is this code which chooses a color randomly if it could help :
var randcolor = colorsarray[Math.floor(Math.random() * colorsarray.length)];
Thanks for helping.
It's pretty simple, thanks to the % operator. Here's an example:
var elements = document.getElementsByClassName('yourclass');
var colors = ['#F2387C', '#8A26A6', '#06ADBF', '#F2CE16']
for(i = 0; i < elements.length; i++){
elements[i].style.backgroundColor = colors[i % colors.length]
}
Hope this helps!
Related
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 2 days ago.
This post was edited and submitted for review 2 days ago.
Improve this question
im trying to build small project .
<body>
<button class="btnCheck">Click Me</button>
<p class"randomNumber">Random Number:</p>
<p class"recentNumbers">Last Numbers:</p>
<script>
let randomNumber = Math.floor(Math.random() * 20 + 1)
const recentNumbers = document.querySelector(".recentNumbers");
const btnCheck = doucment.querySelector(".btnCheck");
let paraNumber = doucment.querySelector(".randomNumber");
btnCheck.addEventListener("click",function(){
paraNumber.textContent = randomNumber;
for(let i = 0; i < randomNumber.textContent[i]; i++){
recentNumbers.textContent = randomNumber.textContet[i]'
})
</script>
// 2nd method :
randomArr = [];
recentNumbers.textContent = randomArr.push(randomNumber);
if (randomArr.length >= 5) {
randomArr.shift()
}
</script>
</body>
What I have been trying to do is : to show the last random numbers to limit to 4 recent numbers, everytime i click in the button,
when i pushed it to array it is not working and also it is creating new array everytime im clicking the button in the 2nd method
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 1 year ago.
Improve this question
Can someone please show me how to sort this
var videos = ["https://example.net/download/7/video-104.mp4",
"https://example.net/download/7/video-105.mp4",
"https://example.net/download/7/video-106.mp4",
"https://example.net/download/7/video-108.mp4",
"https://example.net/download/7/video-110.mp4",
"https://example.net/download/7/video-112.mp4",
"https://example.net/download/7/video-114.mp4",
"https://example.net/download/8/video-107.mp4",
"https://example.net/download/8/video-109.mp4"]
into this
var videos = ["https://example.net/download/7/video-104.mp4",
"https://example.net/download/7/video-105.mp4",
"https://example.net/download/7/video-106.mp4",
"https://example.net/download/8/video-107.mp4",
"https://example.net/download/7/video-108.mp4",
"https://example.net/download/8/video-109.mp4",
"https://example.net/download/7/video-110.mp4",
"https://example.net/download/7/video-112.mp4",
"https://example.net/download/7/video-114.mp4"]
it should be sorted based on last numbers in string before .mp4 but it doesn't work
var videos = ["https://example.net/download/7/video-104.mp4",
"https://example.net/download/7/video-105.mp4",
"https://example.net/download/7/video-106.mp4",
"https://example.net/download/7/video-108.mp4",
"https://example.net/download/7/video-110.mp4",
"https://example.net/download/7/video-112.mp4",
"https://example.net/download/7/video-114.mp4",
"https://example.net/download/8/video-107.mp4",
"https://example.net/download/8/video-109.mp4"
]
videos.sort(function(a, b) {
var spix = a.split('-')[1];
a = parseInt(spix.split('.mp4')[0]);
var spixb = b.split('-')[1];
b = parseInt(spix.split('.mp4')[0]);
return a - b;
});
console.log(videos);
videos.sort((a,b) => a.split('-')[1].slice(0,-4) - b.split('-')[1].slice(0,-4));
console.log( videos)
Basically I'm just splitting it by the "-" then taking out the '.mp4' and sorting it
Your issue is with the defenition of variable b. You defined it incorrectly as b = parseInt(spix.split('.mp4')[0]); it should be b = parseInt(spixb.split('.mp4')[0]);
var videos = ["https://example.net/download/7/video-104.mp4",
"https://example.net/download/7/video-105.mp4",
"https://example.net/download/7/video-106.mp4",
"https://example.net/download/7/video-108.mp4",
"https://example.net/download/7/video-110.mp4",
"https://example.net/download/7/video-112.mp4",
"https://example.net/download/7/video-114.mp4",
"https://example.net/download/8/video-107.mp4",
"https://example.net/download/8/video-109.mp4"];
videos.sort(function (a, b) {
var spix = a.split('-')[1];
a = parseInt(spix.split('.mp4')[0]);
var spixb = b.split('-')[1];
b = parseInt(spixb.split('.mp4')[0]);
return a - b;
});
console.log(videos)
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 2 years ago.
Improve this question
I am working on adding search panel. Here I have to populate the items based on the min and max price. My page front view is:
Here if I am selecting the min price value is 100,000 means max price must show the >=150,000 (It has to show only 150,000 & 200,000).
and if I'm selecting the min price value is 150,000 means max price must show the >=200,000 (It has to show only 200,000) etc.
How to do this function in JavaScript?
When you select item from one dd you should detect items on next dd which do not match to corresponding condition.
I dont know what's your dd markup but in common way it should be something like this.
let minDD is your Min Price drop down and maxDD is Max Price drop down
//add event listeners
for(var i=0;i<minDD.children.length;i++){
$(minDD.children[i]).click(function(){
setLimits(maxDD,this.innerHTML,'min');
})
}
for(var i=0;i<maxDD.children.length;i++){
$(maxDD.children[i]).click(function(){
setLimits(minDD,this.innerHTML,'max');
})
}
//method removes unwanted items
function setLimits(node, val, indicator) {
if (indicator == 'min') {
for (var i = 0; i < node.children.length; i++) {
if (node.childen[i].innerHTML < val)
node.removeChild(node.childen[i]);
}
}
if (indicator == 'max') {
for (var i = 0; i < node.children.length; i++) {
if (node.childen[i].innerHTML > val)
node.removeChild(node.childen[i]);
}
}
}
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
So I'm trying to make two input fields calculate their value off one another. Here is my code so far:
function strToNumber (str) {
return Number(str.replace(/\D/g,''));
}
var number_2_calc;
var number_1 = strToNumber($("#number_1").val());
var number_2 = strToNumber($("#number_2").val());
$("#number_2").focusout(function(){
if(number_2 == 0) {
$("#number_2").val("");
} else {
number_2_calc = number_2 +(number_1 * 0.1);
$("#number_2").val(number_2_calc);
}
});
$("#number_1").focusout(function() {
if(number_2 == 0) {
$("#number_2").val("");
} else {
//not sure if necessary to create seperate vars here
var number_2_stored = strToNumber($("#number_1").val());
var number_1_stored =strToNumber($("#number_2").val());
number_2_calc = 0;
number_2_calc = number_2_stored +(number_1_stored * 0.1);
Math.round(number_2_calc).toFixed(2);
$("#number_2").val(number_2_calc);
}
});
So I'm trying to make it when you fill out either field then focus out it will change the input accordingly. This works fine when number_2 focuses out, but when you go back and change number_1 the values get messy. Probably just overlooking something simple, because this shouldn't be that difficult.
When you round the result, you need to assign back to "number_2_calc".
number_2_calc = Math.round(number_2_calc).toFixed(2);
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
to say some space and repetition I'm trying to use a var n to store a common location for a folder but also want to later combine a image name.
example.
var n="/me/work/air/image/";
var get_images = ["'+n+'" "1.jpg"",n+ "2.jpg" ]
I'm simply just trying to include var n with the string "1.jpg"
so the result would be
"/me/work/air/image/1.jpg","/me/work/air/image/2.jpg"
Are you looking for something like this?
var n= "/me/work/air/image/";
var get_images = [];
for (var i=0; i < 30; i++) {
get_images.push(n + "" + i + ".jpg");
}
this while loop is prolly the fastest one... length is the number of images ..
var path='/me/work/air/image/',length=10,array=[];
while(length--){
array[length]=path+length+'.jpg'
}
array.shift() // if you start from 1
or just create a function where i is the number of the image
function getImg(i){
return '/me/work/air/image/'+i+'.jpg'
}
use
var image1=getImg(1);
or
'<img src="'+getImg(1)+'">'
it also all depends inwhich contest you wanna reuse the image later and how often
Try this
var n= "/me/work/air/image/";
var get_images = {
first: n + "1.jpg",
second: n+ "2.jpg"
};
Now you can use get_Images["first"] or get_Images.first to get the data of each properties of JSON object.