Hello guys, i searched on internet and i can't find the way to put Berry Chuck picture under Huey Lewis picture please
https://codepen.io/Atalaa/pen/ezpgzM?editors=1100
https://codepen.io/Atalaa/pen/ezpgzM?editors=1100
sorry which pictures are you trying to align?
if you are talking about the first picture not lining up with whats below it, I would use offest columns. you can find it in the bootstrap documentation it allows you to basically create fake columns for positioning .
if they are all in the same column you could add margins or padding to the img by asigning it an ID
its ok bro i forget on closing div element
thank u anyways
np
How do I put these three buttons in the same row using bootstrap grid system
@miciah123 you already have- change md to xs if you want them to always stay in the same row
How come changing the size from md to xs made it work@GregatGit
?
@miciah123 the grid system has default values - so if your screen is lg - because there is not lg set it defaults to md - which you set
@GregatGit thanks
miciah123 sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 573 | @gregatgit |http://www.freecodecamp.com/gregatgit
@miciah123 but because the smallest setting you put was md - when the screen got smaller than md it has a default setting of col-xs-12 which kicked in
@miciah123 because you're using code pen - cut and paste everything in the styles tag into the css tab
if you want to add any librarys or js using the setting button
my screen goes white when I doe that @GregatGit
all the html is wrapped in the body tag
remove style
tags
Oh okay that worked @GregatGit
thanks
@GregatGit
:+1:
Why does the computer start making such weird noises?
hey guys can anyone help me figure out how to make this responsive??
http://codepen.io/tadake/pen/gMadEz
http://codepen.io/tadake/pen/gMadEz
@aryandua because you have an interval that plays the sound over and over every 300th of a second
thanks @jdtdesigns !
tadake sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 454 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
welcome ;)
@aryandua - probably the
setInterval timer that you use is just repeating - it will never stop until you clear the interval timer.
hey y'all I've got a few (maybe dumb) questions.. I'm working on the "Random Quote Generator" project. I've finally got my API to work!!! yeheyy!! but now I'm trying to clean up my messy code
first is a jQuery question.. why doesn't this call back the function when I click my button?
$(".newQuoteBtn").on("click", pullUpQuote());
why not use .click? it should do the job your wanting. heres the docs https://api.jquery.com/click/ @aidansven
@tadake ah wow thanks! I didn't know that shortcut existed :) :) pleasant surprise haha!
aidansven sends brownie points to @tadake :sparkles: :thumbsup: :sparkles:
:cookie: 399 | @tadake |http://www.freecodecamp.com/tadake
@aidansven it's fine to use .on(). Just call it like this instead .on('click', pullUpQuote);
welcome @aidansven
no parentheses after the function call
$(".newQuoteBtn").click(pullUpQuote);
ah ok ok
http://stackoverflow.com/questions/9122078/difference-between-onclick-vs-click <-- Reasons to use .on()
I dont know why the Berry Chuk caption is a link target to youtube please help
ah awesome thanks
your missing a </a> tag @Atalaa
@tadake where please
looks like its after where you added the youtube link. @Atalaa
yeah at the end of line 80
@tadake oh great ! Thank you
atalaa sends brownie points to @tadake :sparkles: :thumbsup: :sparkles:
:cookie: 400 | @tadake |http://www.freecodecamp.com/tadake
@tadake do you know how to set the automatic indentation ?
Thanks to you too @jdtdesigns !!
now my other question is about the function itself
function pullUpQuote() {
$.ajax({
url: 'https://andruxnet-random-famous-quotes.p.mashape.com/?cat=famous',
type: 'GET',
data: {},
dataType: 'json',
success: function(data) {
document.getElementById("quoteText").innerHTML = data.quote;
document.getElementById("quoteAuthor").innerHTML = data.author;
},
error: function(err) {
alert(err);
},
beforeSend: function(xhr) {
xhr.setRequestHeader("X-Mashape-Authorization", "bDEv0VpVECmshUX66t2sGsVFSWu9p1056UNjsnQJsAJeqaqksI");
}
});
}aidansven sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 455 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
your welcome !! @Atalaa back to the future is the best! keep up the good work! :+1:
do I have to call all of that every time I want to pull a new quote?
hmm im note sure @Atalaa
this is the code that I found from Mashape, to use the API
@aidansven to pull a single random quote, yes
@tadake yes its my favorite movie im glad that you approve hahah
you can pull like 50 quotes and store them in an array and use that as your api for the app
@aidansven
1.21 gigawatts !!!! @Atalaa
@tadake wow its heavy !
@jdtdesigns ok great thanks. so just to verify-- when I'm using the .click(function), all that code needs to be run again with every click?
aidansven sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: aidansven already gave jdtdesigns points
ohhhh! Is that better to store the quotes in an array?
@aidansven it depends on how much the api lets you pull data
if it limits you to a certain amout of queries then storing the quotes on one click and them using the array for getting a random one is a better idea
ahh ok ok .. makes sense :D
so basically when the app loads, you get a bunch of quotes from the api and store them in an array, then just use your click function to pull a random one from the array. ;)
fortunately (as far as I know) this API doesn't have a limit
usually not
and if they do it's way higher than we'll be using :P
haha true ;)
there's my project so far.. the twitter button isn't working yet
but the quotes are ;)
I was thinking I want to get the twitter and facebook buttons closer together, but they are where the bootstrap columns automatically put them
@aidansven that's what BS is
a strict prototyping framework
it's not great for custom design
ah ok ok , so float:left might be better?
never float lol
float is so 2000
ohh... haha
display: flex on the parent of the buttons
ah is that using flexbox then?
yes
i can do 10 things that make things fall beside each other
and all never use floats :P
Hi guys, can you help me with the Arguments Optional bonfire? I don't know how to do the single argument part.
ok ok I will read on that..lol excited to learn this now! thanks @jdtdesigns
aidansven sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: aidansven already gave jdtdesigns points
@leanhduy1998 can you post the function?
@jdtdesigns you mean my code?
yes
function addTogether(first, second) {
/*
function sumTwoAnd(num){
return number+num;
}
if(addTogether.length==1){
return sumTwoAnd()
var number=addTogether(argument[0]);
}
*/
if(typeof first=="number"&& typeof second=="number"){
return first+second;
}
else{
return undefined;
}
}
addTogether(2,3);
the thing in the comment part I was just trying thing around
hmm
is it just asking you to add the 2 arguments?
ah, i just looked it up
so if the second argument is a function call (2)(3), you have to return a function that adds the first argument with the argument that's passed into your returning function
@leanhduy1998 a little tricky, but it's straightforward
return function(arg) {// some code that you can figure out :P };
Hey guys , do you have any clue how I would pass a var say "weather" into the URL in the $.getJSON?
@jdtdesigns if you do it like that, a function call (2)(3) will work right?
to be honest, it's the first time I see this form
i know in ruby something related to that would be www.stuff.com?#{weather}
@needsMoreCoffee $.getJSON('http://api.com/' + weather, function() {});
This message was deleted
@leanhduy1998 it's weird because we're so used to returning a value and not a function
i think i finished my twitch streamer! but i want to add buttons to categorize the streams. http://codepen.io/pawan92/full/ezpjgM/
but it's the same concept
@jdtdesigns had a duh moment thanks!
needsmorecoffee sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 456 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
@jdtdesigns I see. Thank you!
leanhduy1998 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 457 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
```js
function smallestCommons(arr) {
var num=0;
var i;
var j;
var args = Array.prototype.slice.call(arguments[0]);
var args1=args[0];
var args2=args[1];
while ( i!== j);{//While Args1 doesnt equal args2
for( i=args1;;i++){ //increment args1 by itself
for( j=args2;;j++){ //ditto
}
num=i;//This should be where the while loop has stopped so num == i where i = j
break;
}
}
return num;
}
smallestCommons([2,7]);
@123xylem I ended up creating a function that returns the greatest common and then using that to get the least common
@jdtdesigns interesting... that maybe a better way.. Any idea why my loops arent changing value of num?
@123xylem Your while loop doesn't do anything
Plus you break out of it after one iteration
I thought it says while theyre not equal let them ++ eachother
@123xylem can you explain to me why are you doing this : var args = Array.prototype.slice.call(arguments[0]); ?
@mizujin so i can work with both arguments
individually
@123xylem Your sole argument is already an array though
there's no need really, you can pick array indexes
@123xylem they give you an array
o yea ><
arr[0] arr[1] :P
So what is my while loop doing wrong then? Ive moved break down a bracket
@123xylem tbh, i don't know what those loops are supposed to do lol
the loops just say args1 ++ which should be EG 2+2+2+2+2
So the forloops run through the multiples of arg1 and 2 and when they match the while loop is complete
for ( var i = 0; i < arr[0]; i++ ) { arr[0] += arr[0]; }?
@123xylem I would suggest looking at a different approach .There are two main ways to get the least common multiple, using GCD or prime factorization. I suggest GCD, since it's easy to understand and implement.
hello! for the quote machine project did you guys use a quote api?
@123xylem what @Zerazera said. I tried multiple routes and the gcm was the easiest
@disofu234 yes
which one?
@disofu234 Hello ! yes I did, but many people hardcode them with arrays
guys I have a little question about jquery that I havent been able to solve myself
for a lot of the ones i found you have to pay
@disofu234 http://www.icndb.com/api/
@disofu234 this one is free http://startupquote.com/api/read/json
quoteondesign.com
and so forth :P
@disofu234 There are a few you don't have to pay for. Try forismatic, or advice slip. I think there's a Chuck Norris one too.
While on the subject, has anyone tried to use CodePen Pro to host a JSON object on their pens?
@Benmhz are you trying to create a database with the json?
function smallestCommons(arr) {
var num=0;
var i;
var j;
while ( arr[0]!== arr[1]){//While Args1 doesnt equal args2
for( i=arr[0];;i++){ i+=i;//increment args1 by itself and add it to args1 value
for( j=arr[1];;j++){ j+=j; //ditto
num=i;} //This should be where the while loop has stopped so num == i where i = j
}break; // Not sure why i have this.. trying to break loop
}
return num;
}
smallestCommons([2,7]);
I dont get what its missing tho
It says while i!=j increment i and j by itself (multiples) until they are equal...
@123xylem quite a lot lol
Yes. @jdtdesigns Right now I'm trying to figure out what the JSON were teaching by reading up the MDN refs, but I wanted to try to write my own JSON files and post them in CodePen's asset serv.
I have a dynamically added element with a button to exit that element
the thing is that to target that element i need to look up for the closest element and then search down
then thing is when i want to access
the thing is that to target that element i need to look up for the closest element and then search down
$("body").on("click", ".theDivToClose button", call back);then thing is when i want to access
this it just don't select the element so I cant do this $(this).parent() or $(this).closest("div") mby im doing something wrong?
Thank you so much guys
@123xylem Take a look at Euclid's algorithm. https://en.wikipedia.org/wiki/Greatest_common_divisor It can be programmed very succintly if you use recursion.
@Benmhz firebase.google.com is way better for cloud database storage
@Zerazera recursion lol. don't overload the poor guy :P
@Zerazera Man im sure theres a better way but I really Want to know Why this wont work as it looks to me like it works... I dont see whats missing even though its just simple for loops
while someting not true.. make multiples
when both multiples are equal
return the value
@jdtdesigns It can be a bit overwhelming, but I actually think the recursive solution to this is easier to understand than the iterative solution
anyone knows why?
Cool, thanks @jdtdesigns, I'll save this for later. I'm just trying to handcode this stuff so I can get my feet wet and brain wrapped around what's happening between the page and the JSON obj.
benmhz sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 458 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
@trip16661 add the element and then use a callback after you add it to set up the listener
I'm still on the Quote Page challange.
@123xylem Your code is incrementing both at the same time. Frankly it's not that great an approach. Let's take 2 and 3, for example. You would be comparing 2 and 3, and 4 and 6, and 6 and 9, etc. when the lcd is 6
@Benmhz I actually did that awhile back, which is why i knew what you were doing lol
@jdtdesigns what do you mean? sorry im dumb xD
i used a free json storage api though that's pretty crap
@Zerazera yea i realised its not i++ its i+i
but I see what ur saying
if i gets to 15 before j will it skip to the next number
15 being the lowest shared multiple
@123xylem Which is why you should just use the GCD method
$('#parent').append(
'<div id="main">' +
'<h1>Title</h1>' +
'<button id="exit">Exit</button>' +
'</div>');
$('#exit').on('click', exit);
function exit() {
$('#main').hide();
}
@trip16661
@jdtdesigns that wont work
@trip16661 .......
because it's a dinamically added element you need to do a search up first
@trip16661 are you adding the element from js?
y
then that will work bro
make sure you set the listener up after you append the element
so when you try to access it it will just wont read it because its not initialized
when the page loaded
look above
$(".dashboard").on("click", ".city-wraper button", (e) => {
var id = $(this).attr("class");
console.log(id);
});
i appended, then set the listener
@trip16661 you have to think in order of what you are doing
you can't set listeners on elements that aren't there yet
you have to set up the order by which things happen when you add code to the DOM
I have a function that create divs with class city-wrapper and inside of that it has a city and a button
ok
so even if i do the way you do
the js wont know the dom element is there
@trip16661 post your code
since its not initialized when the page loads
it's not about page load
it's about order
const displayWeather = (weather) => {
let div = document.createElement('div')
const thisId = weather.weatherdata.location.name;
const country = weather.weatherdata.location.country;
let thisDiv = `#${thisId}`
console.log(weather.weatherdata);
weather = weather.weatherdata.forecast.time;
$(div).addClass("city-wraper")
.attr("id", thisId)
.appendTo(".dashboard");
$(thisDiv).append(
$("<div/>").addClass("city"),
$("<button/>")
.text("X")
);
$(thisDiv + " .city").append(
$("<div/>").addClass("weather-icon")
.html('<img src="http://megaicons.net/static/img/icons_sizes/8/178/256/weather-sun-icon.png">'),
$("<div/>").addClass("city-name days")
.html(`<h2>${thisId}, ${country}</h2>
<h1>${Math.floor(weather[0].temperature["@day"])}</h1>`)
)
for (let i = 1, leng = weather.length; i < leng; i++) {
$(thisDiv + " .city").append(
$("<div/>").addClass("days")
.html(`<h3>${weekDay(weather[i]["@day"])}</h3>` +
`<h2>${Math.floor(weather[i].temperature["@day"])}</h2>`)
);
}
}
@trip16661 after the for loop, add the function that sets the listener
pretty standard order of operations ;)
you mean inside of the function? :D
let me check xD
for ( blah blah) {
// blah blah
}
setListener();
}
yes
@jdtdesigns still says undefined xD
$(".close").on("click", (e) => {
var id = $(this).attr("class");
$(this).closest("div").hide();
console.log(id);
});
Can anyone tell me how to style the contents of a Bootstrap menu after it drops down?
Not a dropdown menu per se, but the mobile toggle menu contents
I've got my navbar links positioned to the right side, but when in a viewport size that changes them to a button, they drop down on the left side of the page
the element to close responds but not really on $(this)
hey guys im trying to style a buttons color. ive done this a million times so i must be overlooking someting small
why is this
#red{
color:#f44336;
}not styling this
<div class='col-xs-6'>
<button id='red' class='btn'></button>
</div>
@tadake at a guess that wil only effect any text you write within the button tags
@tadake try
#red{
background-color:#f44336;
}
else
#red{
background-color:#f44336 !important;
}
ahhhhhhhhhhhh ok ! i totally forgot about that ! thanks @mutantspore @trip16661
tadake sends brownie points to @mutantspore and @trip16661 :sparkles: :thumbsup: :sparkles:
:cookie: 382 | @trip16661 |http://www.freecodecamp.com/trip16661
:star2: 1727 | @mutantspore |http://www.freecodecamp.com/mutantspore
@trip16661 have you looked at the console?
it threw 10 errors even with es6 turned on
@jdtdesigns y i tried to do this as well
$(".close").on("click", (e) => {
var id = $(this);
console.log($(this).parent(".city-wraper").attr("class"));
$(this).hide();
console.log(id.attr("class"));
});
and both return undefined
@jdtdesigns well its because the code is more than what i sent xD
I can show you a es5 way for sure lol
go ahead there is no much difference
@trip16661 If you look, you're missing semi-colons
where?
oh yeah
i missed two
i want to put a responsive embed ender Bloopers, but it doesnt show, please someone?
@jdtdesigns I trully have no idea of whats going on because the button itself works and worked outside of the function but in both cases
$(this) is not working or returning the element itself
so i cant do $(this).closest(".parent")
or $(this).parent(".parent")
in fact not even $(this).hide()
which means that what im getting in this is not exactly the item itself
in fact not even $(this).hide()
which means that what im getting in this is not exactly the item itself
I wish i knew how the object that i return with log($(this)) work like so i could know what the f im getting on $(this)
okay...
this doesnt make any sense at all
it works removing the arrow function ahaha
I have no idea of whats going on xD
@Atalaa the bloopers works, you click bloopers the video appears looks good, btw if you move the code to the sides, you can see how the page looks on different screens
yeah because i fix it, i made a mistake i put directlythe youtube link instead of embed link hahah
@tuliodnw thnak u
@tuliodnw thank u
atalaa sends brownie points to @tuliodnw :sparkles: :thumbsup: :sparkles:
:cookie: 381 | @tuliodnw |http://www.freecodecamp.com/tuliodnw
@tuliodnw http://jsbin.com/maxuse/edit?js,output
basic process of how i would do it
Can anyone explain why the bottom of my page is acting up? I'm missing a logo on the top because I didn't hotlink the image, I was coding natively on atom.io
@jdtdesigns what am i looking here?, i didnt post any project
@trip16661 http://jsbin.com/maxuse/edit?js,output
@tuliodnw sorry, wrong person lol
Hello everyone. I'm having a bit of trouble with Bootstrap. The issue is with getting my content to not overlap or "push" each other. I understand the grid system can help me, but after watching several youtube videos I don't understand how to position with bootstrap.
can anyone tell me how to add a online,offline,NA filter? i can create the buttons but im not sure about the logic. http://codepen.io/pawan92/pen/ezpjgM
@jdtdesigns y i just found out that was the arrow function that was screwing and changing the value of this therefore it was never the element but something else (which im not sure what it is)
hey anyone have any suggestions on how I can get the project images to center ont he page ? http://codepen.io/BZanZ/full/OXyyMN/
Hello everyone. I'm having a bit of trouble with Bootstrap. The issue is with getting my content to not overlap or "push" each other. I understand the grid system can help me, but after watching several youtube videos I don't understand how to position with bootstrap.
@dismister Position with bootstrap is pretty much done using the grid system http://www.tutorialrepublic.com/twitter-bootstrap-tutorial/bootstrap-grid-system.php
@jdtdesigns it was giving back an object, it wasn't because the event handler was outside of the function that creates dinamically add divs but
@Zerazera This is exactly the detailed tutorial I was looking for thank you!
:cookie: 460 | @zerazera |http://www.freecodecamp.com/zerazera
dismister sends brownie points to @zerazera :sparkles: :thumbsup: :sparkles:
it was all because the arrow function, i will try to post that on stack to see why would that be
and if there is a ES6 walk around
@jdtdesigns really thanks btw without you suggesting about ES5 i wouldnt have tried xD
trip16661 sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 459 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
@trip16661
function Person(){
this.age = 0;
setInterval(() => {
this.age++; // |this| properly refers to the person object
}, 1000);
}
var p = new Person();
welcome ;)
arrow functions scope differently
@trip16661 Arrow notation is really best used for short, simple functions. Think of it as syntactically similar to a lambda.
@Zerazera you mean is a bad practice to use it on bigger functions?
@pawan92 in line 15, of the js change the append for prepend, and you will have online first
hey anyone have any suggestions on how I can get the project images to center ont he page ? Id prefer to have them centered with the project class I created instead of adjusting margins and padding on each one individually
http://codepen.io/BZanZ/full/OXyyMN/
http://codepen.io/BZanZ/full/OXyyMN/
easy fix for that
@trip16661 In general, yes. Arrow notation, like lambdas, is meant for small, anonymous functions.
@pawan92 you added a class the online ones, also add a class to the offline, the you make a button that all it does is, $(".offline").hide(); $(".online").show();
@Zerazera in that case it would be perfectly fine to use it on an event handler
and Vice versa
but in this case it didn't work as usual
@trip16661 Right, except for the scoping issue.
@tuliodnw thanks! that puts the NA first, online, then all the offline
pawan92 sends brownie points to @tuliodnw :sparkles: :thumbsup: :sparkles:
:cookie: 382 | @tuliodnw |http://www.freecodecamp.com/tuliodnw
@pawan92 what is NA?
@tuliodnw stream not available for those that are closed
@pawan92 in mine online are first, http://codepen.io/tuliodnw/pen/GqoOyg?editors=0010
@tuliodnw yea i just changed it haha. so if i wanted to add buttons and filter how can i do that
@pawan92 btw on big screen the wallpaper doesnt cover all, and in small screens the margins are too big and the box looks odd
@pawan92 like this
$("#online").click(function online() {
$(".hueco").show();
$(".sacalo").hide();
});
for you hueco would be online, you must make an offline one, also give it to the na,
and #online is the id of the button
@tuliodnw ugh ok ill find a new wallpaper lol. let me try that out
@pawan92 no no, just fit it better,
@pawan92 i used this in the css where the wallpaper is, should fix it
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
using Bootstrap how do I keep a title within a row from being overlapped by a col of content ?
just finished my portfolio ! if anyone would care to check it out I would love some feedback, there is kind of a bug with the nav bar to where it does not float on top of other elements :S
also I used boiler text for the about and i dont have any projects or photos yet so imagine there are beautiful projects pictured :P
Hey can anyone give me a hand
How do I keep my buttons from running into each other and overlapping?
Any tips of making my skills section more appealing? Right now I feel like the headings aren't exactly centered right compared to the Icons. https://codepen.io/sanchit13/pen/yJYKbP
@sanchit13 i would make it much smaller, its not really a focual point, just something saying hey, i know these
I see, do you have any advice on getting the text's midpoint to be the same midpoint as that of the icons? it looks like the text is slightly offcenter compareed to the icons @bscyrpt
say the div is height:30px; set your line-height:30px; and text will center in div vertically, then set the icons position:relative; then nudge up/down with top:+/-px
@Rouque to make your buttons not overlap you need to not have them as float elements.
@bscyrpt How would I go about that?
How do I get my port class to go down? i'm trying to reposition with bootstrap
@Rouque instead of col-sm-1 as the class make a new class and put in
.cssclass{
display:inline-block;
margin-left:somenumber;
}should make the elements flow inline and you can space them apart with the margin-left.
somenumber should be px yes?
like 30px
yea
So @bscyrpt How do I get my little box moved down away from the header?
you mean the text and image?
you need to add margin-top:000px; to the container they are in
No I mean with the green header
and the Text block
Any ideas?
Hey folks! Hope your evening/day/morning is treating you well!
@Rouque the text ?
I have a mysterious few <br> tags showing up before my header (when I inspect the output in Firefox I see them) but they aren't in the CodePen code. Any idea where they are coming from and how to get rid of them?
Is there a way to get say a .col-md-4 css block to display it's content differently than .col-sm-12 if an element has both classes applied to it? Like I want the same content to be positioned differently when it's on a wide screen and on a phone
@kirbyedy Yeah where I say "My name Is Nic" the box around that is touching the green header. How do I separate them
@sanchit13 Depending on what the inner content is, you can either nest columns inside to position, or use absolute/relative positioning with percents
@Rouque where your div row is, and a class named 'about' for example, and than add margin-top to that about class
add a class named about?
Okay
yes
could be anything... I just made that up
margin top or padding top?
and then target that class
margin-top
mmmm that didn't work.
Also worth mentioning the menu doesn't work on mobile. For some reason I can't click the button to expand and show all of the menu's content if it's collapsed.
oh I added it to the wrong div class="Row"
the second row :)
btw in the codepen setting add jquery and bootstrap with quick add but in the javascript section
How do I keep my elements from smushing together?
If I change the page size it mashes everything together.
that is exactly why I told you to add that things
jquery and bootstrap
I'm having trouble moving my description to be even with my picture can someone help please? http://codepen.io/dismister/pen/xVBOKa
@dismister can you explain me what is this ?
col.xs.12
first time I see it...
@kirbyedy omg that's where I messed up no wonder it wasn't working
its suppose to be - not .
lol
thank you @kirbyedy
dismister sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1090 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
:)
@dismister also in the codepen setting add jquery and bootstrap in that order
in the javascript section
hmm I fixed the code but my text is still not in line with my picture
@dismister you mean like this ?
@dismister check out the vertical-align css property
@kirbyedy yes
@jarenescueta731 Thank you
:cookie: 285 | @jarenescueta731 |http://www.freecodecamp.com/jarenescueta731
dismister sends brownie points to @jarenescueta731 :sparkles: :thumbsup: :sparkles:
not sure how good are you with flexbox, that is the easiest way
also if you have time it would be good to learn it
Thank you @kirbyedy I will watch it now.
dismister sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:warning: dismister already gave kirbyedy points
Guys I want to append the numbers in the screen in pure JS
need help
function append()
so i've been stuck for almost a week on the wikipedia viewer project, my attempts to debug using .html() are inconclusive. i can't tell if my program is getting the value from the input field at all, i'm pretty sure the .getJSON() parameter is correct. the problem is that i don't know what happens when i click my Search button because nothing happens, except clearing the input field. http://codepen.io/jarenescueta/pen/VjLvgm
@Whiplash5057 i haven't reached that project yet, but have you looked at the .append() method of jQuery?
@jarenescueta731 I'm actually trying to do this project using js only...hehe...!! Want to learn
hence no jQuery
well it's a library of js, but i see what you mean i guess
@Whiplash5057 or a set of js libraries rather
@jarenescueta731 its because the search btn is submiting the <form>. try to prevent this default behavior
@sorinr oh ok, thanks
jarenescueta731 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 354 | @sorinr |http://www.freecodecamp.com/sorinr
im stupid for not asking help sooner
@jarenescueta731 welcome
Would anyone mind checking out my Simon game and giving constructive criticism? https://codepen.io/fourbits/full/rLxYPr/
I've set it to let you win if you get to 10 so it can be tested faster.
@Fourbits that's awesome! i haven't reached this project yet, what's the strict button for?
@jarenescueta731 If it's not in strict mode, when you press the wrong button, it will repeat the pattern and let you try again.
If it's in strict mode, you will lose and have to restart the game again.
@Whiplash5057 first thing i would do is make the text black, so you can see it. I was trying all sorts of things untill i realised it was white text on a white box lol
@jarenescueta731 gotcha. also, just aesthetic, not important, but it would be cool if the on/off switch moves when you toggle it. that's what i expected it to do at first
@jarenescueta731 It moves for me in Chrome. What browser are you using?
I guess I should check for cross-browser compatibility.
firefox latest version
@ivanvillacreative
OK, I'll see what's wrong. It seems it doesn't move in Edge, either.
I'm not getting the result of the expression'
@ivanvillacreative
This message was deleted
This message was deleted
@Whiplash5057 looking good to me!
@ivanvillacreative I COMPLETED IT....!!! :smile:
thanks @ivanvillacreative
whiplash5057 sends brownie points to @ivanvillacreative :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for ivanvillacreative
Guys check it out ...!!! I'm done!!
@Whiplash5057 Good job!
:smile: thanks
@Fourbits
how to go about twitch tv app
facing problem related to asynchronous nature of api calls
i believe we have to make two api calls
@chethanbhat You need to be able to keep track of which user's information you're querying in your callback function. one way to do that is to put the callback inside a closure:
(function(target) {
return function(data) {
// data == JSON data
// target == the user you are querying
}
})(target)
The data variable is provided by the system, but you need to define the target variable yourself.
the code here will only run if checkWin() returns something, right?
if (checkWin()) {
checkWin();
gameOver = true;
}
if (checkWin()) {
checkWin();
gameOver = true;
}
whoops:
if (checkWin()) {
checkWin();
gameOver = true;
}
or will that only be the case of the function has
return true?
@ctataru True or anything not falsy so any non-zero number, non-empty string, non-empty object, etc
@ctataru Not sure you need to call checkWin() twice.
@ctataru @Fourbits hi guys
can you guys suggest me a best infinte scroll plugin
for large amount of data in case
can you guys suggest me a best infinte scroll plugin
for large amount of data in case
@ctataru @Fourbits hi guys
i was cheking on http://jscroll.com/,https://github.com/cubiq/iscroll and clusterize.js
any suggestion
i was cheking on http://jscroll.com/,https://github.com/cubiq/iscroll and clusterize.js
any suggestion
@sjames1958gm well right now the function just returns a
http://codepen.io/wise/pen/dXbqMK?editors=0010
confirm(). would that count?http://codepen.io/wise/pen/dXbqMK?editors=0010
@ctataru If they click ok then it returns true.
@ctataru So yes
@sjames1958gm ahh right. awesome. thank you
ctataru sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 1507 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
@ctataru :+1:
@sjames1958gm i just don't understand why i get a draw message after my win message, then. if there is a win or loss on the last block (and every block is filled) then it gives me both messages. shouldn't my if/else on line 201 only give me the win message? possibly even twice, seeing as i call it in the function and the code block inside it
Any idea on how i can vertically align the text in the middle column?
https://codepen.io/Steps/pen/Vjemer
https://codepen.io/Steps/pen/Vjemer
@St3ps you can try with flexbox
@kirbyedy does flexbox integrate well with bootstrap?
why not ?
anyone have any ideas?
@kirbyedy hahah... awesome, alright ill try it out. Do i have to do anything special? Like should i follow the instructione here? http://v4-alpha.getbootstrap.com/getting-started/flexbox/
its up to you
I would suggest searching for the flexbox youtube video tutorial, which explains how it works
it will make things more clear
@kirbyedy sweet, i'll check it out, thanks!
st3ps sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1094 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
@ankur1163
can someone tell me
how do i align image
in center
http://screencast.com/t/kaTUcsyWV
.outerbox{
background-color:#EEEEEE;
height:1000px;
border-style: none;
margin:80px;
}
.image{
width:100px;
}
.name{
text-align:center;
color:black;
font-family:arial;
font-size:50px;
}
.edu{
font-size:20px;
}
.blue-text{
color:red;
}
</style>html code
<html lang="en">
<link rel="stylesheet" href="awesome.css">
<div class= "container-fluid">
<div class = "row">
<div class="col-md-2">
</div>
<div class="col-md-8">
<div class="outerbox">
<div class="name">
Kiran Bedi
<div class="edu">
She is the first woman to join the Indian Police Service
</div>
<div class="image">
<img src="kiran bedi.jpg" alt="" />
</div>
</div>
</div>
</div>
<div class="col-md-2">
</div>
</div>
</div>
</div>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
</html>
This message was deleted
I have put image width property to be 100px
then why this image is so big
I'm working on the Random Quote Generator, and trying to add the click to Tweet button. I can't figure out where in the function to pass data.QuoteText and data.QuoteAuthor. Can anyone help me identify that?
var tweet = function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0],
p = /^http:/.test(d.location) ? 'http' : 'https';
if (!d.getElementById(id)) {
js = d.createElement(s);
js.id = id;
js.src = p + '://platform.twitter.com/widgets.js';
fjs.parentNode.insertBefore(js, fjs);
}
}(document, 'script', 'twitter-wjs');
@gerarddawson your code is confusing to me, but here is an easy way to do what you want
@kirbyedy yes, i am having trouble making sense of the Twitter API, so it's confusing to me, too unortunately
well check that code then and try to understand it
@kirbyedy thank you for sharing. this is a much simpler solution.
gerarddawson sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1095 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
I think its pretty straight forward
the wikipedia api is doing my head in
just wanted to put that out there
@jarenescueta731 also I've found putting a console.log(somevalue); in your jquery is invaluably useful in debugging on codepen, there's a console button on the bottom pane- helps keep track of var changes or api data output etc
Hello Everyone,
Please review my quote machine and suggest ways to improve on my work.
https://codepen.io/Zubenna/full/EyPvyz/
Thanks.
hi guys. could anyone explain why
http://codepen.io/wise/pen/dXbqMK?editors=1100
margin: 100px auto isn't aligning the box vertically too?http://codepen.io/wise/pen/dXbqMK?editors=1100
Urgently need help for angularJS. Is my custom service correct?
myApp.service('myLocation',['$resource',function('$resource'){
this.getLocation = function(city){
var location = $resource("http://ipinfo.io",
{ callback: "JSON_CALLBACK" },
{ get: { method: "JSONP" }});
return location.get({city: city })
}
}]);
@ctataru I don't know, maybe because of flexbox. I did try to edit your pen and came with a solution. Wrap everything in a div and give it { display: flex; justify-content: center;}
@jdpunk1 @jarenescueta731 - console.log is very valuable for debugging, and if the CodePen console doesn't show it (it only handles a limited amount of output - I think that they tell you when it cannot handle it) pop up the browser developer tools and the console tab is where you'll find it. You can also use the console to do javascript testing. Firebug (a firefox add-on) has a neat feature in the console to "pretty print" - fix the indentations in your javascript that you enter. That's handy at times. Happy coding!
hey guys, why fontawesome in not working? http://codepen.io/tbuglc/pen/zBvzRM
i dunno, buddy
@khaduch thanks a bunch! :D
ctataru sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1293 | @khaduch |http://www.freecodecamp.com/khaduch
@ctataru Hey, You used my solution so why don't you thank me?
karolinakluz sends brownie points to @ctataru :sparkles: :thumbsup: :sparkles:
:cookie: 323 | @ctataru |http://www.freecodecamp.com/ctataru
@karolinaKluz whoops i had your name wrong
@karolinaKluz i thanked the wrong person.. thanks
ctataru sends brownie points to @karolinakluz :sparkles: :thumbsup: :sparkles:
:cookie: 125 | @karolinakluz |http://www.freecodecamp.com/karolinakluz
Hey everybody! For the calculator can anyone help me figure out how to get the clear button to be on the same line as the results box? http://codepen.io/Twood/pen/NrPQgJ
'''var api = "http://api.openweathermap.org/data/2.5/weather?q=London&units=metric&APPID=95cb066d694049e32c48e0101817e622&callback=JSON_CALLBACK";
$(document).ready(function() {
$.getJSON(api, getTemp);
});
var getTemp = function(data) {
$("#temp").text(data.main.temp);
};'''
:bulb: to format code use backticks! ``` more info
Can anyone help me with getting my weather API set up. Just trying to load the temperature at the moment and this code isn't working
var api = "http://api.openweathermap.org/data/2.5/weather?q=London&units=metric&APPID=95cb066d694049e32c48e0101817e622&callback=JSON_CALLBACK";
$(document).ready(function() {
$.getJSON(api, getTemp);
});
var getTemp = function(data) {
$("#temp").text(data.main.temp);
};
anyone here using vvv to develop wordpress sites? im a little bit confused about my setup
@JamesRiall I changes your url to this and it seemed to work for me
var api = "http://api.openweathermap.org/data/2.5/weather?q=London&units=metric&APPID=95cb066d694049e32c48e0101817e622&callback=";
I just deleted the
JSON_CALLBACK at the end of it
@JamesRiall ^
@Belax8 YES, PROGRESS :D
@Belax8 @jdtdesigns thanks very much both, been banging my head against a wall trying to figure out even the basics of using APIs but i think it's starting to make sense
jamesriall sends brownie points to @belax8 and @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 398 | @belax8 |http://www.freecodecamp.com/belax8
:cookie: 460 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Think building the rest of it now should be relatively straightforwards.
Think I'm finally done with my Random Quote Generator. Thanks everyone for help:
@gerarddawson nice one, looking great :)
hi people
can you recommend a good tutorial/article about API basics?
I want to start coding the Weather App but I have trouble figuring out where to start
and how to proceed ;D
@hea-hea I had exactly the same problem. I found this helpful: https://www.smashingmagazine.com/2012/02/beginners-guide-jquery-based-json-api-clients/
@JamesRiall Thanks, exactly what I was looking for :)
hea-hea sends brownie points to @jamesriall :sparkles: :thumbsup: :sparkles:
:cookie: 299 | @jamesriall |http://www.freecodecamp.com/jamesriall
@hea-hea and also videos from this guy, playlist here: https://www.youtube.com/watch?v=rJaXOFfwGVw&list=PLRqwX-V7Uu6a-SQiI4RtIwuOrLJGnel0r&index=1
cool
its actually not that complicated, it's just that there don't seem to be many good guides on setting up the API call. Once you have the JSON data loaded, it's a simple case of working with the object data
right. and how to access it efficiently, I guess
now I have something to watch over the weekend :D thx again
no probs
@hea-hea this series is pretty good too https://www.youtube.com/watch?v=fEYx8dQr_cQ
@Belax8 thank you :)
hea-hea sends brownie points to @belax8 :sparkles: :thumbsup: :sparkles:
:cookie: 400 | @belax8 |http://www.freecodecamp.com/belax8
Isn't it better to learn Javascript itself instead of jQuery only?
hi guys, do you know how to set it didnt spacing after enter in brackets editor?
@Yannickhj it depends on who you talk to
"JQuery is used by 96.1% of all the websites whose JavaScript library we know. This is 70.3% of all websites." So jQuery is still super important https://w3techs.com/technologies/details/js-jquery/all/all
@Belax8 Guess im talking to all experienced developers here as a student front-end dev
@Belax8 But if you are really good in Javascript you dont need jQuery I guess, and not using it saves space on the website
@Yannickhj Yes, but jQuery also simplifies a lot of things. You can write less code to get things done. Also, if you are using a framework like Bootstrap, you need jQuery on your site anyways, so you might as well take advantage of it if it is there. But every project is different.
@GregatGit @jdtdesigns here is my pen https://codepen.io/mcorby17/pen/xOwBzB?editors=0011 Should I use http://api.openweathermap.org/data/2.5/weather? as the API url then? there's no /json in the call
@Belax8 Hmm yea true, guess it depends on the framework and project etc. Also just saw jQuery 3 is released today and they say its faster etc. https://blog.jquery.com/2016/06/09/jquery-3-0-final-released/
@Yannickhj Cool. I didn't know that. I'll have to check it out.
Hey y'all. I'm currently working on my wiki viewer. Can anyone help me figure out how to move the div containing the text 'made by tonye' to the next line. I want to position it underneath the search/submit area. Here is a link to my project http://codepen.io/tiyalla/pen/XKXegj/
I made my API call to open weather map, and then I printed the stringified results to a div I have on my page, but nothing shows up. Did I make the api call correctly?
https://codepen.io/CameronBurkholder/pen/mEegGq
https://codepen.io/CameronBurkholder/pen/mEegGq
@Cameron-Burkholder i think you might need the "http://" before your api call
@mcorby17 I'll try adding that.
@Cameron-Burkholder I'm stuck on the same thing :/
@tiyalla if you're using bootstrap you could place the elements in rows?
Help on this please, Scroll spy is not working what's wrong http://codepen.io/tbuglc/pen/zBvzRM
no wiki entry for:
on this please scroll spy is not working whats wrong httpcodepeniotbuglcpenzbvzrm
@mcorby17 It still didn't work. At least its good to know someone is suffering through the same thing.
@Cameron-Burkholder lol our suffering bonds us
True. If one of us figures this thing out, he needs to help the other one. @mcorby17
@tbuglc you need to change your
<body> tag to this <body data-spy="scroll" data-target=".navbar"> and then you need to add jquery and bootstrap.js to your pen
@Belax8 : thanks!
tbuglc sends brownie points to @belax8 :sparkles: :thumbsup: :sparkles:
:cookie: 401 | @belax8 |http://www.freecodecamp.com/belax8
it works
@tbuglc awesome!
@jdpunk1 thanks!
tiyalla sends brownie points to @jdpunk1 :sparkles: :thumbsup: :sparkles:
:cookie: 321 | @jdpunk1 |http://www.freecodecamp.com/jdpunk1
Hello. I'm working on my personal portfolio webpage, and I have no clue on what to do in regards to navigating a single page using jquery. Specifically, I have no clue as to how I click on a nav button and move on the screen.
@KevinRiv I think w3schools.com might have something about that under jQuery
I'd look myself but i'm a bit busy at the moment
I'll take a look, thanks for the info. Just feeling overwhelmed by jquery and javascript, so I'm looking for any bit of info I can. Thanks again!
@KevinRiv there is a way to do it without jquery or javascript. Here is an example http://codepen.io/Belax8/pen/NrxBNG
var lat = 0;
var long = 0;
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
lat = position.coords.latitude;
long = position.coords.longitude;
$("#location").html("latitude: " + lat + "<br>longitude: " + long);
});
}
console.log(lat);
console.log(long);
Any idea why lat and long still end up being 0?
@Belax8 Thank you for the reply! Is that just the normal HTML a usage (by just naming the div the same as the a link, it jumps to it?
kevinriv sends brownie points to @belax8 :sparkles: :thumbsup: :sparkles:
:cookie: 402 | @belax8 |http://www.freecodecamp.com/belax8
@pae4557 Because the getCurrentPosition is asynchronous and your console.log's happen before the callback from getCurrentPosition
@KevinRiv Yep I think it only works with IDs. I don't think it works with classes, but I'm not sure. It's a super basic way to do it, but it works if you don't want to get super fancy.
So how do I make it not asynchronous? @sjames1958gm
@Belax8 I definitely don't! Trying to teach myself Javascript to go on top of my HTML/CSS and I was getting overwhelmed by JS and jQuery so I'll try that. Thanks again!
kevinriv sends brownie points to @belax8 :sparkles: :thumbsup: :sparkles:
:warning: kevinriv already gave belax8 points
@KevinRiv anytime!!
@Belax8 I still can't get it to work correctly. At this point, I'm assuming my HTML is all screwy somewhere so it's not gonna work in my current set-up. But thanks for the info.
:warning: kevinriv already gave belax8 points
kevinriv sends brownie points to @belax8 :sparkles: :thumbsup: :sparkles:
@KevinRiv If you share the link, I'll take a look at it and see if I can get it to work.
@Belax8 I'm thinking I've screwed something up in my fight to try and use Bootstrap when I don't really know it as well.
@KevinRiv I think it looks good except that you forgot to link to your About paragraph
@KevinRiv It'll work. You need to add
z-index: 100; to your CSS in your .nav this will make sure your nav stays on top of the page.
and like @KoniKodes said you need to add a div with the id of
about
@Belax8 Thanks for the z-index: 100 to stay on top. I didn't know that.
konikodes sends brownie points to @belax8 :sparkles: :thumbsup: :sparkles:
:cookie: 403 | @belax8 |http://www.freecodecamp.com/belax8
@Belax8 @KoniKodes Thanks for the info. I added the z-index and the id to my about, but the nav buttons still aren't working. I think I'm gonna take a break and look at it with fresh eyes.
kevinriv sends brownie points to @belax8 and @konikodes :sparkles: :thumbsup: :sparkles:
:warning: kevinriv already gave belax8 points
:cookie: 286 | @konikodes |http://www.freecodecamp.com/konikodes
Maybe if you place the id before class?
@KoniKodes Dang, I thought that was gonna work, but nope.
@KevinRiv Sorry. Let me look again.. I know you can do this.
Hey guys, so just yesterday my quote machine project was working fine, but today none of the quotes are showing. Do any of you know why?
@KevinRiv Try putting your id inside the row div.
@disofu234 What is your codepen?
@KoniKodes Still nothing. I can only assume it's my wonky HTML/Bootstrap creation that something isn't where it's supposed to be?
it just worked when i clicked on it lol
Does anyone know how to make the weather icons show up as icons and not text?
for some reason it's not working from my code pen
I'm trying to make a button with an <i> </i> tag, as in icon.. how can I do that without making the text italicised?
@aidansven <button class="btn-primary"><i class="fa fa-facebook"><a href="#">Facebook</a></i> That's what I have for a Facebook button. My text isn't italicised.
@aidansven don't put text inside <it> tag.
<i>
@disofu234 I've been reading that we now need to link to secure servers. https - that is a recent development.
ah ok.. I'm trying to use i instead of <button> because I currently have button and there's an annoying outline that stays after it is clicked
apparently that's a chrome/ff accessibility feature to outline buttons from what I read
and even when I try outline:nonel it doesn't go away
@KoniKodes Thank you!
disofu234 sends brownie points to @konikodes :sparkles: :thumbsup: :sparkles:
:cookie: 287 | @konikodes |http://www.freecodecamp.com/konikodes
@KevinRiv It seems to be working for me. I think the problem is that each div is really short, so it's hard to see the change. If you added more content I think it would be more noticeable
@KoniKodes thanks for your help too!!
belax8 sends brownie points to @konikodes :sparkles: :thumbsup: :sparkles:
:cookie: 288 | @konikodes |http://www.freecodecamp.com/konikodes
@aidansven try border:0 ?
@Belax8 Hmm, strange. I had kinda thought that might be an issue, but I can't even make it scroll from the about(top) to the contact portion. I might throw in some test <br> and see if I can notice then.
ineed urgent help please
I agree with @Belax8 . I can now go to about from the contact and portfolio.
@Belax8 Thank you. I have learned alot by watching your responses to the other campers.
konikodes sends brownie points to @belax8 :sparkles: :thumbsup: :sparkles:
:warning: konikodes already gave belax8 points
hello guys
@KoniKodes Thanks for the help. I'm still not seeing anything move on my end, but I might have to keep playing with it.
kevinriv sends brownie points to @konikodes :sparkles: :thumbsup: :sparkles:
:warning: kevinriv already gave konikodes points
I am having a problem. Whenever I copy and navigator code provided by FreeCodeCamp and place it in Codepen.io it does nothing. Is anyone else having this issue?
@RoniqueRicketts Do you have https:// in the codepen url in your browser?
That was my problem
@KoniKodes @Belax8 I just tried it on a different browser and it worked! Apparently I need to clear my Firefox cache and see if it works as well. Thanks so much!
:warning: kevinriv already gave konikodes points
kevinriv sends brownie points to @konikodes and @belax8 :sparkles: :thumbsup: :sparkles:
:warning: kevinriv already gave belax8 points
@KevinRiv I am so glad! Happy Koding!
@mcorby17 gee thanks.
roniquericketts sends brownie points to @mcorby17 :sparkles: :thumbsup: :sparkles:
:cookie: 275 | @mcorby17 |http://www.freecodecamp.com/mcorby17
@KoniKodes Thanks, you too. I'm sure I'll be back in the chat for a multitude of other reasons as I continue attempting to learn javascript/jquery.
kevinriv sends brownie points to @konikodes :sparkles: :thumbsup: :sparkles:
:warning: kevinriv already gave konikodes points
@KevinRiv I'm in here a lot! You are always welcome.
How come my navbar is all messed up
I want it to look similar to the one at w3 schools: http://www.w3schools.com/bootstrap/bootstrap_navbar.asp
nobody?
@miciah123 ha ha I'm looking at it
@miciah123 I'm checking. Give me a few minutes?
@Belax8 :-)
Oh sorry I was being a little impatient XD
@Belax8 @KoniKodes
@Belax8 @KoniKodes
@miciah123 Have you also looked at the bootstrap docs? http://getbootstrap.com/components/#navbar
@miciah123 try using ---------> <ul class="nav navbar-nav">
people twi questions, one how can i make the this divs to overlap to make the simon game, 2 how can i remove the center of the 1/4 circles so i can put the start/counter in the game
@wearenotgroot That worked! thank you
miciah123 sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1115 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
I need help with my portfolio, when click any of the navbar I want make sure it moves to right <div>
It's always the little typos grrr
@miciah123 if you want to put them to the right just add
navbar-right
@mtkilic first, add bootstrap and fonts inside your codepen settings. Then make your targets id instead of class.
@mtkilic your links need to look the this
<a href="#home">Home</a> and you need to add a div with the ID of home and that link will send you there
@miciah123 I know, it's those pesky little details that get me.
@KoniKodes @miciah123 dont worry when you are working in real developement you have IDE and other tools to help you avoid most obvious mistake
@wearenotgroot :-) Yes, until then thank goodness for the kindness of campers
konikodes sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1116 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
@gerarddawson Looks Great!
@KoniKodes @Belax8 Thank you I looking in to it now
mtkilic sends brownie points to @konikodes and @belax8 :sparkles: :thumbsup: :sparkles:
:cookie: 289 | @konikodes |http://www.freecodecamp.com/konikodes
:cookie: 404 | @belax8 |http://www.freecodecamp.com/belax8
Hey guys, I have a problem with the weather app. My getJSON isn't responding. I have access codepen like https because otherwise I can't access my localitation, but I think that's the reason why getJSON isn't respondind, because the weather app query is http. How can I solve this?
@isaacgg I have the same problem. https://developers.google.com/web/updates/2016/04/geolocation-on-secure-contexts-only
I think we can choose the country of the person by ip information
@isaacgg @KatGeek what APIs are you using for weather?
and how are you getting coordinates? navigator.geolocation?
@isaacgg Your console shows the lon/lat. http://forum.freecodecamp.com/t/openweathermap-api-has-some-issues-over-https/5028 addresses this. I use wunderground and it seems to work.
you can't use https with openweathermap if you have free account
they only give you non-secure i.e. http
So should I change the api?
and you can't mix a non-secure protocol (openweatherapp) inside a secure connection (https on codepen)
if wunderground gives you free https access you can do it that way, or get your coordinates a different way
some people have used
http://ip-api.com/json to get coordinates, for example
@isaacgg Yes, I think you should change the api in this case.
this would prevent the need to use https at all and you can still use openweathermap
ok, thanks @coymeetsworld !! I'll do that!
katgeek sends brownie points to @coymeetsworld :sparkles: :thumbsup: :sparkles:
:star2: 1120 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
Ok thanks @coymeetsworld @KoniKodes I will try wunderground
isaacgg sends brownie points to @coymeetsworld and @konikodes :sparkles: :thumbsup: :sparkles:
:cookie: 290 | @konikodes |http://www.freecodecamp.com/konikodes
:star2: 1121 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
np guys good luck
Hi I am buliding my first web app using javascript and fetching data using API from www.openweathermap.org/ I have used the API key as mentioned in the documentation still it is giving an error of unauthorization. Can there be any other reason for this error while calling a function or so . Thank you in advance.
var APPID = "21d131e2d9af8ec17907e9ef18a79fd2";
var temp;
var loc;
var icon;
var wind;
var humidity;
var direction;
function updateByZip(zip){
var url = "http://api.openweathermap.org/data/2.5/weather?" +
"zip = " + zip +
"&APPID =" + APPID ;
sendRequest(url);
}
@ngoyal100894 you should look at using the getJSON function instead of sendRequest
Yeah but I was following a youtube a tutorial where he did the same
https://www.youtube.com/watch?v=TGFozfL0D9o&list=PL7C8fMD-89DLXOLuwjofJJ9smB_LmVGeu&index=2
Then what could be the possible reason that i am getting it wrong
https://www.youtube.com/watch?v=TGFozfL0D9o&list=PL7C8fMD-89DLXOLuwjofJJ9smB_LmVGeu&index=2
Then what could be the possible reason that i am getting it wrong
sendRequest makes a more generic GET request but getJSON will do alot of things for you to simplify the process
dont know why that person did it that way
so you would have to review that video again to see what they did, but getJSON will be much simpler to do
Yeah I will explore this one ..So we can get error while sending request right?
error:401
how's it looking to you guys?
any design tweaks you would make?
whoops forgot my unselectable class in my codepen version
function sendRequest(url){
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if(xmlhttp.readystatechange == 4 && xmlhttp.status == 200){
var data = JSON.parse(xmlhttp.responseText) ;
weather = {};
weather.wind = data.wind.speed;
weather.direction = data.wind.deg;
weather.loc = data.name;
weather.temp = data.main.temp;
weather.icon = data.weather[0].id;
weather.humidity=data.main.humidity;
update(weather);
}
};
xmlhttp.open("GET", url, true);
xmlhttp.send();
}
@coymeetsworld
I am not familiar with using XMLHttpRequest, so I can't really help out any further
@ngoyal100894
i will suggest again, use getJSON
much simpler code that way, and you already have exposure to it in previous challenges
not to mention professional companies are migrating away from xml pretty quickly
well
i guess the data format is still json right
but xml requests work different across browsers which is why jquerys getJSON is so good
because it is consistent
I remember like 10 years ago XML was all the rage and everyone was saying that XML would take over the world, everything was going to be an XML document, etc.
needs to be renamed AJAJ
lol
not so much the point though, that API returns data with JSON
so why not use a function that will expect and process it for you? Much less code needs to be written and the code you have to write will be much cleaner
agreed
If I remember correctly there are like 3 versions of XMLHttpRequest you have to call to account for browser differences... or you could use jQuery, which abstracts all that away
Okay will try that one now .. will have to explore
thanx everyone ..
This message was deleted
go through the json and api section again
np good luck
though i will warn you not to use the .filter method of arrays show you to use (a pretty bad oversight) since your api isnt likely to return an array
yes getJSON is a jQuery function, also much cleaner to write than an .ajax call
just use bracket or dot notation to access what you need
Anyone can suggest me a reference study link or something for getting data with getJSON
@ngoyal100894 docs----------->http://api.jquery.com/jquery.getjson/ as for getting data that will depend on the api
thanx @wearenotgroot
ngoyal100894 sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1119 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
Hello there!
I’m currently working on my portfolio page and I’m trying to add a dropdown nav button to it. I’ve messed around with the code for a little while, but I can’t seem to get why the dropdown menu won’t actually pop up. I can get the list of buttons to appear on their own, and the dropdown button itself, but it does nothing when I click it. I was wondering if anyone knew how I could get it to work?
<nav>
<div class="container-fluid" id="myNav">
<ul class="nav nav-pills pull-right">
<!-- Dropdown Button -->
<li role="presentation" class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
<i class="fa fa-list fa-2x" aria-hidden="true"></i>
</a>
<!-- Buttons Inside -->
<ul class="dropdown-menu">
<li><a href="#aboutTitle">Who Am I?</a></li>
<li><a href="#">What Do I Know?</a></li>
<li><a href="#">What Have I Done?</a></li>
<li><a href="#">How To Reach Me</a></li>
</ul>
</li>
</ul>
</div>
</nav>
@SyntaxErrorless I’m sure you have bootstrap.css loaded but it needs 2 other files added. jQuery.js and bootstrap.js (in that order) in the JS settings in codePen. so you need 3 files
@SyntaxErrorless what @mutantspore said. It's probably that you don't have all the files and yes, jquery then bootstrap in the JS menu
I had all of those added except Bootstrap.min.js on the JS menu. Derr. Thanks, @mutantspore and @dhcodes !
syntaxerrorless sends brownie points to @mutantspore and @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1728 | @mutantspore |http://www.freecodecamp.com/mutantspore
:cookie: 987 | @dhcodes |http://www.freecodecamp.com/dhcodes
@SyntaxErrorless so it works?
hooray
Yup! Now the button is too far to the right, so the buttons inside move away from the screen, but I know how to fix that. Again, thanks!
np
how do we style custom links?
like if I don't want my links to be by default blue but something like orange ?
people im starting the simon challenge, first time using audio, do i put the sound when color is clicked or div is active?
tips welcome
@meetmangukiya
a{
color:orange;
}
and what if i dont want it underlined when i mouseover it?
Can someone help me with a margin issue. I didn't set any right or left margins on my header or following images. What is causing this http://codepen.io/jreinke10/pen/ZOQMwd
@meetmangukiya
a:hover
{
text-decoration:none;
}
@meetmangukiya -------->http://www.w3schools.com/css/css_link.asp
@meetmangukiya yes that ^^
@jreinke10 Add bootstrap
ohh
thats cool man!
thanks @wearenotgroot
meetmangukiya sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1121 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
How do we make width of a row in bootstrap grid equal?
for example:
<div class="row">
<h1 class="col-md-4"></h1>
<nav class="col-md-8">
<a href=# class="col-md-4">{Placeholder}</a>
<a href=# class="col-md-4">{Placeholder}</a>
<a href=# class="col-md-4">{Placeholder}</a>
</nav>
</div>
@jreinke10 Try making your image width:100% and height: auto
now what happens is that the height of
h1 and the height of nav are different, how do we fix it?
This message was deleted
@meetmangukiya Can you give your pens link?
@vinay-jaju actually I think I made a mistake in the example that actually solved my problem
I didn't use a div to wrap heading and nav together
okay. cool
I just used
class="row" inside the header tag which I wrapped around the h1 and nav
@jdpunk1 @khaduch thanks! i can't believe i haven't spotted the console tab this whole time
jarenescueta731 sends brownie points to @jdpunk1 and @khaduch :sparkles: :thumbsup: :sparkles:
:cookie: 323 | @jdpunk1 |http://www.freecodecamp.com/jdpunk1
:star2: 1294 | @khaduch |http://www.freecodecamp.com/khaduch
Here the link text of the nav bar isn't in center vertically, so I decided to use padding
I used
a{
padding: 10% 0 10% 0;
}
But it turns out that it take 10 % of the page and not 10 % of the nav's height
How do I make it 10 % of nav's height?
Can anyone answer a quick question about the Twitchtv project?
@gphalen just ask it friend
someone will pick it up
@meetmangukiya maybe 10vh as your unit?
instead of 10%
I'm having trouble with that one too
I need some help again. Really hating codepen right now!!!
OK, let me know if this is phrased poorly, it's a tad confusing. Most of the channels that aren't streaming will have 'null' listed as their game, but some that aren't streaming have 'Creative' or 'Programming' listed as their game. Does 'Creative' or 'Programming' being listed as the game indicate that the channel isn't streaming?
@RoniqueRicketts codepen is a bit frustrating to use sometimes
@dhcodes ok lets see
I have gotten my location based on the previous code that FCC gave us, I have added a few Jquery and now I am totally stuck nothing is happening
```
you on the weather app? post it, we can take a look
@gphalen if stream equals null means they are not streaming
@gphalen i remember having to do two json calls to two different api locations to get all the info i needed
$(document).ready(function() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
lat = position.coords.latitude;
lon = position.coords.longitude;
var api = 'http://api.openweathermap.org/data/2.5/weather?lat='+lat+'&lon='+lon+'&appid=2e79b0a46ce5ad9212eed4ea9f4cd8d6';
$.getJSON(api, function(json) {
$('#data').html('Lat:' + lat +'<br>Lon:'+ lon);
alert(json.coord.long);
});
});
}
});
@dhcodes that's helpful, actually.
@gphalen to determine if a channel is streaming you need to use /stream
@RoniqueRicketts using chrome?
@dhcodes thanks
punchymango sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:cookie: 990 | @dhcodes |http://www.freecodecamp.com/dhcodes
@dhcodes yeah, I have to do one to the streams and one the the channel one.
This is my code. given that #data is a a div <h3> tag
@dhcodes not really. because the output of 10vh is nowhere close to 10% of nav's height
@dhcodes Yes I am using Chrome
@meetmangukiya then use 2vh
I just want to center it vertically
vh is view-port height
@gphalen if you want info on the channel then use /channel (will not tell you if the stream is online or offline) otherwise all the info on that channel will be there
oh...
@meetmangukiya have you tried
vertical-align: middle;
vertical-align: middle;
Let me try to explain better. The following gives me correct information at present:
$.getJSON('https://api.twitch.tv/kraken/channels/'+members[i], function(data2) {
if (data2.game==null || data2.game=='Creative' || data2.game=='Programming'){ body2.append(data2.display_name.link(data2.url)+ "is not currently streaming" + "<br>");
}
else
body2.append(data2.display_name.link(data2.url)+ "is currently streaming" + data2.game + "<br>");
}
)}
@RoniqueRicketts you won't be able to get html5 location via chrome
well, you can get the location but not pass it to the api
because the api is unsecured
I'm just wondering if there are instances where channels with "creative" or "programming" as their game are sometimes streaming, because then I have to find something else.
and chrome now only allows html5 location to be passed over https channels @RoniqueRicketts
@gphalen what's an example of a user with that?
ok so how will I pass my location to my api so that I can get my current weather?
@dhcodes FreeCodeCamp
@dhcodes it dint work
@gphalen what listed in the game doesnt tell you if they are online
@RoniqueRicketts on chrome, you would need to use an ip location like www.ip-api.com
@meetmangukiya well boo
@dhcodes the "streams" channel says they're not streaming, the channel says they have a game("Creative")
oh damn thanks @dhcodes
roniquericketts sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:cookie: 991 | @dhcodes |http://www.freecodecamp.com/dhcodes
np
@gphalen so why not use the streams channel to determine if they are online or not?
@dhcodes boo ?? :confused:
@dhcodes ok so I have to use that ip-api and based on the location the api gives i'd pass that to myweather api?
lol as in boooooooooo like what a crowd does @meetmangukiya
i'll go look at your codepen
one sec
@gphalen those are just category of type stream
@RoniqueRicketts correct
@dhocdes the streams channel will print the ones that are streaming, but won't print the ones that aren't streaming for some reason.
thanks much man I have been stuck on this challenge for 3 week. omg. I even went to learn about xml and apis and even took another Jquery curse OH MY FREAKING GOSH!!!
@gphalen only /streams will tell you if they are streaming
then you need to test the stream
then you need to test the stream
$.getJSON('https://api.twitch.tv/kraken/streams/'+members[i], function(data) {
if(data.stream !== null)
{
}
Got so frustrated I thought I wasn't actually learning anything. But now it all makes sense. AUUUGH!!!!. I could so punch google chrome right now if I could. :D
ok @dhcodes
@RoniqueRicketts lol i hear you
@RoniqueRicketts they should really put a note on the project page
maybe i'll submit an issue for you
and then it can be my first commit :shipit:
Gee thanks dhcodes.
@wearenotgroot the following code will print the ones that are streaming, but not the ones that aren't streaming.
@dhcodes can I get tagged to that Issue? I wanna follow it. I am the only one that reach this far in FCC in my city so I would like to give this info to those that are behind so that don't have to go through the problem I went through.
if (data.stream!==null) {
body.append("<br>" + data.stream.channel.display_name.link("https://www.twitch.tv/"+ data.stream.channel.display_name)+"is currently streaming" + data.stream.game + "on Twitchtv." +"<br>");
}
else
body.append("<br>" + data.stream.channel.display_name.link("https://www.twitch.tv/"+ data.stream.channel.display_name)+"is not currently streaming");
}
@RoniqueRicketts sure. you can submit it if you want
@RoniqueRicketts https://github.com/FreeCodeCamp/FreeCodeCamp/issues
hi guys
i'm in the middle of portfolio task
@RoniqueRicketts i know they know about it, but maybe your issue could say that for the time being they should at least update the instructions
if I click about Us, how can it scroll down to that specific div?
@Narendro check out anchor links
@gphalen if the stream is null then you cant access
data.stream.channel
@Narendro you pretty much give your section About Us and id="about"
and then your href on your button would be #about
i see
well <a href="#about">
and it should jump it there
@wearenotgroot I know...so I need something other than the https://api.twitch.tv/kraken/streams/
thanks @dhcodes
:cookie: 992 | @dhcodes |http://www.freecodecamp.com/dhcodes
narendro sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
@meetmangukiya quite the interesting problem you have here
@gphalen what you can do is do a /channel first then store the data some how then do a /stream to determine if they are online
@gphalen update the status
@wearenotgroot OK, I've been doing /stream first, maybe that will work, thanks
gphalen sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1124 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
@gphalen another thing you might want to create a more generalized functions. look for things that do the same things multiple times
@meetmangukiya you still here?
people im really stuck in the simon project, i dont know where to start the jquery, if someone can lend me a hand i will appreciate http://codepen.io/tuliodnw/pen/ZOQjRr?editors=0010
@dhcodes yup
@meetmangukiya so i looked at how bootstrap does it. They set a height for the navbar and then add px padding to top and bottom. I did it and it works
so for ex.
nav {
dang
one sec
Thanks for articulating that @wearenotgroot , finally got this one figured out
punchymango sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1125 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
after bashing my head against it
#nav {
height: 50px;
}
#nav nav a {
padding-top: 15px;
padding-bottom: 15px;
}
please review guys
@punchymango O.o
@tuliodnw do you mean you need help thinking about how to generate the functionality?
Hi all, I’m looking to add a delay and a fade in animation to the function that populates the results in my wikipedia viewer project. Can I add something to .foreach to achieve this?
of the game?
what's the best way to .fadeIn() my main content box? I put fadeIn at the end of my function, but right now the box still fades in before the text loads from the api
@qckpckt you mean you want them all to fade in at once or individually at diff. rates?
is there a way to make sure that text loads before it fades in?
@aidansven check out callbacks
@Narendro you might get better feedback in the codereview room, but I like it. It's hard to read the text on some divs though because of the bright backgrounds in the pictures
@dhcodes that worked
Hi! Do you know if there is a way to do "Show the Local Weather" without exposing the api at codepen.io?
though I didnt really get the reason that you explained me :disappointed: will try to understand once again from the bootstrap doc
thanks @dhcodes
meetmangukiya sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:cookie: 993 | @dhcodes |http://www.freecodecamp.com/dhcodes
@KatGeek i don't believe so...maybe if you built it on github pages? I think there's a way to hide api keys on github
@meetmangukiya i set a static height for the nav bar so it will always be 50px; and then put in padding like you were originally doing. Yours was just changing because it was a %
so it was fluid
@dhcodes thanks mate
narendro sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:warning: narendro already gave dhcodes points
np
@dhcodes submitted
@dhcodes makes sense now :+1:
@dhcodes if i buitl it on github pages i am not following the instrucctions (Objective: Build a CodePen.io app that is functionally similar to this). I am right?
@RoniqueRicketts commented
@KatGeek it's not a must that your projects be hosted on codepen. It just makes it easier to get help
ah ok @dhcodes! So i can host it on neocities for example? It is not a problem if people can't see the code?
@dhcodes cool thanks a lot. You saved me my laptop. I was next to punching the 1s and 0s out of it.
:warning: roniquericketts already gave dhcodes points
roniquericketts sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
@RoniqueRicketts np
@KatGeek well people should/can be able to see your code by right-clicking and clicking "view source"
but codepen makes it much easier
i wouldn't worry about the openweather key
@KatGeek you can read this though if it helps: https://rosspenman.com/api-key-exposure
may have some options
idk that many people would steal your openweather api key and use it to spam the openweather info
ok, thanks @dhcodes !!
:cookie: 994 | @dhcodes |http://www.freecodecamp.com/dhcodes
katgeek sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
hello. what does * {} mean? (in css)
@tugrulz its mean that you select all nodes.
why isn't my console.log(data); printing in the .getJSON callback? http://codepen.io/jarenescueta/pen/VjLvgm?editors=1111
@jarenescueta731 you’ll need to add in
&callback=? into your URL
@mutantspore like this?
var apiURL = "https://en.wikipedia.org/w/api.php?callback=?action=query&format=json&list=search&srsearch="+topicURI;
well you’ll need to add in & infront of action now
var apiURL = "https://en.wikipedia.org/w/api.php?callback=?&action=query&format=json&list=search&srsearch="+topicURI;
like that
@mutantspore so i have to add
&callback=? whenever i want to use the JSON data for a function?
@jarenescueta731 only if the server requires it. It will depend on the api but it is common
@jarenescueta731 do you have your browser dev tools open. you could see teh CORS error in there
@mutantspore ok thanks, the mediawiki api docs weren't very clear to me
:star2: 1729 | @mutantspore |http://www.freecodecamp.com/mutantspore
jarenescueta731 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
@jarenescueta731 you are not alone lol
Hi @mutantspore
Can you take a look at https://codepen.io/pramodvspk/pen/MeKowm?editors=1010
I am setting status online/offline/closed respectively for channels but still am getting status online for all the channels
@mcorby17 You're using https and trying to get json from an api using http. Take the 's' off and you're good. Also, when debugging, don't use the codepen console. Use the console in the inspector. Ctrl shift j for most browsers. ;)
@jdtdesigns Yeah I ended up using the "http://ip-api.com/json" api for the lat and lon
@jdtdesigns btw will the things I write to the codepen console also write to my browser's console?
yes
but you get more info from the browser
Quick question. What is the use in stacking col--? for example ```<div class="col-xs-12 col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2">
col classes in general seem to confuse me
@DunderStruck I believe they're used to make sure the content stays aligned with different browser sizes
I know col-xs is used for mobile devices
@dhcodes yeah, sorry i was gone
I kinda understand that, but I just don't quite understand how using multiple of them works.
people im really stuck in the simon project, i dont know where to start the jquery, if someone can lend me a hand i will appreciate http://codepen.io/tuliodnw/pen/ZOQjRr?editors=0010
with the thinking of the queryj
@tuliodnw What do you mean you don't know where to start? Are you talking about your start function or generally?
Is anyone else getting an error form Codepen.io?
@DunderStruck i would like to know that too - i kind of understand this koncept, but on the other hand - not quite. It has something to do with the width of elements...
@runebakjacobsen ok , i have two array, one for the ai orden that +1 each time and one for the user who must fill it everytime, but im still figuring out how im gonna make the change from the ai filling the array to the user, i dont know how im gonna make the sound and color when the ai is filling it.
@tuliodnw This program basically comes down to creating a random selection and pushing that to an array, showing that sequence as it builds, then after the sequence is fired using setTimeout or setInterval, you listen for a click from and the player and build an array. Check that the user array matches the sequence array and continue building the sequence if it does.
@tuliodnw Use the Audio object to create sounds
var sound1 = new Audio('http://mp3.url');
@TjasaK Yea, and it's kinda hard to see the visual difference when using them, so it's hard for me to fully understand it.
@jdtdesigns but the bright color i activate them with color:active, i still must see how i implement the sound, but when the ai is reading the array i will activate both,
@RoniqueRicketts yep it down lol
*it's
@mcorby17 ugh, hope will be up quickly
@DunderStruck maybe someone will help us out.. or maybe even better - we just keep on trying different things and waiting for the "eureka" effekt.. it has to come sooner or later
@tuliodnw You play an audio object with sound1.play()
so on click you can just fire the .play() or when the AI lights a button up
Does anyone know how I can access the weather description in this JSON?
{"coord":{"lon":-75.95,"lat":42.18},"weather":[{"id":800,"main":"Clear","description":"clear sky","icon":"01d"}],"base":"cmc stations","main":{"temp":293.62,"pressure":9646,"humidity":35,"temp_min":292.59,"temp_max":294.55},"wind":{"speed":3.04,"deg":320.006},"clouds":{"all":0},"dt":1465588639,"sys":{"type":3,"id":190084,"message":0.0034,"country":"US","sunrise":1465550830,"sunset":1465605608},"id":5128515,"name":"New Ireland","cod":200}
wow that came out badly
@mcorby17 What do you mean how ? You can just process the json object directly. Then use json.(...).(...)
@mcorby17 json.weather[0].description
@TjasaK haha, yea, hopefully. Until then, I'm just going to keep throwing a bunch of them everywhere until things look like they should.
@Belax8 thank you!
mcorby17 sends brownie points to @belax8 :sparkles: :thumbsup: :sparkles:
:cookie: 405 | @belax8 |http://www.freecodecamp.com/belax8
@mcorby17 anytime! Did you get it to work?
Yeah I was confused by the array
No worries. That messed me up too!
@mcorby17
data.weather[0].description
btw would you know what degree is the temp in from the free weather api? I'm guessing kelvin since it's in the 200's
@mcorby17 you can specify it through the url you use to request
@wearenotgroot Oh okay cool how do I do that?
@mcorby17 units=metric or units=imperial otherwise its in kelvin(Standard)
@mcorby17 just add it to the url
@mcorby17 url + '&units=metric'
@wearenotgroot awesome! it worked thanks
:star2: 1127 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
mcorby17 sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
@mcorby17 if you scroll down on Unit format section http://openweathermap.org/current
Hey. I think I can say I finished the twitch project. Here it is: http://codepen.io/manu4216/full/QEbqxK/
I'd apreciate any feedback, especially on the code, since I know it's not perfect :)
I'd apreciate any feedback, especially on the code, since I know it's not perfect :)
@DunderStruck i agree with you - just keep on doing.. well - I´ll let you know when i figure it out...
@manu-4216 nice work
i like that you did not go with the layout everyone else seems to go with (myself included)
@TjasaK Same here.
Hi fellow campers! What's a good resource to get answers for coding questions?
Mostly pertaining to the tribute section of the course...
@manu-4216 , I am facing issue with my twitch project, all my statuses are showing either online or offline
Can you check my pen http://codepen.io/pramodvspk/pen/MeKowm
This message was deleted
@manu-4216 , your twitch pen works good
Can you check mine http://codepen.io/pramodvspk/pen/MeKowm
I am facing issue with my twitch project, all my statuses are showing either online or offline
@pramodvspk ok, having a look now
@jdtdesigns i didnt say thanks before, so thanks
tuliodnw sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 461 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
@pramodvspk you should pu what game are they playing
@tuliodnw didnt get you
@pramodvspk You mean some should be closed, not just on or offline? Your 422 ones are closed.
You don't need to use console.log again and again. You should just write "debugger;" where you want to start debugging. ANd then use the console to see what you have in your jason.
It's much easier to debug this way! I also suggest you to just put the channel that you're testing in the input, to isolate the issue that you're investigating
You don't need to use console.log again and again. You should just write "debugger;" where you want to start debugging. ANd then use the console to see what you have in your jason.
It's much easier to debug this way! I also suggest you to just put the channel that you're testing in the input, to isolate the issue that you're investigating
@manu-4216 yeah...I am handling them correctly and assigning them status of online/offline/closed and respective bg colors. But every bg color comes out to be the same
and the status is always same
Question: when I click on a link setup by <a> tag, it opens the right page with the right url but can't load the page, but when i manually copy that url and paste to another window it works...why is that and how to fix it? thank you
@pramodvspk I like your Mustache :) I have such a messy code because I didn't use a library to link the template and the array of objects
@manu-4216 , yeah..I like using templates
Did you figure out where my program is breaking?
@pramodvspk Oh noo, I stopped to look at that library. I was hoping that once you use the debugger in the console, you'll find it imediately
@pramodvspk you should put what the online streamers are playin
Hi Everyone I'm having a hard time trying to figure out how to get through the Roman Numeral Convertor challenge, I'd be great if anyone could give me a hint, not the code but an explanation on how you tackle the challenge
Hey guys...Does anyone know why on challenge #47, when we make the padding of the green box turn negative, that it entirely covered the yellow background?
@Ricka7x you still there?
@pramodvspk here i broke down you twitch app into few generalized functions use this a reference
http://codepen.io/wearegroot/pen/JKGeaw?editors=1010
http://codepen.io/wearegroot/pen/JKGeaw?editors=1010
@wearenotgroot instead of addig the bgcolor isnt better to add them a class, so later on he can hide/show online, and also do prepend online append offline na?
@wearenotgroot really good guide, explains everythig
Still here
@nawrockp ?
hey guys i'm still on the wikipedia viewer project, adding fluff at this point. i'm trying to fadeIn() each search result one after the other and I have no idea why my code doesn't work. any hints?
http://codepen.io/jarenescueta/pen/VjLvgm
http://codepen.io/jarenescueta/pen/VjLvgm
@wearenotgroot thanks it works
pramodvspk sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1128 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
But can you tell me where my code went wrong?
hello all....im running into a small wall.....im trying to add background image to my profile it's not working for some odd reason....the old image works just not the new image
@vvang044 make sure the images you use are available for public access
@vvang044 that's one possible reason
let me check
@jarenescueta731 for example i used a facebook photo for one project, and I could see it but other people couldn't.
@vvang044 ^ lol
i am using it from my flickr account
and its not working
i can just post it as img src it works that way when i try to make it as a background image it doesnt work
@jarenescueta731 don't you need a loop to make them appear one after the other? I'm not sure, just trying to help
anyone?
there is a css property for background-image
i tried that
background-image url("https://........ .jpg");
: ?
@vvang044 ```
elementName {background-image: url("
elementName {background-image: url("