I need to organize an unknown amount of elements into columns which read vertically. The code below works great for organizing the elements based on a set amount per column, but I won't know the amount of elements so I need to divide all the elements into 4 groups (possibly 5 or 6 cloumns though).
Column 1 = 1st 25% of elements
Column 2 = 2nd 25% of elements
Column 3 = 3rd 25% of elements
Column 4 = 4th 25% of elements
$(window).load(function(){
$('.equalChildHeights').setEqualHeights();
var linkNum = 1;
$('.organizeLinks').each(function(){
if (linkNum <= 10) {
$(this).addClass('linkCol1');
} else if (linkNum > 10 && linkNum <= 20) {
$(this).addClass('linkCol2');
} else if (linkNum > 20 && linkNum <= 30) {
$(this).addClass('linkCol3');
} else if (linkNum > 30 && linkNum <= 40) {
$(this).addClass('linkCol4');
} else if (linkNum > 40 && linkNum <= 50) {
$(this).addClass('linkCol4');
};
linkNum++;
});
$('.linkCol1').each(function(){
$(this).appendTo('.column-1');
});
$('.linkCol2').each(function(){
$(this).appendTo('.column-2');
});
$('.linkCol3').each(function(){
$(this).appendTo('.column-3');
});
$('.linkCol4').each(function(){
$(this).appendTo('.column-4');
});
Here is a working example:
Counts all elements and sets a var with the percentage.
var linkNum = 1;
var totoalLinksCol = $('.organizeLinks').length;
var linksPerCol = Math.ceil(totoalLinksCol/4);
$('.organizeLinks').each(function(){
if (linkNum <= linksPerCol) {
$(this).addClass('linkCol1');
} else if (linkNum > linksPerCol && linkNum <= linksPerCol*2) {
$(this).addClass('linkCol2');
} else if (linkNum > linksPerCol*2 && linkNum <= linksPerCol*3) {
$(this).addClass('linkCol3');
} else if (linkNum > linksPerCol*3 && linkNum <= linksPerCol*4) {
$(this).addClass('linkCol4');
};
linkNum++;
});
$('.linkCol1').each(function(){
$(this).appendTo('.column-1');
});
$('.linkCol2').each(function(){
$(this).appendTo('.column-2');
});
$('.linkCol3').each(function(){
$(this).appendTo('.column-3');
});
$('.linkCol4').each(function(){
$(this).appendTo('.column-4');
});
If you want to divide them into 5 columns, just change the 4 to a 5.
var linksPerCol = Math.ceil(totoalLinksCol/4);
You are looking for the modulus operator
Related
problem statement is here: https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-javascript/counting-cards
the problem comes when i tried to get 0 Hold in the return by the Cards Sequence 7, 8, 9 ,but i can't. I know that there are better options for solving this problem, but i wanna do it this way, someone can help?
function cc(card) {
// Only change code below this line
if (card = ( 2 || 3 || 4 || 5 || 6 )) {
count += 1;
}
else if (card = ( 7 || 8 || 9 )) {
count += 0;
}
else if (card = ( 10 || "J" || "Q"|| "K" || "A" )) {
count -= 1;
}
if (count <= 0) {
return count + " Hold";
}
else if (count > 0) {
return count + " Bet";
}
// Only change code above this line
}
cc(2); cc(3); cc(7); cc('K'); cc('A');```
Keeping the same gist of your function:
function cc(card) {
if ("23456".indexOf(card) >= 0) count++;
if ("10JQKA".indexOf(card) >= 0) count--;
return count + (count <= 0 ? " Hold" : " Bet");
}
please I'm stuck in this question below since yesterday. Below is the question:
Write a program that uses console.log to print all the numbers from 1
to 100, with two exceptions. For numbers divisible by 3, print "Fizz"
instead of the number, and for numbers divisible by 5 (and not 3), print
"Buzz" instead.
When you have that working, modify your program to print "FizzBuzz",
for numbers that are divisible by both 3 and 5 (and still print "Fizz" or
"Buzz" for numbers divisible by only one of those).
I only got the first two conditions but not the the third. I don't know how to go about it anymore, I've tried many options. Below is my code:
<html>
<head/head>
<body>
<script type="text/javascript">
for (i = 1; i <= 100; i++)
if (i % 3 == 0) {
document.write("Fizz");
document.write("<br />");
} else if (i % 5 == 0 && i % 3 != 0) {
document.write("Buzz");
document.write("<br />");
} else if (i % 3 && 5 == 0 && i % 3 != 0 && i % 5 != 0) {
document.write("FizzBuzz");
document.write("<br />");
} else {
document.write(+i);
document.write("<br />");
}
</script>
</body>
</html>
Check the most specific (FizzBuzz) condition first.
function fizzBuzz() {
for(var i = 1; i <= 100; i++){
if(i % 5 === 0 && i % 3 === 0){
console.log('FizzBuzz');
} else if(i % 3 === 0){
console.log('Fizz');
} else if(i % 5 === 0){
console.log('Buzz');
} else {
console.log(i);
}
}
}
here is an updated version of your code, I keep it as you write it with some changes, I made it work without touch it's logic, you can see that the problem was in the first comparison and in the second "if else" (5 will never be equal to 0). you can optimize the code more than that, good luck.
<html>
<head/head>
<body>
<script type="text/javascript">
for (i = 1; i <= 100; i++)
if (i % 3 == 0 && i % 5 != 0) {
document.write("Fizz");
document.write("<br />");
} else if (i % 5 == 0 && i % 3 != 0) {
document.write("Buzz");
document.write("<br />");
} else if (i % 3 == 0 && i % 5 == 0) {
document.write("FizzBuzz");
document.write("<br />");
} else {
document.write(+i);
document.write("<br />");
}
</script>
</body>
</html>
Since everyone is contributing, I might as well give you an interesting solution:
var i = 101;
while(i --> 0){ // as i goes to 0... wat
var state = !!(i % 3) << 1 | !!(i % 5), // compute state?
output = ["FizzBuzz", "Fizz", "Buzz", i]; // hmm...
console.log(output[state]); // output correct string
}
1st - Instead of document.write use console.log like the question says
2nd - You have a syntax error in the head section. it should be <head></head>
3rd - for the 1st part of the question all you need is this:
for (i = 1; i <= 100; i++) {
// if i is divisible by 3
if (i % 3 == 0) {
console.log("Fizz");
}
// if i is divisible by 5 (no need to check for 3 again)
else if (i % 5 == 0) {
console.log("Buzz");
}
// else
else {
console.log(i);
}
}
4th - For the 2nd part you need to add an extra if on top of what you have already:
for (i = 1; i <= 100; i++) {
// if i is divisible by 3 and 5
if (i % 3 == 0 && i % 5 == 0) {
console.log("FizzBuzz");
}
// if i is divisible by 3
else if (i % 3 == 0) {
console.log("Fizz");
}
// if i is divisible by 5 (no need to check for 3 again)
else if (i % 5 == 0) {
console.log("Buzz");
}
// else
else {
console.log(i);
}
}
working fiddle: https://jsfiddle.net/tedmanowar/amapqcLL/
You can use a while loop, than use a nested if statements to check the conditions.
let number = 0;
while (number <= 100) {
if(number % 3 === 0 && number % 5 === 0){
console.log("FizzBuzz");
}else if(number % 3 === 0){
console.log("Fizz");
}else if(number % 5 === 0){
console.log("Buzz");
}else{
console.log(number);
}
number++;
}
This solution is the easiest and simplest. There are multiple ways to solve the question though.
for (n=1; n<=100; n++){
let output = "";
if(n % 3=== 0) output += "Fizz"
if(n % 5=== 0) output += "buzz"
console.log(output || n);
}
I don't recommend this answer - since it is very hard to maintain - but it does do it in very few lines. It also relies on the two numbers only having a common factor of 1.
for(let i=1; i<=100; i++) {
console.log(`${i%15?i%5?i%3?i:'Fizz':'Buzz':'FizzBuzz'}`)
}
This is using the ternary operator and backquote template strings.
You should just use a loop that starts at 1 and is less than 101 (so up to 100) and test for the %n === 0. In other words, make sure there is no remainder.
function startConsoleDemo(){
for(var i=1,r; i<101; i++){ // loop from 1 to 100
r = i; // default value of r
if(i % 3 === 0 && i % 5 === 0){ // if i/3 and 1/5 do not produce a remainder
r = 'FizzBuzz'; // reassign r
}
else if(i % 3 === 0){ // we knew i % 5 !== 0 so see if i/3 does not produce a remainder
r = 'Fizz'; // reassign r
}
else if(i % 5 === 0){ // we already knew i % 3 !== 0 - you know the drill
r = 'Buzz'; // reassign r
}
console.log(r); // console at each step of the loop no matter what
}
}
startConsoleDemo(); // without () you can use like a var then () later
I have a solution and I'm pretty sure it'll work for you.
for (let i = 1; i <= 100; i++) {
if (i % 3 === 0 && i % 5 === 0) {
document.write(`${i} FizzBuzz`);
} else if (i % 3 === 0 && i % 5 !== 0) {
document.write(`${i} Fizz`);
} else if (i % 5 === 0 && i % 3 !== 0) {
document.write(`${i} Buzz`);
} else {
document.write(`${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 6 years ago.
Improve this question
OK, now my issue is that no matter what I do, it will only present the information as Level 1 instead of the designated level that I try. The code is as follows
function XPlevel(XP, level) {
if((XP >= 0 && XP < 300) && level === 1) {
level = 1;
} else if ((XP >= 300 && XP <900) || level === 2) {
level = 2;
} else if ((XP >= 900 && XP <2700) || level ===3) {
level = 3;
} else if ((XP >= 2700 && XP < 6500) || level === 4){
level = 4;
} else if ((XP >= 6500 & XP < 14000) || level === 5){
level = 5;
} else if ((XP >= 14000 && XP < 23000) || level === 6) {
level = 6;
} else if ((XP >= 23000 && XP < 34000) || level === 7) {
level = 7;
} else if ((XP >= 34000 && XP < 48000) || level === 8) {
level = 8;
} else if ((XP >= 48000 && XP < 64000) || level === 9) {
level = 9;
} else if ((XP >= 64000 && XP < 85000) || level === 10) {
level = 10;
} else if ((XP >= 85000 && XP < 100000) || level === 11) {
level = 11;
} else if ((XP >= 100000 && XP < 120000) || level === 12) {
level = 12;
} else if ((XP >= 120000 && XP < 140000) || level === 13) {
level = 13;
} else if ((XP >= 140000 && XP < 165000) || level === 14) {
level = 14;
} else if ((XP >= 165000 && XP < 195000) || level === 15) {
level = 15;
} else if ((XP >= 195000 && XP < 225000) || level === 16) {
level = 16;
} else if ((XP >= 225000 && XP < 265000) || level === 17) {
level = 17;
} else if ((XP >= 265000 && XP < 305000) || level === 18) {
level = 18;
} else if ((XP >= 305000 && XP < 355000) || level === 19) {
level = 19;
} else {
level = 20;
}
return level;
}
XPlevel(XP, level);
So when I plug in a character that is Level 5 for instance, it gives me back level 1 instead.
Any thoughts?
First of all, never code like this, never have multiple if-else statements that make semantically similar checks that could be written using an array or hash table in a few lines.
Your function could be re-written like this:
var xp_required = [0, 300, 900, 2700, 6500]; // ...etc, you fill this table with the XP required to be at Level = index + 1 (indices start at 0 in Arrays).
// XP for level: 1 2 3 4 5 ...
function getLevel(xp) {
for(var level = xp_required.length - 1; level >= 0; --level) {
if(xp >= xp_required[level] {
return level + 1; // The +1 is needed because Array's index starts at 0 but levels start at 1
}
}
console.log("XP value can not be negative. The given value was: " + xp);
return 0;
}
The for loop starts at the highest level and checks if the XP is enough for the player to be considered that level. If it's not, it means that the player is actually a lower level, thus decrementing the level value to be checked (until we reach index 0 which means Level 1). This means that once we get to the first level for which the XP sufficies it means that is indeed the correct level.
As a note, this could be improved by doing a binary search instead of a linear search, but I assume that this function is not called that often so the O(max_level) complexity is good enough.
Also, why is level both an input and output value for your function?
(Beside the XP stuff...) you're basically doing if level == 1 return 1 which is nonsensical.
If you already know the level than logically you don't need to check for the level.
The simplest & fastest way to get a level out of an array of XP values:
function getLevel(XP) {
var LV = 0;
[0, 300, 900, 2700, 6500, 14000].some(function(v, i) {
LV = i; // Level = index
return v > XP; // We have the LV value! Break out of loop (if condition is met)!
});
return LV;
}
Use like
var level = getLevel(2699); // 3
https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/some
I have a configurable product that allows a user to specify a quantity. The item is made on a sheet with multiple items on it (50) and if the user specifies:
0-50 = 1 sheet
51-100 = 2 sheets
101-150 = 3 sheets
And so on until about 700 units. Currently I am doing this:
sheetCount = quantity / 50;
if (sheetCount == 0) {
sheetCount = 1;
}
if (pixelcounts[key] < 50) {
sheetcount = 1;
} else if (pixelcounts[key] > 50 && pixelcounts[key] < 100) {
sheetcount = 2;
} else if (pixelcounts[key] >= 100 && pixelcounts[key] < 150) {
sheetcount = 3;
} else if (pixelcounts[key] >= 150 && pixelcounts[key] < 200) {
sheetcount = 4;
} else if (pixelcounts[key] >= 200).......
Is there an easier way to loop through this?
sheetCount = Math.ceil( quantity / 50 );
Going by what your code sample says (which is different than your example), the following should work:
sheetCount = Math.floor(pixelcounts[key] / 50) + 1;
I want some script for my app to change the font-size of a title depending on number of characters and the resolution, so to use different font-sizes in the script depending on window resolution and the number of characters of the title.
This is what I have right now:
$(document).ready(function () {
$(".boxes.concierto h2.nombreartista span a").each(function () {
var numChars = $(this).text().length;
if ((numChars >= 1) && (numChars < 20)) {
$(this).css("font-size", "20px");
}
else if ((numChars >= 20) && (numChars < 30)) {
$(this).css("font-size", "18px");
$(this).css("line-height", "20px");
}
else if ((numChars >= 30) && (numChars < 60)) {
$(this).css("font-size", "15px");
$(this).css("line-height", "18px");
}
else if ((numChars >= 100) && (numChars < 140)) {
$(this).css("font-size", "0.9em");
}
else {
$(this).css("font-size", "0.8em");
}
});
});
I have tried to add:
if($(window).width() >= 1300){
// do your stuff
}
at the begining and end of my script but is not working.
Any idea how can I join this two functions correctly?
Thank you so much
you probably want to create a condition where either the number of characters or the resolution change the text size.
use the or-operator || in your if condition
if ( ((numChars >= 20) && (numChars < 30)) || $(window).width() >= 1300 ) {
$(this).css("font-size", "20px");
}
a better way
the conditions might get quite complex. a better way would be to setup a formula like:
var textSize = 1/numChars * $(window).width() * factor;
if you want the text size to change in steps you can do something like this:
var stepSize = 3;
var steppedTextSize = Math.floor(textSize/stepSize) * stepSize;
the steppedTextSize will have values in increments of 3. like: 12, 15, 18, ...