@andreas2249 if that's what you mean, you can just add
margin-bottom: ...; to your .section-padding class. Not sure what exactly you're looking for.
@hiltydiggs, 'Porfolio' and 'About' use this:
.section-padding {
margin-top: 3em;
}It adds space to prevent those elements from being too close to the bottom of menu structure.
The same CSS doesn't seem to work with the 'Contact' section -- because of the .well class. Not sure how to override that.
(If you click 'Portfolio' or 'About' links, they're displayed with space above them (which puts them below the menu. Same is not happening for 'Contact') :)
@andreas2249 I see what you're saying now. I'll see if I can figure anything out.
Thank you, kindly, @hiltydiggs
andreas2249 sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:warning: andreas2249 already gave hiltydiggs points
@andreas2249 adding a
padding-top: ...; to #contact seems to work. Test that out.
@MikeBeers
in my code I have a console.log statement and it prints the info to the console. But if i try and access the same info from the Console as trying to debug I get a reply of undefined.
in my code I have a console.log statement and it prints the info to the console. But if i try and access the same info from the Console as trying to debug I get a reply of undefined.
var game = {
computer: function() {
var timeOut;
var cpArr = [];
cpArr = clrArr.slice(0,2);
console.log(cpArr);
from the console I type game.computer.cpArr and it returns undefined.
why?
@MikeBeers hmm. Where is clrArr defined?
global
I'm confused on the algo Sorted Union,
There are an n amount of arguments but only 1 parameter so
function uniteUnique(arr) {
}
uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]);console.log(arr) returns [1,3,2]
How can I access the n amount of other arrays that are passed as arguments?
does my question make sense?
@MikeBeers yes. Do you have a link?
Thank you, @hiltydiggs. I had tried that before and can only get the form lower. I'm trying to get the entire well below the menu. Here's what I had tried:
<div id="contact" class="contact-padding well container-fluid">
.contact-padding {
padding-top: 3em;
}Also tried the same CSS here:
<h1 class="col-xs-offset-2 col-xs-8 contact-padding">Contact Us</h1>That moves 'Contact' form down -- but not the well... :(
andreas2249 sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:warning: andreas2249 already gave hiltydiggs points
from codepen there is a console window. from that window I am just trying to get the same output from the console.log statement from my js code. Trying to just get a better understanding.
@MikeBeers trying to figure it out...
@hiltydiggs, this is the effect I'm looking for: https://s32.postimg.org/4ei4h1k9x/space.png
@MikeBeers @andreas2249 still working on both... no answers yet.
http://codepen.io/buiphuking/pen/JKoEZG?editors=0010
hi guys, i build tic tac toe, how to make the second time run right ?
hi guys, i build tic tac toe, how to make the second time run right ?
@hiltydiggs, I'm in no hurry. I do appreciate your time and consideration. Thamk you. :)
Why isn't nth-of-type working here? http://codepen.io/kingdezz/pen/mErWxy
There should be no border radius in the middle <a>
@suka6792 awesome. you did it. :+1:
@96street - I do not see a border radius in the middle
<a>? It looks like it has square corners? Using Chrome on windows. You do have a broken image symbol for the icon, though.
@khaduch it's on
:hover I believe.
@hiltydiggs - you might have to add a
:hover pseudo-class rule for that, then? It is hard to see unless you're looking for it...
@hiltydiggs - because then it looks like the bottom one has no bottom border-radius on hover...
@khaduch yeah. They're all taking on the
border-radius: 5px 5px 0 0; from the first selector it seems.
@hiltydiggs - sometimes there are crazy things with
nth-of-type - like it doesn't work well with classes or something? Let me see if I can dig up some notes that I had?
What is a good thing I can use to show my GitHub user feed from my website?
can i ask a dumb question, when we need angular ?????????????
@buiphuking angular is good for when you need to display information that changes frequently I know.
@hiltydiggs thanks
buiphuking sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 533 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
@hiltydiggs - I found a stackoverflow note about it - you have to have the nth-of-child on the li elements, like this:
.settingsMenu li:nth-of-type(1) a {
border-radius: 5px 5px 0 0;
}
.settingsMenu li:nth-of-type(2) a {
border-radius: 0px;
}
.settingsMenu li:nth-of-type(3) a
{
border-radius: 0 0 5px 5px;
}In this note: http://stackoverflow.com/questions/15320048/why-isnt-my-ahovernth-child-code-working
anyone around to lend a hand for the twitch tv project?
@laurenamy - I might be able to help - what's up?
I'm trying to populate a new container for each user profile with a for loop but when I inspect, each one has a numbered class of 9. here's the link https://codepen.io/laurenamy/pen/NrRbyz?editors=1010
I'm not worried about the undefined stuff yet, trying to get the set up down
@laurenamy - without even looking at the code, I'll bet that you're running into the problem where the value of the variable
i at the end of the for loop is 9, and since each callback function instance is seeing the same i as a "global" (global to all of the callback functions) they all have the same value, which is the loop termination value.
@laurenamy - you can read about it in the third point of discussion http://javascriptissexy.com/understand-javascript-closures-with-ease/ in that article. "Closures Gone Awry"
@khaduch that definitely seems to be the issue! I'll give that a read and see if I can fix. thanks!
laurenamy sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1347 | @khaduch |http://www.freecodecamp.com/khaduch
@laurenamy you can also take a look at mine as a working example. Not the most efficient code, but it's functional and follows a similar pattern as yours using closure.
@laurenamy - I just tried this really quickly:
var xxx = i;
$.getJSON(url, function(data) {
var i = xxx;And it seems to work, at least for getting unique user status, because it uses the value of i immediately. It gets the same user name in there for each user (not sure why) but it looks like unique ID numbers being assigned?
I just added those two lines before and after the $.getJSON call.
I've got them all set to 8 now, which is the index of the last userName. hmm
Hello fellow devs, I'm having this problem: I'm retrieving a json from an api and then append the data from it to my html, but since the fetching takes a second or so, it displays undefined instead of the actual data. Thoughts?
@dbstratta The very essence of async data. You will need to use callbacks to show the info
the function inside the ajax is a callback
it has access to the data after it is received
Yes! Thank you!
@jdtdesigns Thank you! I put the function as a callback in $.getJSON() and it worked
dbstratta sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 516 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
;)
@laurenamy - I did come up with something that worked, based on the example in that article - it takes me a while to get it straight, and there might be a simpler way to do it (I thought my first suggestion was good, but didn't get the username right.) So this seems to work, replacing the for loop with this:
for (var i = 0; i < userNames.length; i++) {
var url = "https://api.twitch.tv/kraken/streams/" + userNames[i] + "?callback=?";
var callback = function(j) {
//add html for each user profile
return function(data) {
$(".profiles").append("<div class='col-md-6 well user-profile" + (j + 1) + "'><ul class='profile-items'><li class='display-names display-name" + (j + 1) + "'></li><li class='status user-status" + (j + 1) + "'></li><li class='game game" + (j + 1) + "'></li><li class='stream-link stream-link" + (j + 1) + "'></li></ul></div>");
console.log(data);
var user = userNames[j];
var status = "";
var game = "";
var streamLink = "https://www.twitch.tv/" + user;
var picUrl = "";
var profLink = "";
$(".display-name" + (j + 1)).html("<h2>" + user + "</h2>");
if (data.status === null) {
status = "Offline";
} else {
status = "Online";
console.log(status);
$("#stat").html("User is: " + status);
}
//end if else
}
}(i);
$.getJSON(url, callback)
} // end forBasically it used that "Immediately Invoked Function Expression" to "lock in" the current for loop's value of i into the callback function.
that did it! I'll have to do some more reading so I understand why, but thanks again!!
why we need node.js ????????????????
I'm a little confused... I'm on a waypoint about for loops, and it's having the for loop run as long as i<arr.length. So this means if the array has 3 parts, it'll stop running after two right? Why does that work? It's initialized at i=0.
@buiphuking node.js runs javascript in a server environment. It's also used by a lot of tools to run commandline programs that don't need to involve a browser.
@ThomasBurgess2000 Arrays start from 0.
So 2 = 3rd element. It's a language feature inherited from older languages.
Ohhh yeah. So if you want to go through all of the array elements you should always start at 0? Thanks @GarySiu
thomasburgess2000 sends brownie points to @garysiu :sparkles: :thumbsup: :sparkles:
:cookie: 56 | @garysiu |http://www.freecodecamp.com/garysiu
You got it!
Awesome.
@GarySiu
on curriculum freecodecamp, i've just finished tic tac toe, should i learn node.js right now ?
on curriculum freecodecamp, i've just finished tic tac toe, should i learn node.js right now ?
Hey, I'm just another camper! As I understand it freecodecamp is self directed: you learn what you want to learn.
@buiphuking correct. You can go to whatever you choose.
node is fun and it opens doors to making other tools. But if you're focused entirely on the front end, I think you can get away with just being aware of it?
plz help me with css
i want to put 4 colors in .game
http://codepen.io/buiphuking/pen/aZmWbx?editors=1100
i want to put 4 colors in .game
http://codepen.io/buiphuking/pen/aZmWbx?editors=1100
@buiphuking add
float: left to each of the color elements
@hiltydiggs
thanks
thanks
buiphuking sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 534 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
Any idea why the return at the end of this code doesn't return anything?
var contacts = [
{
"firstName": "Akira",
"lastName": "Laine",
"number": "0543236543",
"likes": ["Pizza", "Coding", "Brownie Points"]
},
{
"firstName": "Harry",
"lastName": "Potter",
"number": "0994372684",
"likes": ["Hogwarts", "Magic", "Hagrid"]
},
{
"firstName": "Sherlock",
"lastName": "Holmes",
"number": "0487345643",
"likes": ["Intriguing Cases", "Violin"]
},
{
"firstName": "Kristian",
"lastName": "Vos",
"number": "unknown",
"likes": ["Javascript", "Gaming", "Foxes"]
}
];
function lookUpProfile(firstName, prop){
// Only change code below this line
return contacts[0].length;
@buiphuking or use absolute positioning
@ThomasBurgess2000 Objects don't have a length property
Crap you're right. I was trying to find the length of the first array. How would I go about that? @GarySiu
Wait, isn't that what I was doing?
I'm so confused
Because contacts[0] returned the whole first array
contacts.length will tell you how many contacts
@ThomasBurgess2000 contacts[0].likes.length
I want to know how many properties in the first contact. I think. @GregatGit
@ThomasBurgess2000 or what @GregatGit to get the length of contacts.
Object.keys(contacts[0]).length
@ThomasBurgess2000
whoa there I don't know anything about object.keys @jdtdesigns
@ThomasBurgess2000 Object.keys documentation
Ok interesting. So is there no other way to find the length of a second level array?
@ThomasBurgess2000 what are you trying to get the length of?
contacts[0]
You have an array of objects. The only other array is the value of contacts[x].likes.
contacts[0] is an object.
ohhhhhhhhhhhhhhhhhhhhh @hiltydiggs
Thanks so much @hiltydiggs
thomasburgess2000 sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 535 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
@ThomasBurgess2000 the way you get the length of keys in an object is what i gave you above
Thank you! @jdtdesigns
thomasburgess2000 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 517 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Quick QUESTION: Why is my push chgArr causing a infi loop at the bottom under the else???
function checkCashRegister(price, cash, cid) {
var val;
var cost=arguments[0];
var money=arguments[1];
var till= arguments[2];
var count=0;
var arr=[];
var change= money-cost;
if(change<0){
change=Math.abs(change);}//this makes change positive if its negative value
else change=change;
for(i=0; i<till.length;i++){
count+=till[i][1];}
if(change>count){
return "Insufficient Funds";
// Make a count that totals till values. If change is more than till then say so
} else{
var chgCount=0;
var chgArr=[];
for(j=till.length-1;j>0;j--){ //go through till from highest to lowest
while(change>chgCount){//while change is more than 0
chgCount+=till[j][1]; //add number to change from till
chgArr.push(till[j][0]);//put that in an array THIS IS CAUSING A INFI LOOP FOR SOME REASON HOW DO I CHANGE THAT!?
change-=till[j][1];//Take that number off change.
}
}return chgArr;
}
}
checkCashRegister(2.50, 20.00, [["PENNY", 1.01], ["NICKEL", 2.05], ["DIME", 3.10], ["QUARTER", 4.25], ["ONE", 90.00], ["FIVE", 55.00], ["TEN", 20.00], ["TWENTY", 60.00], ["ONE HUNDRED", 100.00]]);
@khaduch when you hover you can see it
@123xylem - you are changing
chgCount within the while loop, so it probably never satisfies the condition?
@123xylem @khaduch that's what I was leaning toward.
Good evening, Campers. Stumped here: Trying to add a space above the Bootstrap
well, just as I have above the 'Portfolio' and 'About' sections here in my CodePen. I suspect I need to override the .well class to do that. Not sure how: Here's the Pen: http://codepen.io/andreas2249/pen/PzGNZm/
Hey guys, could you take a look at my repo and let me know what you think about it? https://github.com/DanStockham/Mstream_skillTest
Here's what I would like it to look like when the 'Contact' button is pressed: https://s32.postimg.org/4ei4h1k9x/space.png
Thanks in advance for your time and consideration. :)
@khaduch @hiltydiggs Let me see what u mean
@andreas2249 I found a solution
Ha! Really, @hiltydiggs ? What have I been doing wrong?
@andreas2249 if you add an empty div above the #contact div and target that in your navigation it performs how you want. Sort of a work-around, really. But it can at least move you along for now.
<li><a href="#test">Contact</a></li>
...
<div id="test"></div>
<div id="contact" class="well container-fluid">Brilliant! That's a great suggestion, @hiltydiggs. I'm going to use that so I can, as you correctly stated, "...move along for now." I do need to wrap this part up.
Thank you again so much for your time and consideration on this issue. Best wishes to you, @hiltydiggs. :) :+1:
andreas2249 sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 536 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
@andreas2249 no problem! It still bothers me a bit, and I might play with it more to see what's up. Probably something obvious that we're looking past.
Can someone help me with calling an API with jquery for my FCC random quote app? The goal is to return the JSON object to pass it to another function. The problem is that it returns undefined:
Here is the project: https://hyperdev.com/#!/project/thorn-hound
Here is the code in question (excerpt from app.js frontend):
const quoteMachine = {
apiURL: "https://got-quotes.herokuapp.com/quotes",
getJSON: function(url, data, callback) {
$(document).ready(function() {
$.getJSON(url, callback);
});
},
getRandomQuote: function() {
const randomQuoteObj = this.getJSON(this.apiURL, null, function(quoteObj) {
return quoteObj;
});
}
};Thank you
Thanks, Dan. I agree with your assessment. It did surprise me today. I thought it was going to be a 3-minute issue. Many thanks again, Dan. :)
@sophiabrandt I don't see where quoteObj is defined
@hiltydiggs Thanks given
danstockham sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 537 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
@hiltydiggs imho that's the callback function which takes what you get from $.getJSON and returns it.
@hiltydiggs do you know what I need to do to "define" it? The api returns a JSON object if you use a normal get request from your browser.
@sophiabrandt I'm not familiar with building them in object form, so I'm not exactly sure.
@hiltydiggs how would you do it when you don't use an object? I just don't understand how the jquery.getJSON callback works. I looked at the api but I don't understand it.
When I look here at the first example https://api.jquery.com/jQuery.getJSON/ they just use the callback function
When I look here at the first example https://api.jquery.com/jQuery.getJSON/ they just use the callback function
function( data ) { //bla} and use the stuff that the API returns to append it to the HTML. I just need to return the data.
@sophiabrandt something like:
$.getJSON("your-api-url", function(data){
return data;
});
@hiltydiggs, tried it. Can't get it to work in my page. Eight hours at this one issue. :(
@hiltydiggs thanks. AFAIK I'm doing that. I just called the parameter/argument something different but that shouldn't have any consequence. But thank you for looking into it.
:cookie: 538 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
sophiabrandt sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
@sophiabrandt I'll try more.
This is what the debugger tells me:
const quoteMachine = {
getJSON: function(url, data, callback) { // url = "https://got-quotes.herokuapp.com/quotes", data = null, callback = function(quoteObj)
$(document).ready(function() {
$.getJSON(url, callback); // url = "https://got-quotes.herokuapp.com/quotes", callback = function(quoteObj)
});
},
apiURL: "https://got-quotes.herokuapp.com/quotes",
getRandomQuote: function() {
const randomQuoteObj = this.getJSON(this.apiURL, null, function(quoteObj) {
return quoteObj; // randomQuoteObj = undefined
});
}
On my simon game I am trying to get one color to flash then a second color to flash. I am trying to use window.setTimeout on a for loop. It does not seem to be making it to the for loop.
var game = {
cpArr: [],
computer: function() {
var timeOut;
this.cpArr = clrArr.slice(0, 2);
timeOut = window.setTimeout(this.itterate, 500)
},
itterate: function() {
for (var i = 0; i < this.cpArr.length; i++) {
alert(this.cpArr[i]);
if (this.cpArr[i] === "green") {
display.flash('green');
}
if (this.cpArr[i] === "red") {
display.flash('red');
}
if (this.cpArr[i] === "yellow") {
display.flash('yellow');
}
if (this.cpArr[i] === "blue") {
display.flash('blue');
}
}
},
@sophiabrandt can you link your pen
sophiabrandt sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1130 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Quick Question: How do I make my whhile loop work for the last condition??
function checkCashRegister(price, cash, cid) {
var val;
var cost=arguments[0];
var money=arguments[1];
var till= arguments[2];
var count=0;
var arr=[];
var change= money-cost;
var tillCount=0;
var chgCount=0;
if(change<0){
change=Math.abs(change);}//this makes change positive if its negative value
else change=change;
for(i=0; i<till.length;i++){
count+=till[i][1];}
if(change>count){
return "Insufficient Funds";
// Make a count that totals till values. If change is more than till then say so
} else{
var chgArr=[];
for(i=till.length-1;i>=0;i--){
while(change>chgCount&& till[i][1]>0 && till[i][1]<=change){// HOW DO I MAKE till[i][1]<=change NOT FAIL on while loop? I can use if but not sure how to use an if here??
chgCount+=till[i][1];
change-=till[i][1];
chgArr.push(till[i][0]+till[i][1]);
}
return chgArr;}
}
}
checkCashRegister(2, 20.00, [["PENNY", 1.01], ["NICKEL", 2.05], ["DIME", 3.10], ["QUARTER", 4.25], ["ONE", 90.00], ["FIVE", 55.00], ["TEN", 20.00], ["TWENTY", 60.00], ["ONE HUNDRED", 100.00]]);
@sophiabrandt hmmm your log says: Uncaught TypeError: Cannot read property 'quote' of undefined
Is it clumsy to crop images with css/bootstrap? Would you use things like jQuery, JavaScript or just GIMP instead?
wiki Confirm the Ending
:point_right: algorithm confirm the ending [wiki]
Algorithm Confirm the Ending
:checkered_flag: Problem Explanation:
The function is a whole Boolean operation. You need to return true if the first argument ends with the second argument. This means that for the problem script, it should return true for the confirmEnding('Bastian', 'n'); case.
Relevant Links
:pencil: read more about algorithm confirm the ending on the FCC Wiki
@tonnamb, good question. I like to use Gimp or Photoshop where I have complete control over the final image. Then finesse with css, only if needed for positioning, padding, etc.
(not padding -- meant margins... :) )
@tonnamb, thought of another application: Compose final image in Gimp/Photoshop to preserve aspect ratio. Then would use
border-radius in css to round corners or create an oval or circle. With that, original image will stay intact as a rectangle. To me it was quicker to do that in CSS vs. Gimp -- and then have an extra copy floating around.
wiki Join Strings with join
:point_right: challenge join strings with join [wiki]
Challenge Join Strings with Join
We can use the .join() method to join each element in an array into a string separated by whatever delimiter you provide as an argument to the join operation.
var joinMe = joinMe.join(" ");:pencil: read more about challenge join strings with join on the FCC Wiki
Quick Interesting QUEstion!!!:
checkCashRegister(2, 20.00, [["PENNY", 1.01], ["NICKEL", 2.05], ["DIME", 3.10], ["QUARTER", 4.25], ["ONE", 90.00], ["FIVE", 55.00], ["TEN", 20.00], ["TWENTY", 60.00], ["ONE HUNDRED", 100.00]]);Im trying to convert the array into usable chuhnks that a count can accumulate with. EXAMPLE: in ["TEN", 20.00] there are 2 10s = 20.00... I need the array to say 10,10 so that count can use the values .
The challenge is Exact Change
@123xylem I made an array of the denominations
[.01, .05, .1, .25...] and pushed them into each of the denominations in the drawer variable.
var denoms = [.01, .05, .1, .25, 1, 5, 10, 20, 100];
for (var i = 0; i < cid.length; i++) {
cid[i].push(denoms[i]);
}
@hiltydiggs hmm
il try that
Im just worried il havge to say i123456789
when adding it to change
it only adds 1 instance
This message was deleted
How can i say push denom into till as many times as denom adds up to till?
var denoms = [0.01,0.05, 0.1, 0.25, 1, 5, 10, 20, 100];
for (var t = 0;t < till.length; t++) {while(till[t]/denoms[t]!=1){
till[t].push(denoms[t]);}
}
till= 100, 25, 5 etc
so first case = 100 0.01s
maybe its not good code but it should work
HTML5 says semantic elements such as header, nav, footer, etc should be used instead of Div.But Bootstrap most of them are using Div tag.So Which is the good approach Bootstrap Div tags or HTML5 Semantic Tags and Why and how can i use semantic element is bootstrap
[ [ 'PENNY', 1.01, 0.01 ], [ 'NICKEL', 2.05, 0.05 ], [ 'DIME', 3.1, 0.1 ], [ 'QUARTER', 4.25, 0.25 ], [ 'ONE', 90, 1 ], [ 'FIVE', 55, 5 ], [ 'TEN', 20, 10 ], [ 'TWENTY', 60, 20 ], [ 'ONE HUNDRED', 100, 100 ] ]
Eg var howManYcoins = array1/[2]
but for each array
@123xylem
arrays = [ [ 'PENNY', 1.01, 0.01 ], [ 'NICKEL', 2.05, 0.05 ], [ 'DIME', 3.1, 0.1 ], [ 'QUARTER', 4.25, 0.25 ], [ 'ONE', 90, 1 ], [ 'FIVE', 55, 5 ], [ 'TEN', 20, 10 ], [ 'TWENTY', 60, 20 ], [ 'ONE HUNDRED', 100, 100 ] ];
for (array of arrays) {
var numCoins = array[1]/array[2];
}
@123xylem This would work as well:
arrays = [ [ 'PENNY', 1.01, 0.01 ], [ 'NICKEL', 2.05, 0.05 ], [ 'DIME', 3.1, 0.1 ], [ 'QUARTER', 4.25, 0.25 ], [ 'ONE', 90, 1 ], [ 'FIVE', 55, 5 ], [ 'TEN', 20, 10 ], [ 'TWENTY', 60, 20 ], [ 'ONE HUNDRED', 100, 100 ] ];
for (var i = 0; i < arrays.length; i++) {
var arr = arrays[i];
var numCoins = arr[1]/arr[2];
}
@igorcadelima thanks
123xylem sends brownie points to @igorcadelima :sparkles: :thumbsup: :sparkles:
:cookie: 13 | @igorcadelima |http://www.freecodecamp.com/igorcadelima
Im studying it now
@igorcadelima Ahh what i wanted was for it to go in every array
not just the last
@123xylem But it is going through each array
ok let me try
does it push nucoins into array:
?
http://codepen.io/IulianCrudu/pen/BzLRGx Is this ok?
Try to use console.log like this:
arrays = [ [ 'PENNY', 1.01, 0.01 ], [ 'NICKEL', 2.05, 0.05 ], [ 'DIME', 3.1, 0.1 ], [ 'QUARTER', 4.25, 0.25 ], [ 'ONE', 90, 1 ], [ 'FIVE', 55, 5 ], [ 'TEN', 20, 10 ], [ 'TWENTY', 60, 20 ], [ 'ONE HUNDRED', 100, 100 ] ];
for (array of arrays) {
var numCoins = array[1]/array[2];
console.log(numCoins)
}
Nope. As you didn't ask for that, it doesn't push anything into the array
It just takes an array from the larger array and divides its second element by its third one storing the result in the numCoins variable
@igorcadelima sorry yea thats what im trying to do now
I did this already but it only pushes the last value
for(j=till.length-1;j>=0;j--){
var amountOfType=till[j][1]/till[j][2];
till[j].push(amountOfType);
Could you paste the rest of your code here?
y
function checkCashRegister(price, cash, cid) {
var val;
var cost=arguments[0];
var money=arguments[1];
var till= arguments[2];
var count=0;
var arr=[];
var change= money-cost;
var tillCount=0;
var chgCount=0;
var convertedTill=[];
var denoms = [0.01,0.05, 0.1, 0.25, 1, 5, 10, 20, 100];
for (var t = 0;t < till.length; t++) {
till[t].push(denoms[t]);}
if(change<0){
change=Math.abs(change);}//this makes change positive if its negative value
else change=change;
for(i=0; i<till.length;i++){
count+=till[i][1];}
if(change>count){
return "Insufficient Funds";
// Make a count that totals till values. If change is more than till then say so
} else{
var chgArr=[];
for(j=till.length-1;j>=0;j--){
var amountOfType=till[j][1]/till[j][2];
till[j].push(amountOfType);
while(change>chgCount&& till[j][1]>0 ){// HOW DO I MAKE till[i][1]<=change NOT FAIL on while loop? I can use if but not sure how to use an if here??
if(till[j][1]<=change){
chgCount+=till[j][1];
change-=till[j][1];
chgArr.push(""+till[j][0]+ ""+", "+""+till[j][1]+"");
}
else{j--;}}
return till;}
}
}
checkCashRegister(2, 20.00, [["PENNY", 1.01], ["NICKEL", 2.05], ["DIME", 3.10], ["QUARTER", 4.25], ["ONE", 90.00], ["FIVE", 55.00], ["TEN", 20.00], ["TWENTY", 60.00], ["ONE HUNDRED", 100.00]]);
@igorcadelima
Are you trying to achieve something like this with the array?
[["PENNY",1.01,0.01,101],["NICKEL",2.05,0.05,40.99999999999999],["DIME",3.1,0.1,31],["QUARTER",4.25,0.25,17],["ONE",90,1,90],["FIVE",55,5,11],["TEN",20,10,2],["TWENTY",60,20,3],["ONE HUNDRED",100,100,1]]
I don't know if you've already noticed, but you're only letting the for loop go through one iteration because of the
return tillin the last line. That's why you're only doing the thing you want to to do with the last array
I advise you to try to ident the code correctly so that you can avoid this sort of problems
@123xylem
function(){
var dict = []; // creating a new array
var mapValue = JSON.parse(localStorage.getItem("ngStorage-Map"));
// fetching a value which i want to push
dict.push(mapValue); // this push is not appending the value its overridding the existing one
console.log(dict);
};
Any help how to append the value to an array at trhe newxt index position??
Ca anyone help me out?
@deepakpatil007 How is it overriding if
dictis empty when you try to push mapValue into it?
Hi there ... has anyone had any issues with the palindrome challenge 239 ?
Can get all tests to pass except the one with a backslash - because the escaping of the backslash in the test string is incorrect ... I think ...
Never mind ... passed test when I only allowed alphanumeric chars to be compared
Profole
Portfolio challenge
@igorcadelima yea
sorry ive een busy
@igorcadelima u did it thanks
123xylem sends brownie points to @igorcadelima :sparkles: :thumbsup: :sparkles:
:cookie: 14 | @igorcadelima |http://www.freecodecamp.com/igorcadelima
return was in a bracket... It always gets me cos it gets hard to keep track of all the brackets
function checkCashRegister(price, cash, cid) {
var val;
var cost=arguments[0];
var money=arguments[1];
var till= arguments[2];
var count=0;
var arr=[];
var change= money-cost;
var tillCount=0;
var chgCount=0;
var convertedTill=[];
var denoms = [0.01,0.05, 0.1, 0.25, 1, 5, 10, 20, 100];
for (var t = 0;t < till.length; t++) {
till[t].push(denoms[t]);}
if(change<0){
change=Math.abs(change);}//this makes change positive if its negative value
else change=change;
for(i=0; i<till.length;i++){
count+=till[i][1];}
if(change>count){
return "Insufficient Funds";
// Make a count that totals till values. If change is more than till then say so
} else{
var chgArr=[];
for(j=till.length-1;j>=0;j--){
var amountOfType=till[j][1]/till[j][2];
till[j].push(amountOfType);
while(change>chgCount&& till[j][1]>0 &&change!==chgCount ){// HOW DO I MAKE till[i][1]<=change NOT FAIL on while loop? I can use if but not sure how to use an if here??
if(till[j][1]<=change){
chgCount+=till[j][2];
change-=till[j][2];
chgArr.push(""+till[j][0]+ ""+", "+""+till[j][2]*[j]+"");//HERE I WANT TO RETURN eg 10 pennies as 0.10 rather than penny 0.1 10 times HOW??
}
else{j--;}}
}return chgArr;
}
}
checkCashRegister(15, 20.00, [["PENNY", 1.01], ["NICKEL", 2.05], ["DIME", 3.10], ["QUARTER", 4.25], ["ONE", 90.00], ["FIVE", 55.00], ["TEN", 20.00], ["TWENTY", 60.00], ["ONE HUNDRED", 100.00]]);
Hi all, I've been working on the Wikipedia viewer but the API call doesn't work even though I'm doing it exactly the same way as with my other Front End api projects.. can anyone have a look please? http://codepen.io/joostvanheesbeen/pen/RRPqja
@joostvanheesbeen Your URL to the Wikipeida API seems to be correct because it works when i test it in a empty tab
yeah that's why I'm so confused!
@joostvanheesbeen I sent you a PM :)
When I use .css() to change a property, it takes away all the css I previously had. Can somebody help me here? http://codepen.io/kingdezz/pen/mErWxy
click 'Share'
Hello guys and gals, so excited that I've finally completed the twitch tv app!! Plz let me know your opinions and advices if you've got any ;), it's here: http://codepen.io/mania7539/pen/oLLepK
am doing the simon game and dont know how to do those vertical and horizontal lines between the circles. could any of you guys here, help??
here's the link - http://codepen.io/silentarrowz/pen/QEKgxW
here's the link - http://codepen.io/silentarrowz/pen/QEKgxW
@mania7539 your twitchtv app looks good. I have recently finished it too, but dont know how to get the channels with online status to show at the top. here's mine - http://codepen.io/silentarrowz/pen/qZLZEy
@96street use .addClass instead
I believe that .css() overwrite the existing ones
just tried addClass and it had the same outcome :( @Doko85
Hello :smile:
@andreas2249 Thank you for your thoughts! I was very frustrated cropping image in CSS last night so I thought GIMP/Photoshop would be more efficient.
tonnamb sends brownie points to @andreas2249 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for andreas2249
Hi! Got a question about making a list centered: got the ul.list in css in the middle with text-align: center; but how do I get the dots from the <li> in the middle as well? Currently they're standing all the way to the left?
http://codepen.io/Menkoro/pen/OXRgZq
http://codepen.io/Menkoro/pen/OXRgZq
@96street you there?
yeah
@Doko85
check your private chat cause I made it work and I'm about to post the code in there ;)
Hi can someone help me make 4 differently sized images equally sized on my webpage?
I'm using class "col-xs-4" to identify the width, but then the height of the images are different. Other than specifying a height (which could be different based on desktop or mobile use) is there a way of doing something similar to the "col-xs-4" with height?
@Menkoro To make it work, I would use the bootstrap grid system, create <div class="row> and then <div class="col-lg-8 col-offset-lg-2">, with this you won't need text-aligh: center;
@tonnamb Thanks for the fast replay! Going to look into it :)
menkoro sends brownie points to @tonnamb :sparkles: :thumbsup: :sparkles:
:cookie: 121 | @tonnamb |http://www.freecodecamp.com/tonnamb
@Menkoro no problem! woops typo *text-align
@Ammardinho use the img-responsive class for each image
it should resize the image depending on the device
http://www.tutorialrepublic.com/twitter-bootstrap-tutorial/ a great bootstrap website that doesn't always show up on google ..
thanks @Doko85 , but the heights of the images are all different when I do that
ammardinho sends brownie points to @doko85 :sparkles: :thumbsup: :sparkles:
:cookie: 395 | @doko85 |http://www.freecodecamp.com/doko85
@tonnamb isn't it better to use col-sm-8 col-sm-offeset-2 instead cause it works for sm md and lg all together?
@Doko85 ahh yes I think so! I would leave this question open to the experts as I'm still learning as well
@Ammardinho don't mind the quality of the portfolio but this scaled pretty well on my browser when increasing\decreasng the zoom %
@tonnamb Could you take a moment to look at the code? I think I understand the basics of Bootstrap, but im not sure if im implementing it right
http://codepen.io/Menkoro/pen/OXRgZq
http://codepen.io/Menkoro/pen/OXRgZq
Could someone help me with this problem? All my images load fine on my laptop, but my personal photo doesn't load on my iPhone using Safari (host in Imgur).
https://codepen.io/tonnamb/pen/jrMmOZ
https://codepen.io/tonnamb/pen/jrMmOZ
that looks really cool..it looks like you're using bootstrap library that wasn't covered in the tuturials precedings the portfolio challenge. How do you find such library?
@Menkoro instead of <div class="col-sm-8 col-sm-offset-lg-2"> try this! <div class="col-sm-8 col-sm-offset-2">
@tonnamb Getting there! Thank you very much. I'll be able to figure out the rest on my own :)
menkoro sends brownie points to @tonnamb :sparkles: :thumbsup: :sparkles:
:warning: menkoro already gave tonnamb points
@Ammardinho http://getbootstrap.com/css/
thanks again
@Ammardinho I looked at another personal portfolio written in bootstrap: http://blackrockdigital.github.io/startbootstrap-agency/. I hope this is not cheating :satisfied: but it's very helpful to me to look at how experienced programmers layout their code
@Ammardinho at the source code I mean*
very cool. thanks for the insight!
will be trying that
Found out my problem about image loading... any images hosted on imgur will not show up on my phone, any experience something similiar?
Hey! I'd like some help with making my portfolio website work on mobile devices. Seems like the
background-image is messing up my layout in some way. https://greenheart.github.io
Guys tell me I can do this!!
I need some motivation to get me off my ass :D
you can do it!
@Doko85 thanks man! :)
martialis39 sends brownie points to @doko85 :sparkles: :thumbsup: :sparkles:
:cookie: 396 | @doko85 |http://www.freecodecamp.com/doko85
This message was deleted
I am doing random quote machine project. I wanted to include facebook icon in the project so that it post that quote on fb. Just like in twitter ,Quote is automatically written after when i click on twitter button.( I just have to click post ) Similarly i want this on tumblr and facebook. Please help me in doing this.
Anyone please ? Atleast provide me code for that. I will understand it myself.
@pdurbin Will you help me? Please
@silentarrowz Thanks man, glad you like it :) I think to make online on top, I am using 2 divs , <div id=a class="col-md-12"></div> <div id=b class="col-md-12"></div> , and I use after() to put online after id=a and offline after id=b so it will work well. Let me know your thought about it :)
mania7539 sends brownie points to @silentarrowz :sparkles: :thumbsup: :sparkles:
:cookie: 329 | @silentarrowz |http://www.freecodecamp.com/silentarrowz
looking for help with set time out on my simon game. I am trying to change one color then wait then change a second color. Both colors are changing at the same time.
var game = {
cpArr: [],
computer: function() {
var timeOut;
this.cpArr = clrArr.slice(0, 2);
timeOut = window.setTimeout(this.itterate, 500)
},
itterate: function() {
for (var i = 0; i < game.cpArr.length; i++) {
if (game.cpArr[i] === "green") {
display.flash('green'); }
if (game.cpArr[i] === "red") {
display.flash('red'); }
if (game.cpArr[i] === "yellow") {
display.flash('yellow'); }
if (game.cpArr[i] === "blue") {
display.flash('blue');
}
}
},
@ritvikraj14 sorry, it's Father's Day and the kids and I are off to a bike ride soon. Looks like a fun project though. You can probably model it off how you can tweet a quote.
Can i connect a regular ASUS monitor (or several monitors) to an Apple macbook laptop?, and use wireless keyboard and mouse etc.. so the Macbook function as a engine, sort of, displaying the large monitors i have connected to it?
@pixarbasim
Hello looking for some help
Can some one tell me how to get the thumbnail to properly wrap the image i used. https://codepen.io/pixar/full/LZNxXq/
Hello looking for some help
Can some one tell me how to get the thumbnail to properly wrap the image i used. https://codepen.io/pixar/full/LZNxXq/
as you can see the border is a margin on the left and right
what is the correct way to use it
what is the correct way to use it
quick question about the weather
Can you tell me why my icon is coming up as undefined?
Hey guys, SVG Animation Challenge: http://goo.gl/6wzrwR
Can someone help me figure out why the left border color of my items (the search results) won't turn yellow when the mouse goes over them? http://codepen.io/mcorby17/pen/vKGPmQ?editors=0110
@Martialis39 you can absolutely, positively, no question about it, never any doubt... get after this with a vengence and tenacity, like no other :sparkles:
@mcorby17 Because you don't have a border-left set anywhere?
@jdtdesigns I used border-color through a jquery .css call... shouldn't that do the same thing?
I just tried border-left-color and that didn't work either
@mcorby17 If you're referring to the white box with the 2px black border, you already have one set.
@jdtdesigns shouldn't I be able to change it though?
If I manually put "border-color-left: yellow" in the css it changes the color
@MikeBeers
I am trying to get one color to flash then a second color to flash after the first. They are both flashing at the same time. Can you look at my itterate function
https://codepen.io/MikeBeers/pen/MeejWE/?editors=0011
I am trying to get one color to flash then a second color to flash after the first. They are both flashing at the same time. Can you look at my itterate function
https://codepen.io/MikeBeers/pen/MeejWE/?editors=0011
<header>
<div class="row" style="padding:15px 0 15px 0">
<div class="col-md-12">
<div class="col-md-4">
<img width='40px' src="http://qlip.in/sites/default/files/qlip.png"/>
</div>
<div class="col-md-8">
<nav id="navbar" class="navbar">
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav navbar-right">
<li><a class="btn btn-default">1111</a></li>
<li><a class="btn btn-default">1111</a></li>
</ul>
</div>
</nav>
</div>
</div>
</div>
</header>
<div class="row" style="padding:15px 0 15px 0">
<div class="col-md-12">
<div class="col-md-4">
<img width='40px' src="http://qlip.in/sites/default/files/qlip.png"/>
</div>
<div class="col-md-8">
<nav id="navbar" class="navbar">
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav navbar-right">
<li><a class="btn btn-default">1111</a></li>
<li><a class="btn btn-default">1111</a></li>
</ul>
</div>
</nav>
</div>
</div>
</div>
</header>
hi guys, why my code the nav and img not in one row
@liangshun because your img is in a separate div
but i put two div in one row
<div class="row"></div>
Hello guys, how to do animations in bootstrap
@mcorby17 Here's what i would do. http://codepen.io/jdtadlock/pen/PzGKvG?editors=0100
Using borders is out of style btw.
@Yagnatheja what animiations?
@liangshun do you have a codepen you could post?
@dhcodes I want to fadeinup a table on scroll
@jdtdesigns Ok thanks!
mcorby17 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 518 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
css is so complex
@Yagnatheja i would add jquery in your codepen settings and then check out some sample code like this: http://api.jquery.com/fadein/
Newb here on the Weather Machine. Having trouble understanding why my second getJSON call is giving me a parse error. It is calling Open Weather API, and that API returns JSON. What am I missing? http://codepen.io/marcvesper/pen/aZZwop?editors=0012
@Yagnatheja here's the scroll one https://api.jquery.com/scroll/
@dhcodes I've searched for animations in google, it has shown some mdbootstrap. What is that?
hello coders
@Yagnatheja you mean what is mdbootstrap?
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title> Jamil Akhtar's | Portfolio </title>
</head>
<body>
<div class="page-header">
<div class="container">
<h1> Jamil Akhtar </h1>
<ul class="nav nav-pills pull-right">
<li><a href="#" class="active"> About </a></li>
<li><a href="#"> Portfolio </a></li>
<li><a href="#"> Contact </a></li>
</ul>
</div>
</div>
</body>
</html>can somebody tell me why h1 and nav is not at the same level
@dhcodes Yeah I mean, what is mdbootstrap?
@Yagnatheja looks like a modification of bootstrap with material design
same idea as regular bootstrap, just different css and features
@MikeBeers Your start loop is pushing 20 times. You need to set it up to just push one new button to the sequence, so a loop isn't needed. Fire the push, then fire the start sequence event that shows the sequence one by one.
@frontender007 looks like you are using bootstrap. I think your h1 should probably have the class of brand in bootstrap
check out a sample here: https://getbootstrap.com/components/#navbar
@all, If you haven't learned basic css and are wondering why you're have issues with Bootstrap or any other css framework, the answer is you shouldn't be using them. Start learning css and once you know html/css, then you can decide whether to use a framework or not. Most likely you'll never need one if you know css. ;)
thanks @dhcodes
frontender007 sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1064 | @dhcodes |http://www.freecodecamp.com/dhcodes
anyone know an easy way to have a 'loading' gif run while my weather app waits for the user to share their location>
@dhcodes it still not on the same level as nav
@frontender007 do you have a codepen?
@jaredabel make a div with Loading... and then change the html with jQuery/Javascript once the JSON call returns
using jsbin.com @dhcodes
in other words, replace the Loading... text of that div with the weather
@jaredabel
@frontender007 lol, sorry i was playing around. didn't realize it was live
I think you need the <nav> tags for bootstrap
here's one with just the brand <nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">
<img alt="Brand" src="...">
</a>
</div>
</div>
</nav>
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">
<img alt="Brand" src="...">
</a>
</div>
</div>
</nav>
and then you can add the links from the other example on the bootstrap site
@marcvesper Here's an example of functional programming. It's really important to start using this once you begin creating apps. ;) http://codepen.io/jdtadlock/pen/qNaPWe?editors=0012
@dhcodes Would you mind looking at my pen and explaining how i'd do that?
@jdtdesigns i'll be honest, callbacks make my head spin. i'll take a solid look through what you've done shortly and see if i understand my mistakes, thanks in advance :)
marcvesper sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 519 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
I thought I was done with my Weather App, but I have one concern and one wish-list fix.
@jaredabel with js or jquery you can modify the HTML of your page. So within your gray div, add text that says Loading, and then as part of the JSON call, once you have the info for the weather, replace the loading text with it
@jaredabel If you're wondering why it's not working, you're using geolocation in standard http which is now deprecated in chrome. You'll need to use an ip locator like http://ip-api.com/json/ for chrome and geolocation for other browsers. OpenWeather won't let you use https in codepen unless you pay for a premium account.
@AbdiViklas looks good, what's your concern?
and wish list?
- I notice that, at least on my phone (iPhone 4s), there's a difference between the way it renders in "full" view vs debug view--in full the content scales well to the screen, but in debug its tiny and not centered correctly
do I need to worry about my code, or blame it on Codepen?
i'd blame codepen.
you could use chrome dev tools to see the mobile views
@AbdiViklas
- Although im okay with not doing it, I was really hoping to vertically center the whole "card" in the viewport. Materialize says it's "easy" just by adding a couple of classes, but it ain't working out for me.
I've read that "valign" conflicts with "col", and I've tried getting rid of the row/col situation, but it still doesn't vertically align.
@AbdiViklas flexbox would be able to do it. I'm seeing if I can get it close without
Hi guys! I got stuck with my tribute page. CSS styling somehow not working on elements, only on the body element. Could somebody help me with that?
https://codepen.io/tamasc/pen/bewoNr
https://codepen.io/tamasc/pen/bewoNr
@AbdiViklas sorry gotta run. good luck tho
hey folks, for the twitch project, I'm having trouble with variables being overridden in the for loop. someone helped me last night with the callback. it's working for the user's channel but not for their status or game they're playing, thoughts? https://codepen.io/laurenamy/pen/NrRbyz?editors=1010
@dhcodes no problem, thanks!
abdiviklas sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1066 | @dhcodes |http://www.freecodecamp.com/dhcodes
Hey guys i'm having a hard time trying to remove the text-decoration from my search results... I want them to not have underlines when the move is over them. I've tried a couple things in the css but nothing is working so far. http://codepen.io/mcorby17/pen/vKGPmQ
*mouse not move
@mcorby17 :hover in CSS
@Zerazera yeah I tried that
@mcorby17 at the top of your css just declare a reset a { text-decoration: none; }
like this?
reset a {
text-decoration: none;
}
@mcorby17 take the reset word away
hmmm the underlines are still there
Ok I put !important with the reset and it worked. thank you again! @jdtdesigns
mcorby17 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 520 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
hi
have a problem with the tribute page
my image wont display
<img src="file:///Users/Iskender_Mokenov/Downloads/kevin.jpg" alt="Kevin Systrom">
<img src="file:///Users/Iskender_Mokenov/Downloads/kevin.jpg" alt="Kevin Systrom”>
make sure the "src" is correct
@ismokenov are you making this on your local machine or codepen
@ismokenov also I think file should be replace by drive name if using locally
hi all
https://codepen.io/wokSiHD/pen/vKGqvw
I have a CSS animation here, for sliding in from right.
but somehow it pushes the whole side to the left, until the animation finishes
and i cant figure out why xd
can i get some help?
:)
(I marked the problematic part with red border)
@woksihd I can't exactly replicate what you are seeing
is that the only div thats the problem?
@woksihd same. I'm unclear what the problem is.
uhm
what happens
is before u scroll to trigger the animation
the whole page is scrollable to the right side
theres a gap
when u scroll down to the "Case 02" the whole div starts to animate in
@woksihd do you mean WHILE the animation is happening?
yeah
and before it occures too
@woksihd add
overflow-x: hidden; to the body declaration
This message was deleted
@hiltydiggs thx :D
woksihd sends brownie points to @hiltydiggs :sparkles: :thumbsup: :sparkles:
:cookie: 539 | @hiltydiggs |http://www.freecodecamp.com/hiltydiggs
@hiltydiggs @woksihd Preferable to be the outermost element of the section (try not to use it on the body)
this solved :smile:
im gonna check if i add that to only the parent
@woksihd Yeah because you won't be able to scroll, adding to the body produces all sorts of problems
i added to the section
it looks okay now
@woksihd nice. Yeah it's probably best as @JonKaric said to have it on the offending section instead. Always best to address the root of the problem rather than force it somewhere else. Good call.
@hiltydiggs @JonKaric yep :P added to the section, and now its perfect. thx guys :D i were like tryin to make it work for 2-3 hours now :P
woksihd sends brownie points to @hiltydiggs and @jonkaric :sparkles: :thumbsup: :sparkles:
:warning: woksihd already gave hiltydiggs points
:cookie: 93 | @jonkaric |http://www.freecodecamp.com/jonkaric
@woksihd @JonKaric thanks
hiltydiggs sends brownie points to @woksihd and @jonkaric :sparkles: :thumbsup: :sparkles:
:cookie: 94 | @jonkaric |http://www.freecodecamp.com/jonkaric
:cookie: 120 | @woksihd |http://www.freecodecamp.com/woksihd
@mcorby17 I've been offline. You can see the new version here: https://codepen.io/KoniKodes/pen/xOOaLm - issues with the 2nd api for the user button.
@ismokenov You are calling your images from your computer file. It needs to be from a hosted (https://) page. Google to find a secure image hosting site.
Lo
Good Morning. How are you?
@KoniKodes @ismokenov you can use local images.
@KoniKodes @ismokenov if you're developing locally. Not in codepen or anything.
@hiltydiggs really? Right, if I preview from my editor or on my own website then no problem. But with codepen I had to find a secure image hosting (free) so that I could pull in my images.
Beach time. Have a good day, everyone!
@hiltydiggs Enjoy
Happy Dad's day to all the papas out there.
quick question for any pomodoro clock challenge gurus, I've left the challenge and come back to it..and now I don't like my original approach! I was using setInterval to run a function to manually subtract the time every second. Do you know of a better method I could look at for counting down, did anyone use an API?
i am hoping if someone can help with the alignment of devicon icons......im struggling to align them center of the page and the text to go along with it.....any help is really appreciated...........http://codepen.io/vvang044/pen/EyVKaW
i know i am not doing something right......
only frustration comes not the logic to resolve
anyone ?
can anyone help please? http://codepen.io/max77p/pen/EygwRx
each search result should be enclosed in a border line, but the sides are cut off
can't figure out what i am doing wrong here
@vvang044
a few things: to center your icons, wrap them all in one div (ex. id="icons") and then select icons in the CSS (#icons) and do text-align: center;
also, you are using bootstrap columns but haven't added bootstrap in the settings of codepen
lastly, i wouldn't recommend mixing inline styles with the external CSS
pick one or the other
you can do it!
@max77p Hi I've just had a look, the problem is your text is outside the boxes
there's nothing betwwen the borders, so they look like only top and bottom borders..
try adding padding:50px; to para1 after doing a search to see what I mean @max77p
@jdpunk1 ohhh ic, so i did this, but i am getting a white box above the actual texts
feel like i am doing something wrong in my jquery when appending
@jdpunk1 http://codepen.io/max77p/pen/EygwRx
yes the text is rendering between the boxes @max77p
@jdpunk1 is it my jquery?
Yes, I think so
@jdpunk1 help? lol can't figure out if i should be using append or not
I used append when I built mine- it worked fine.. I'm just having a look again
@max77p you should be appending the text to a new instance of para1
as it is it's writing straight to myDIV
so var para1 = para.append(text)?
something like that, then append the para1 to mydiv?
@jdpunk1 http://codepen.io/max77p/pen/EygwRx
figured this out
but now the link....should i not have the href for the p inside?
at the moment you're appending a para, then the title then the text.. if you put the s and t vars inside the para var it chould all nest correctly and you only need append para to myDiv? @max77p
@jdpunk1 yes perfect. thanks! that works, now the link part lol
max77p sends brownie points to @jdpunk1 :sparkles: :thumbsup: :sparkles:
:cookie: 325 | @jdpunk1 |http://www.freecodecamp.com/jdpunk1
yeah, that's right..
Anyone out there who's completed the pomodoro clock task?
@jdpunk1 hey any idea on the href part?
@max77p one sec...
ok thanks
is it within an <a> element, don't see that in your code.. @max77p
should be <a href="yadayada"></a>
i put it inside the var para in jquery...but i didnt add the a tag
is there way i can include it inside para or do i need to do it separately?
What did you guys work on after finishing your front end cert. Did you jump right into the data vis?
@max77p I think seperately then nest it somewhere in the append
@jaredabel i jumped to backedn
@jdpunk1 so i created it and added appended p element to it, which creates link to each respective search result...but i can only redirect if i click on the actual words in the search result
end
but it's up to you @jaredabel
so would using .hover to target the entire box area of each search result be the right way to do it?
so you can even click on the white area?
@jdpunk1 oh nvm i got it! the click function needed to be updated to reference the new class...and you can keep the href link inside the p tag. thanks for the help though!
max77p sends brownie points to @jdpunk1 :sparkles: :thumbsup: :sparkles:
:warning: max77p already gave jdpunk1 points
cool, well done, it can get overly confusing nesting stuff in jquery, sometimes it's good to build a test element with links etc live on a codepen fork, so you can see what's going on- now if you'll excuse me I'm going to tune out and watch the footy!
Hi guys I'm doing the pomodoro project and having an issue with increment and decrement control display. Basically I want the user to ONLY control the time display when the timer is paused(stopped) but instead what happens is the timer display can be controlled no matter if the timer is running or stopped.
I've tried to return the function updateDisplay() to stop it when status is 2(when timer is running). but it still doesn't work.
Anybody have experience with Materialize?
I'm trying to use their "card-reveal" function (http://materializecss.com/cards.html#reveal)
I can get it to work in this test: http://codepen.io/AbdiViklas/pen/oLzoYe?editors=1000
... but not when I implement it in my actual project: https://codepen.io/AbdiViklas/pen/EygmWq
Guys for the "build a Tribute Page" project. Am i remaking the same page but with my own resources to fill it? or can i make a tribute of someone else but same format?
@GalactikJ You can do pretty much whatever you want :)
As long as it meets the requirements of the user stories
I just finished my wikipedia viewer project. Looking to get some feedback! http://codepen.io/qckpckt/full/BzNxEb/
One thing I have noticed is that the random button only works if you click exactly on the symbol. Anyone know why or what I can do to change that?
@qckpckt Tyvm, I'm rather new but i checked out your wikipedia viewer and its great man! Good job as for changing the button to make it work the way you want it I wouldn't know.
no prob :) thanks for the feedback
@jdpunk1 haha fellow footy fan! on side note as well...pogba is soo good,
Hi hi :)
I'm having troubles with CSS:
<div class="row pageThree" id="portfolio">
<img id="img1">
</div>
I'd like to change .pageThree's background color when hovering over its child element #img1. I tried
img3:hover + p {
background:black;}
without any luck :(
Woops, meant to write '#img1:hover + p {...}
Hey guys...some improvements here. Any suggestions on why there seems to be an extra row added that is offsetting my online vs offline coloring:
hey, can someone explain me
html += "<img src = '" + val.imageLink + "'>"i dont understand why does there need to have these + signs and both " and '
What goes in the parentheses of the .remover() function in jQuery?
@urketadic
var name = "bbbbb";
html = html + "aaaaaaaaaaaaaaa" + name + "ccccccccccc";do u understand this ??
is a string contatenation..."a" + "b" +"c".. will give u "abc"
can someone help me please.
what did I do wrong why the offline things are showing with an bullet
That's correct, @moigithub
string concatenation means that each of the string variables a, b, and c are "strung" together.
@andreas2249 i know............ was trying to explain to @urketadic :+1:
Sorry, @moigithub. Just logged in. 200 messages are above yours that I didn't read. :)
:smile:
@RoniqueRicketts where do u wanna append ur elements... to #offlineChan or #offline ???
or
<ol id='offlineChan'></ol> <<----- to me.. looks like should be thisor
<a href="#offline"
@moigithub checking
@moigithub omg thanks. idk how to get the image for each channel
roniquericketts sends brownie points to @moigithub :sparkles: :thumbsup: :sparkles:
:star2: 1477 | @moigithub |http://www.freecodecamp.com/moigithub
hi everyone
I am at build personal portfolio project
struggling with the header to get it right
can anyone help me please
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<!-- main container -->
<container>
<!-- header -->
<header class="page-header">
<div class="container">
<ul class="nav nav-pills pull-right">
<li><a href="#"> about </a></li>
<li><a href="#"> portfolio </a></li>
<li><a href="#"> contact </a></li>
</ul>
<h2 class="brand"> Jamil Akhtar </h2>
</div>
</header>
<!-- header -->
</container>
<!-- main container -->
</body>
</html>
I want a full width header but brand and nav to have left and right padding respectively
I can use css rules to apply padding to these elements
but just wondering if there is something I can do with bootstrap alone
thanks
@RoniqueRicketts there r 2 links.. u need to use (2 getJSON nested calls )
https://api.twitch.tv/kraken/streams/freecodecamp
https://api.twitch.tv/kraken/channels/freecodecamp
https://api.twitch.tv/kraken/streams/freecodecamp
https://api.twitch.tv/kraken/channels/freecodecamp
thanks
how will i add a second one now
@frontender007 there are NO <container> element .. but a bootstrap CLASS named container... <div class="container">...</div>
and also a class
if u wanna make a navbar... easier way is to copy paste the code from bootstrap page and modify at ur will :)
http://getbootstrap.com/components/#callout-navbar-role (thats what i do.. soo many things hard to remember :P )
and also a class
container-fluidif u wanna make a navbar... easier way is to copy paste the code from bootstrap page and modify at ur will :)
http://getbootstrap.com/components/#callout-navbar-role (thats what i do.. soo many things hard to remember :P )
Guys need help here: http://codepen.io/mav1283/pen/ezdWKw
i get the 304 not modified also my results div not showing, i'm not trying to output the data at the moment but i'm using console.log for the data, i'm trying to toggle the results div on button click but it isn't showing
thanks @moigithub
frontender007 sends brownie points to @moigithub :sparkles: :thumbsup: :sparkles:
:star2: 1478 | @moigithub |http://www.freecodecamp.com/moigithub
@mav1283 i dont see any javascript code.... to get data...
i see an html with some hardcoded results...
also .. i see a this css.. related to the result html part
#results-container{
....
display:none !important;
}sooooooo many classes.. wonder if u using em....
if not.. probably would be easier.. if u delete all..start from scratch :D
as i'm saying i'm not trying to output the result at the moment, i'm using toggle to show hide the results container on a click of the button, i'm using console.log to check the data
$("#search-me").click(function(){
$("#results-container").toggleClass("active");
console.log("click");
});
results-container with an active class should show up
results-container.active{
display:block;
well.. !important keyword have a HIGHER specificity thats why it doesnt work....
@mav1283 rather than hide() and show() results and placeholders - you can simply add html blocks (using js) when you get the data.