These are chat archives for FreeCodeCamp/HelpFrontEnd

14th
Aug 2016
buiphuking
@buiphuking
Aug 14 2016 00:25
hi guys, i build twitchtv, how can i add a youtube channel into it ????????/
Patrick S
@thinktwice84
Aug 14 2016 00:28
I'm currently working on the tribute page. How is it that I can create a div with class="col-sm-12" but the resulting div can be over 1200 pixels wide? Looking on the bootstrap wiki the container width is 576px. I understand that I can reduce the column number (e.g. class="col-sm-6") to reduce the size of the column. so what's the purpose of denoting xs, sm, md, lg, and xl?
Patrick S
@thinktwice84
Aug 14 2016 00:33
I think I found the answer: "grid classes for a given screen size apply to that screen size and larger unless another declaration overrides it (i.e. col-xs-6 col-md-4 spans 6 columns on xs and sm, and 4 columns on md and lg, even though sm and lg were never explicitly declared)"
Brian Minnick
@Bminnick
Aug 14 2016 00:43
Hi all. I’m trying to add social media buttons to my portoflio page and it says to add bootstrap-social.css to my page. How can I do this is codeine?
buiphuking
@buiphuking
Aug 14 2016 00:58
a tag and img tag or use bootstrap
Danny Rubio
@drbe4t
Aug 14 2016 00:59
does anyone know why when i using a bootstrap blog template when changing the less file to add a background-color to the footer it doesn’t affect it?
Rita Alfonso
@alfonsotech
Aug 14 2016 01:02

Hi, I'm having a problem making my JSON calls for the API projects, getting a 404 error. It seems to be the same problem as with my other API projects so I'm thinking that my local host server may be set up wrong? Any ideas? Here is my code:

$(document).ready(function(){

var url = 'https://api.twitch.tv/kraken/streams/freecodecamp?callback=?';

$.getJSON(url, function(data) {
  console.log(data);
});


}); // document ready close

My code can also be seen/tested at: https://alfonsotech.github.io/twitch-tv-api/

Not getting any data, but am getting a 404 error
sfmajors373
@sfmajors373
Aug 14 2016 01:11
Hello! For the portfolio, how do I attach a thumbnail picture of my website? This is probably stupidly simple, but I am confused for some reason.
buiphuking
@buiphuking
Aug 14 2016 01:11
@alfonsotech change channel , let see what happen
Rita Alfonso
@alfonsotech
Aug 14 2016 01:11
@buiphuking How do you change the channel?
Trevor
@electrostaticfleece
Aug 14 2016 01:12
@alfonsotech As far as I can tell it's not a problem with your code. When I run it in codepen I get the appropriate object.
I believe the problem that you're not loading your js from the right directory on your end
Rita Alfonso
@alfonsotech
Aug 14 2016 01:12
Interesting @electrostaticfleece . Maybe I'll move the projects over to codepen, but I need to get it working in my local environment eventually.
Trevor
@electrostaticfleece
Aug 14 2016 01:13
Yeah, you don't have to move it over to codepen
Just make sure your path to your js file is correct
Rita Alfonso
@alfonsotech
Aug 14 2016 01:13
oh, that would explain it. Let me see if I can fix that...
so simple...
I got it! I copied the stater files from another project, so hence the error. THanks for spotting that @electrostaticfleece !
CamperBot
@camperbot
Aug 14 2016 01:15
alfonsotech sends brownie points to @electrostaticfleece :sparkles: :thumbsup: :sparkles:
:cookie: 373 | @electrostaticfleece |http://www.freecodecamp.com/electrostaticfleece
Rita Alfonso
@alfonsotech
Aug 14 2016 01:15
@buiphuking thanks!
CamperBot
@camperbot
Aug 14 2016 01:15
alfonsotech sends brownie points to @buiphuking :sparkles: :thumbsup: :sparkles:
:cookie: 11 | @buiphuking |http://www.freecodecamp.com/buiphuking
George Loaiza
@xchendo
Aug 14 2016 02:37
Ive been working on my pomodoro clock all day and have hit a road block. Ive spent the last few hours trying to get the timer to pause and restart when clicked. Any hints someone can give me? here is my project so far. http://codepen.io/xchendo/pen/wWNqRW it has not been styled at all, ive been trying to get the functionality to work first. I appreciate any help i can get!
DJ Pelland
@dna113p
Aug 14 2016 02:38
How do i make ajax request without jquery? Is there a good way to do it besides XMLHttpRequest?
Harry Adel
@harryadel
Aug 14 2016 02:52
Why isn't my #block being affected by top and left?
http://codepen.io/Hadouken/pen/BzrkJG?editors=1100
I've assigned position: absolute t o it
Timbowser
@Timbowser
Aug 14 2016 02:58
@Harry97 why are they nested?
@Harry97 in the css
Harry Adel
@harryadel
Aug 14 2016 02:59
because I nested them in HTML
so in order to flow in the same order
I nested all of them in the arrangement in css
Ken Haduch
@khaduch
Aug 14 2016 03:01
@Harry97 - not sure if this is impacting them, but the compiles SCSS code is showing these selectors: .parallax .parallax__group .parallax_layer { and .parallax .parallax__group .parallax_layer #block - the .parallax__group doesn't match your class in the HTML.
@Harry97 - changing that is making a difference
Harry Adel
@harryadel
Aug 14 2016 03:03
@khaduch You are right my I added one extra "_" in .parallax_group
sure there's a difference now but still the text isn't positioned properly according to its assigned properties
Ken Haduch
@khaduch
Aug 14 2016 03:06
@Harry97 - well, it moved.... :)
Harry Adel
@harryadel
Aug 14 2016 03:09
@khaduch LOL I had my browser zoomed in 200% :D
thanks alot I appreciate you help guys @khaduch @Timbowser
CamperBot
@camperbot
Aug 14 2016 03:10
harry97 sends brownie points to @khaduch and @timbowser :sparkles: :thumbsup: :sparkles:
:cookie: 265 | @timbowser |http://www.freecodecamp.com/timbowser
:star2: 1540 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Aug 14 2016 03:18
@Harry97 - if you assign position: absolute; to the #block div, then that top and left setting seems to make a difference, for sure?
Harry Adel
@harryadel
Aug 14 2016 03:21
yeah #block is responding nicely now
Ken Haduch
@khaduch
Aug 14 2016 03:31

@xchendo - hello there. One problem that you have is that you appear to be starting multiple setInterval timers on each click. And I think that the scope of your var setIntervalID is such that you cannot use it to stop the timer. But the first thing that you have to do is once you start a timer, you have to prevent another from being started until you stop the original one. You can so this by making sure your setIntervalID variable is not local to the function - it has to retain the value and not be reloaded. Then if you already have a setInterval running, do not start another one - you can do something like if (setIntervalID !== null) { // start an interval } else { // do nothing } or deactivate the link so it can only be clicked once (or change the sense of it so that you are stopping it, etc.) Those are probably the biggest problems.

Another suggestion is to maintain your timer count only using seconds, makes the calculations easier - convert to a mm:ss format on the way out to the screen.

Timbowser
@Timbowser
Aug 14 2016 03:49
I'm so close to finishing this assignment. When I tweet I can't get the txt using jquery. I can set it with the same command but I can't get it. Issue seems to be with line 9 in the js http://codepen.io/tbowser/pen/YWdQLj
jrandallhansen
@jrandallhansen
Aug 14 2016 04:01
@Timbowser that seems to be such a messy way to write the whole thing
i cant really even decipher what you are trying to do.
Milo Hartsoe
@MiloATH
Aug 14 2016 04:02
@Timbowser the tweet button doesn't input the message
Harry Adel
@harryadel
Aug 14 2016 04:02
@Timbowser so when the tweet button is clicked you want a new tab that contains the quote ready to be tweet
tweeted*
jrandallhansen
@jrandallhansen
Aug 14 2016 04:02
i would format the twitter button as a link in your html and then just set the src in the jQuery
Harry Adel
@harryadel
Aug 14 2016 04:02
rather than having to type the quote manually?
jrandallhansen
@jrandallhansen
Aug 14 2016 04:03
i think that is how i did it. and dont forget to set target=_blank.
Milo Hartsoe
@MiloATH
Aug 14 2016 04:04
@Timbowser It might be a good idea to align the strips more/
in the backgroudn
Timbowser
@Timbowser
Aug 14 2016 04:04
I can get the window to pop up and set it with a string I just can't add what is in the p tag inside the div.
Harry Adel
@harryadel
Aug 14 2016 04:07
@Timbowser which div specifically?
Timbowser
@Timbowser
Aug 14 2016 04:10
@Harry97 <p class="quoted" id="quoted">"Would you like to see a quote?"</p>
tichusp
@tichusp
Aug 14 2016 04:10
hello guys, could I get some feedback on my pomodoro clock project? I think I'm mostly finished, just need to rewrite part of the code so it looks cleaner and fix a bug when you start the clock with both work time and break time set to 0.
http://codepen.io/tichusp/full/NAoRxq/
Timbowser
@Timbowser
Aug 14 2016 04:10
@Harry97 is the text I want to pull.
Milo Hartsoe
@MiloATH
Aug 14 2016 04:14
@tichusp looks really good.
the dial doesn't update with a text input
jrandallhansen
@jrandallhansen
Aug 14 2016 04:14
@Timbowser save the value in a variable before you insert it into the <p>
Milo Hartsoe
@MiloATH
Aug 14 2016 04:15
@tichusp also the time doesn't set correctuly with a text input.
jrandallhansen
@jrandallhansen
Aug 14 2016 04:15
and then just add that variable to the end of your URL
tichusp
@tichusp
Aug 14 2016 04:15
@MiloATH thanks :) how you mean?what browser are you using?
CamperBot
@camperbot
Aug 14 2016 04:15
tichusp sends brownie points to @miloath :sparkles: :thumbsup: :sparkles:
:cookie: 317 | @miloath |http://www.freecodecamp.com/miloath
Milo Hartsoe
@MiloATH
Aug 14 2016 04:16
@tichusp I am using chrome, I first use the dial to adjust the time, then changed the input by select the input box and typing a different number, then hit start
the time was the time input on the dial not in the input box typed in
Also the dial doesn't update with the input number. I would suggest just removing the ability to input a number by typing it in.
tichusp
@tichusp
Aug 14 2016 04:18
@MiloATH oh yes I get what you mean now. It works if you hit enter when you finish typing your input. I should implement what you are suggesting though.
Milo Hartsoe
@MiloATH
Aug 14 2016 04:18
@tichusp Ohh, now it works
cool. Nice project
Timbowser
@Timbowser
Aug 14 2016 04:18
@jrandallhansen I did that first but the only problem is is it will tweet the next random quote before you generate it. I just set my pen back to working that way. If you click the tweet button you will see the quote and then close the popup and hit generate.
tichusp
@tichusp
Aug 14 2016 04:18
thanks a lot for your feedback. Appreciated
Milo Hartsoe
@MiloATH
Aug 14 2016 04:19
maybe a button submit button next the input, but that would be kind of weird
You could use the keyup function in jquery to contiously update the input
instead of .on('submit', function()....)
use .keyup()
tichusp
@tichusp
Aug 14 2016 04:20
yeah I will do that. It didn't occur to me that it would be confusing but I can see why it is
Clearly your suggestion is good. Thanks
Milo Hartsoe
@MiloATH
Aug 14 2016 04:21
Overall really good project.
Timbowser
@Timbowser
Aug 14 2016 04:25
@MiloATH thanks, I fixed the stripes.
CamperBot
@camperbot
Aug 14 2016 04:25
timbowser sends brownie points to @miloath :sparkles: :thumbsup: :sparkles:
:cookie: 318 | @miloath |http://www.freecodecamp.com/miloath
RIles Le Roy
@iamriles
Aug 14 2016 04:34
var getWeather = function() { //Getting the latitude and longitude navigator.geolocation.getCurrentPosition(function(position) { var lat = Math.floor(position.coords.latitude); var long = Math.floor(position.coords.longitude); //API url call set up var xhr = new XMLHttpRequest(); var appid = "c8e8277afd8a8e6877130b5053db7650"; var url = "api.openweathermap.org/data/2.5/weather?lat="+lat+"&lon="+long+"&APPID="+appid; xhr.open("GET", url, false); xhr.ready(); console.log(xhr.status); }); } could someone please help me I keep getting undefined when I call this function
wow that was poorly formatted
This message was deleted
Harindu Dilshan ( Kavinda Pitiduwa Gamage)
@harindu95
Aug 14 2016 04:40
the function doesn't return anything
so it returns undefined
Harry Adel
@harryadel
Aug 14 2016 04:59
@Timbowser http://codepen.io/Hadouken/pen/BzrwNQ?editors=1010
is this how you wanted it to be ?
now when you click the tweet button the new tab contains the same text generated inside the div
NixonRichard
@NixonRichard
Aug 14 2016 05:00
$('#search-bar').click(function(){
  $.getJSON("http://en.wikipedia.org/w/api.php?action=query&format=json&list=search&srsearch="+keyword+"&callback=?" ,
           function (result) {
    $('#results').append(data)
  });
})
hi there
i dont know what to do with the call back function ...
Harry Adel
@harryadel
Aug 14 2016 05:01
@NixonRichard Could you please send us your codepen?
Here it is
Jerzz
@2cool4school
Aug 14 2016 05:04
Hey guys what's meant by "creating a free API key"?
I'm working on the "Show the Local Weather" project.
Harry Adel
@harryadel
Aug 14 2016 05:06
@NixonRichard Why did you create two search click methods?
@2cool4school You have to sign up to their website
Rita Alfonso
@alfonsotech
Aug 14 2016 05:07
@2cool4school You need to go to the website for the API that you want to use and get a key to use the API. It's normally free, although some APIs do charge you if you want to use their data. The weather one is free.
Harry Adel
@harryadel
Aug 14 2016 05:07
and then you shall get a special piece of code that you'll add to the api call
api call url*
It's their way of moderating who uses their api
NixonRichard
@NixonRichard
Aug 14 2016 05:10
@Harry97 what s that special piece of code ?
Harry Adel
@harryadel
Aug 14 2016 05:10
@NixonRichard The api key
NixonRichard
@NixonRichard
Aug 14 2016 05:10
where is it ?
Harry Adel
@harryadel
Aug 14 2016 05:10
I know it's not really "code" but you know I'm speaking metaphorically
some api's require it and some other don't
NixonRichard
@NixonRichard
Aug 14 2016 05:10
like video game s key ?
Harry Adel
@harryadel
Aug 14 2016 05:11
yeah close enough
NixonRichard
@NixonRichard
Aug 14 2016 05:11
i dont see that on wikipedia api s page
Harry Adel
@harryadel
Aug 14 2016 05:11
like I said wikipedia doesn't require one
anyway here you go
I tidied up your code
I don't wanna solve it for ya but I'mma guide you through
now in your console you shall see a response
NixonRichard
@NixonRichard
Aug 14 2016 05:13
i cant search
is that the completed code ?
Harry Adel
@harryadel
Aug 14 2016 05:13
nope
do you know what a console is?
NixonRichard
@NixonRichard
Aug 14 2016 05:14
as i know console.log(something here) will show me the something
when i run the code
Jerzz
@2cool4school
Aug 14 2016 05:15
@alfonsotech @Harry97 I signed up and I've obtained the key, I'm still a bit lost.
Harry Adel
@harryadel
Aug 14 2016 05:15
you are supposed to include this key in your api call url
send me your codepen and I'mma show you how to do it
Jerzz
@2cool4school
Aug 14 2016 05:15
At the end I presume?
Harry Adel
@harryadel
Aug 14 2016 05:16
@NixonRichard correct now open up your project in debug mode and hit ctrl+shift+i
it shall open up the console for ya
Rita Alfonso
@alfonsotech
Aug 14 2016 05:16
Yes, post a link to your codepen so we can see what you've tried and see how to help you. @2cool4school
Harry Adel
@harryadel
Aug 14 2016 05:16
and then try to search for anything then witness the response
Jerzz
@2cool4school
Aug 14 2016 05:16
@Harry97
Harry Adel
@harryadel
Aug 14 2016 05:17
@alfonsotech +1
@2cool4school yeah?
Jerzz
@2cool4school
Aug 14 2016 05:17
@Harry97
    if (navigator.geolocation) {
  navigator.geolocation.getCurrentPosition(function(position) {
    var long = position.coords.longitude;
    var lat = position.coords.latitude;
    $.getJSON("api.openweathermap.org/data/2.5/weather?lat="+lat+"&lon="+long, function(json) {
      //$("#location").html(json.sys);
      console.log(json);
      });
  });
}
Harry Adel
@harryadel
Aug 14 2016 05:19
"http://api.openweathermap.org/data/2.5/weather?lat=" + position.coords.latitude + "&lon=" + position.coords.longitude + "&APPID=e91dd5acc86da15fa61b7a10383a945c
@2cool4school here's the call using my own key
NixonRichard
@NixonRichard
Aug 14 2016 05:19
@Harry97 how to open my pen in debug mode ?
Rita Alfonso
@alfonsotech
Aug 14 2016 05:19
^
Harry Adel
@harryadel
Aug 14 2016 05:19
you just add a new parameter then insert your own key
Jerzz
@2cool4school
Aug 14 2016 05:19
@Harry97 Okay, thanks buddy!
CamperBot
@camperbot
Aug 14 2016 05:19
:warning: could not find receiver for harry97
2cool4school sends brownie points to @harry97 :sparkles: :thumbsup: :sparkles:
Harry Adel
@harryadel
Aug 14 2016 05:20
@NixonRichard click on the change view tab
@2cool4school glad I was of a use to you ^^
NixonRichard
@NixonRichard
Aug 14 2016 05:20
change to what /
editor view ?
Harry Adel
@harryadel
Aug 14 2016 05:21
at the top right corner of your screen you shall find a tab called "Change view" click on it to open up debug mode
NixonRichard
@NixonRichard
Aug 14 2016 05:21
yes i see that
but there s no debug mode
Harry Adel
@harryadel
Aug 14 2016 05:22
@2cool4school Keep in mind you can add new parameters to change the callback you get
@NixonRichard that's because you haven't forked it yet
fork it first
it looks like tis
Jerzz
@2cool4school
Aug 14 2016 05:22
@Harry97 Do you happen to know why I would get an error: Unauthorized?
Harry Adel
@harryadel
Aug 14 2016 05:23
@2cool4school like units=imperial
NixonRichard
@NixonRichard
Aug 14 2016 05:23
use https@ @2cool4school
Harry Adel
@harryadel
Aug 14 2016 05:23
@NixonRichard +1
yeah that's how it looks like
you don't need to show it to me I want you to open up the console while you are at it
NixonRichard
@NixonRichard
Aug 14 2016 05:24
but i still cant search
Harry Adel
@harryadel
Aug 14 2016 05:24
and try to search for something to see what console.log outputs for ya
what do you mean you can't search ??
NixonRichard
@NixonRichard
Aug 14 2016 05:25
u mean open the pen u tidied up for me
or my pen ?
Jerzz
@2cool4school
Aug 14 2016 05:25
@NixonRichard I tried the https:// prefix rather than http://
Harry Adel
@harryadel
Aug 14 2016 05:25
the one I tidied up for ya
in debug mode please
and open up the console using ctrl+shift+i
NixonRichard
@NixonRichard
Aug 14 2016 05:25
okay
Harry Adel
@harryadel
Aug 14 2016 05:26
@2cool4school did it work?
NixonRichard
@NixonRichard
Aug 14 2016 05:26
it looks pretty weird
Jerzz
@2cool4school
Aug 14 2016 05:26
@Harry97 I didn't understand your last message tbh
but the https:// thing didnt work
Harry Adel
@harryadel
Aug 14 2016 05:26
@2cool4school well send us your full codepen not just snippet of it
and I'll try to fork it and see what I can do
NixonRichard
@NixonRichard
Aug 14 2016 05:27
hmm hmm
Harry Adel
@harryadel
Aug 14 2016 05:27
@NixonRichard not really if you kept clicking you shall find your results somewhere into it
now all you have to do is 2 things
first loop through it and second output every result
NixonRichard
@NixonRichard
Aug 14 2016 05:29
loop through the results ?
usin for loop ?
Harry Adel
@harryadel
Aug 14 2016 05:29
you can use for loop
Jerzz
@2cool4school
Aug 14 2016 05:29
@Harry97 That's the only code I have, actually. Also I don't know how to share the entire codepen... >.> sorry for being a noob.
NixonRichard
@NixonRichard
Aug 14 2016 05:29
or while loop ?
Harry Adel
@harryadel
Aug 14 2016 05:29
or you can use something called "each"
NixonRichard
@NixonRichard
Aug 14 2016 05:29
what is it ?
Harry Adel
@harryadel
Aug 14 2016 05:30
@2cool4school just copy paste you codepen address to share it
NixonRichard
@NixonRichard
Aug 14 2016 05:30
copy and paste ur codepen s url
Jerzz
@2cool4school
Aug 14 2016 05:31
It actually just started working?? That was bizarre. I changed something, changed it back and it worked..
Harry Adel
@harryadel
Aug 14 2016 05:31
@2cool4school maybe you had a typo
NixonRichard
@NixonRichard
Aug 14 2016 05:31
hmm hmm
Harry Adel
@harryadel
Aug 14 2016 05:32
@NixonRichard you can use any type of loops you want
it's just up to ya
NixonRichard
@NixonRichard
Aug 14 2016 05:32
no i want the each one
it looks advanced
and cool
but why didnt they teach it ?
they only teach for loop and while loop
Harry Adel
@harryadel
Aug 14 2016 05:33
@NixonRichard did you skip some projects?
Jerzz
@2cool4school
Aug 14 2016 05:33
@Harry97 It's definitely possibruh. Thanks for the help though. I love this site because of how much support there is in the chat room
CamperBot
@camperbot
Aug 14 2016 05:33
2cool4school sends brownie points to @harry97 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for harry97
Harry Adel
@harryadel
Aug 14 2016 05:33
because from the get go they make sure to let you know you have to search for what you want
@2cool4school yeah me too just make sure when you get good at coding to help out those who are starting out ;)
NixonRichard
@NixonRichard
Aug 14 2016 05:35
nope i just didnt finish the weather app
Harry Adel
@harryadel
Aug 14 2016 05:36
well yeah I know you might hate them for that at first but believe you are going to be grateful at how they taught you search and google for information
NixonRichard
@NixonRichard
Aug 14 2016 05:38
oh yeah maybe
so i have to do osmething like this in the callback function ?
$each.(result)
$.each(result)
Harry Adel
@harryadel
Aug 14 2016 05:40
keep in mind you have to get the title and the description
NixonRichard
@NixonRichard
Aug 14 2016 05:40
this keep getting wierd and wierder
how to get them though ?
kennyhlim
@kennyhlim
Aug 14 2016 05:41
hi there! i'm doing the tribute challenge/project and i've spent several hours researching how to center the text to mimic the example project. After researching and experimenting, I think i finally got it to work but it seems to mess with my container - any tips/pointers on how to fix this? http://codepen.io/kennyhlim/pen/pbGwwr
JD Tadlock
@jdtdesigns
Aug 14 2016 05:41
$.each(obj, function(index, item) {
// console.log(item.title);
});
@NixonRichard Might be what you need
kennyhlim
@kennyhlim
Aug 14 2016 05:42
example project that i am trying to mimic: https://codepen.io/FreeCodeCamp/full/NNvBQW/.
NixonRichard
@NixonRichard
Aug 14 2016 05:42
hmm
JD Tadlock
@jdtdesigns
Aug 14 2016 05:43
@kennyhlim You're missing a closing div
<h5 class="text-center">Michael Jordan posing with his 6 NBA championship rings</h5>
    </div>
// right here
Harry Adel
@harryadel
Aug 14 2016 05:43
@jdtdesigns +1
kennyhlim
@kennyhlim
Aug 14 2016 05:45
@jdtdesigns - thanks but is there a way to put the container around the entire document?
CamperBot
@camperbot
Aug 14 2016 05:45
kennyhlim sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 596 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Harry Adel
@harryadel
Aug 14 2016 05:45
@kennyhlim try text-align: center;
or class="center-block" if you are using Bootstrap
Also don't forget to add body { margin-top: 50px; }
in order to add some space before the jumbotron
kennyhlim
@kennyhlim
Aug 14 2016 05:47
yup yup -thanks was going to do that last
JD Tadlock
@jdtdesigns
Aug 14 2016 05:48
@kennyhlim depends on what you want to do
kennyhlim
@kennyhlim
Aug 14 2016 05:48
i guess to rephrase my question...i have a div class <div class="col-xs-12 col-sm-10 col-md-8 col-sm-offset-1 col-md-offset-2"> to center the text and that seems to do the job as i change between the sizes
JD Tadlock
@jdtdesigns
Aug 14 2016 05:48
you can put a container anywhere you please
kennyhlim
@kennyhlim
Aug 14 2016 05:48
i close that out after my second closing </ul> tag near the bottom
JD Tadlock
@jdtdesigns
Aug 14 2016 05:48
@kennyhlim it's really as simple as text-align: center;
using bs to center text is a huge bloated waste
that example portfolio is super easy without bs imo
kennyhlim
@kennyhlim
Aug 14 2016 05:51
ahhh ok gotcha
ill play around with that some more
Harry Adel
@harryadel
Aug 14 2016 05:51
@kennyhlim if you want to center something using bootstrap col all you have to do is set an offset equal to half of the remaining size of the row
kennyhlim
@kennyhlim
Aug 14 2016 05:51
thanks!!!!!1
Harry Adel
@harryadel
Aug 14 2016 05:51
like col-md-2 col-md-offset-5
kennyhlim
@kennyhlim
Aug 14 2016 05:52
@Harry97
oops sorry
@Harry97 - i did do that in the code but when i insert that, it centers the text but the messes with the container in the bg...
when i inserted a div with columns and offsetting columns in the informational area, the gray bg that used to cover all the information only ends up covering half of it
Harry Adel
@harryadel
Aug 14 2016 05:58
@kennyhlim I don't mean to be rude but where are you specifically stuck right now?
or you are just asking about things that were confusing to you?
kennyhlim
@kennyhlim
Aug 14 2016 05:59
sorry - i know i may not be 100% clear in my ask...
Harry Adel
@harryadel
Aug 14 2016 06:00
lol it's ok I just wanna where are you standing in order for me to help you better
kennyhlim
@kennyhlim
Aug 14 2016 06:01
when i add the bootstrap code to center (ex col-sm-10 col-sm-offset-2 etc) it does indeed center the texdt like how i would want...
however, when i add that, it seems to mess with the formatting of the bg....
with the bootstrap code the entire page sit in a container - which is currently a gray background
*without that bootstrap code
when i insert it, the text centers but half my code sits in the gray background and the bottom half is under a white background
i guess im trying to see if i'm missing something in my code - i checked and all the starting divs have closing divs
so confused as to why when i add the bootstrap code to center, the rest of the page gets all weird
Harry Adel
@harryadel
Aug 14 2016 06:05
hmm
is this how you want it to be?
http://codepen.io/Hadouken/pen/QEYqam
Bhushan Patil
@mrpatil007
Aug 14 2016 06:05
use container-fluid
@kennyhlim
kennyhlim
@kennyhlim
Aug 14 2016 06:06
@mrpatil007 - just tried that and didn't work
@Harry97 - can you see this page
Harry Adel
@harryadel
Aug 14 2016 06:07
yup
oh the jumbotron ends right after the thumbnail
and you want it to cover the whole thing
kennyhlim
@kennyhlim
Aug 14 2016 06:07
so from what i am seeing - starting from careeer timeline section - the gray bg area stops and it becomes white
yup, want it to cover the whole thing
that only happens when i add the (div) bootstrap code to center the text - when i remove the div, the gray re-covers the whole area
click the seconds one :D
Sorin Ruse
@sorinr
Aug 14 2016 06:20
@Harry97 move what u have in the js part to css part
Harry Adel
@harryadel
Aug 14 2016 06:20
@sorinr sorry but what are you talking about?
Sorin Ruse
@sorinr
Aug 14 2016 06:21
@Harry97 about the last pen you have posted. you have put a css class style into the js part
kennyhlim
@kennyhlim
Aug 14 2016 06:21
@Harry97 so looks like my mistake was making a div class=thumbnail?
Harry Adel
@harryadel
Aug 14 2016 06:21
@sorinr OH SHIT
lol
kenny will fix it :D
@kennyhlim nah you forgot to add class="row"
I did change the thumbnail div out of preference :D
but it has nothing to do it why the jumbotron was out of place
kennyhlim
@kennyhlim
Aug 14 2016 06:23
which is more efficient? or is it matter of preference
Harry Adel
@harryadel
Aug 14 2016 06:24
eh tbh I don't really know I deleted the div that contained the thumbnail class because you can easily include img-thumbnailto your image classes
Bhushan Patil
@mrpatil007
Aug 14 2016 06:24
order of your <div class> is imp
Harry Adel
@harryadel
Aug 14 2016 06:25
so i did it because it felt redundant
also you should've used caption tag
to write underneath the image
kennyhlim
@kennyhlim
Aug 14 2016 06:26
i wasn't aware of the caption tag but i will research and look into that - that part took me some time to figure out too earlier today
@mrpatil007 - thanks for your input - nice to know
CamperBot
@camperbot
Aug 14 2016 06:26
kennyhlim sends brownie points to @mrpatil007 :sparkles: :thumbsup: :sparkles:
:cookie: 172 | @mrpatil007 |http://www.freecodecamp.com/mrpatil007
kennyhlim
@kennyhlim
Aug 14 2016 06:27
@Harry97 thanks for putting up with a newb - you've been most helpful - have a great day / night (whereever you may be from! :) )
CamperBot
@camperbot
Aug 14 2016 06:27
kennyhlim sends brownie points to @harry97 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for harry97
Harry Adel
@harryadel
Aug 14 2016 06:27
It's really simple you should include right now
@kennyhlim lol thanks alot you too
CamperBot
@camperbot
Aug 14 2016 06:27
harry97 sends brownie points to @kennyhlim :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for kennyhlim
Bhushan Patil
@mrpatil007
Aug 14 2016 06:28
@kennyhlim use figcaption
tag
Harry Adel
@harryadel
Aug 14 2016 06:28
@mrpatil007 +1
kennyhlim
@kennyhlim
Aug 14 2016 06:28
<figcaption class="text-center">Michael Jordan posing with his 6 NBA championship rings</h5>
</figcaption>
???
Bhushan Patil
@mrpatil007
Aug 14 2016 06:30
<figcaption class="text-center well">Michael Jordan posing with his 6 NBA championship rings</h5> </figcaption>
look better
kennyhlim
@kennyhlim
Aug 14 2016 06:31
errr i meant to remove the </h5>
Harry Adel
@harryadel
Aug 14 2016 06:32
@mrpatil007 eh a bit too wide?
kennyhlim
@kennyhlim
Aug 14 2016 06:33
i prefer <figcaption class="text-center">...
Bhushan Patil
@mrpatil007
Aug 14 2016 06:33
@Harry97 then manage its grid
@kennyhlim as u feel good
kennyhlim
@kennyhlim
Aug 14 2016 06:34
thanks again @Harry97 @mrpatil007
CamperBot
@camperbot
Aug 14 2016 06:34
kennyhlim sends brownie points to @harry97 and @mrpatil007 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for harry97
:warning: kennyhlim already gave mrpatil007 points
Bhushan Patil
@mrpatil007
Aug 14 2016 06:35
@kennyhlim most welcome
Jerzz
@2cool4school
Aug 14 2016 06:39
On the free "Open Weather API" what are the units of measurement being used??? 296.xx isn't Celsius or Fahrenheit right
Bhushan Patil
@mrpatil007
Aug 14 2016 06:40
@2cool4school what ?

@2cool4school use this


function convertToF(celsius) {
  var fahrenheit = 0;
  // Only change code below this line
  fahrenheit = celsius * 1.8 + 32;

  // Only change code above this line
  return fahrenheit;
}

// Change the inputs below to test your code
convertToF(-30);

to convert Celsius to Fahrenheit

Harindu Dilshan ( Kavinda Pitiduwa Gamage)
@harindu95
Aug 14 2016 06:43
@2cool4school it use kelvin by default
Oleg
@designofhumanity
Aug 14 2016 06:43
Bhushan Patil
@mrpatil007
Aug 14 2016 06:45
@designofhumanity good simple but clear
Sorin Ruse
@sorinr
Aug 14 2016 06:50
@designofhumanity i would change in css this class: .online, .offline { line-height: 50px; font-size: 20px; display: inline-flex; align-items: center; } and i would add in the js code same <a> tags for offline as for the one online. then i will add some padding left to the <a> tags to move them apart from the logos
Oleg
@designofhumanity
Aug 14 2016 06:56
@sorinr thanks google to flexbox
Jerzz
@2cool4school
Aug 14 2016 07:06
hey guys how would i make a button switch between two states? instead of one way trip type thing how can i make it go back and forth ?
Oleg
@designofhumanity
Aug 14 2016 07:10
@2cool4school var isPressed= true; and Google box-shadow I think
Rita Alfonso
@alfonsotech
Aug 14 2016 07:27
@2cool4school I think you can use the .toggle() method.
FavoriteFave
@FavoriteFave
Aug 14 2016 08:14

hey. I'm a beginner at javascript and im trying to programm a tic tac toe game, right now without a minmax algorithm just trying to get the basic functionalities down.

right now if i have 3 in a row the third icon doesnt get set and i want to highlight the 3 in a row with a color change, which doesnt work either

i knwo the code is really messy but if anyone could look at it and help me with why that is, i would be really happy 😄

http://codepen.io/FavoriteFave/pen/GZdzGX

labeebahmad414
@labeebahmad414
Aug 14 2016 08:16
I am trying to create a calculator that looks something like this http://www.staples-3p.com/s7/is/image/Staples/s0693192_sc7?$splssku$. Problem is how do I make a div which has uneven width. Like it is bit less wide on the top compared to bottom.
I am talking about the calculator on the left in the pic.
Darth Skywalker
@adityaparab
Aug 14 2016 08:34

If anyone wants to play around with ES6, I've created a ES6+Webpack starter seed. just clone it locally,

do npm install and run npm run dev then point your browser to localhost:8888

make your changes and see it live reload :D

https://github.com/adityaparab/Webpack-ES6-Seed

Leena
@leena-d
Aug 14 2016 09:21
Can someone give me some feedback on this? Like should I add or change anything?
https://codepen.io/leena-d/pen/ZOwZov
Rita Alfonso
@alfonsotech
Aug 14 2016 09:42
@leena-d :thumbsup:
Leena
@leena-d
Aug 14 2016 09:48
@alfonsotech thanks
CamperBot
@camperbot
Aug 14 2016 09:48
leena-d sends brownie points to @alfonsotech :sparkles: :thumbsup: :sparkles:
:cookie: 382 | @alfonsotech |http://www.freecodecamp.com/alfonsotech
Rita Alfonso
@alfonsotech
Aug 14 2016 09:51
@leena-d You might like to add a border around the image to make it stand out more. Also, have you tried styling the spaces in between you elements?
I like your subject :)
Gaurav Tolani
@Gauravtolani
Aug 14 2016 09:54
can anyone help me with random quote generator?
the javascript function is not printing anything..
Leena
@leena-d
Aug 14 2016 10:09
@alfonsotech thanks but what do you mean styling the spaces between elements?
CamperBot
@camperbot
Aug 14 2016 10:09
leena-d sends brownie points to @alfonsotech :sparkles: :thumbsup: :sparkles:
:warning: leena-d already gave alfonsotech points
Dion Hobdy
@hobdydion
Aug 14 2016 10:14
Hey, is there anyone that can help who is still awake?
Leena
@leena-d
Aug 14 2016 10:14
@hobdydion what do you need help with?
Dion Hobdy
@hobdydion
Aug 14 2016 10:15
I am having trouble with my navbar for my portfolio. I'll send a link, the issue is quite obvious.
Thanks Paige. :)
Rita Alfonso
@alfonsotech
Aug 14 2016 10:17
@leena-d hey, I lost the link to your tribute page. I think what I meant was that the title that sits under the photo is pretty close to the bottom of the photo. More space there might look good. But if you pay attention to the spaces between things, you can improve the balance and look of the page overall. But hey, these are just details. Congrats on getting your tribute page up!
@hobdydion Love that font!
Dion Hobdy
@hobdydion
Aug 14 2016 10:18
@alfonsotech lol Thank you. Google fonts never fails to impress.
CamperBot
@camperbot
Aug 14 2016 10:18
hobdydion sends brownie points to @alfonsotech :sparkles: :thumbsup: :sparkles:
:cookie: 384 | @alfonsotech |http://www.freecodecamp.com/alfonsotech
Dion Hobdy
@hobdydion
Aug 14 2016 10:19
Anyone knows of a fix for my navbar?
Leena
@leena-d
Aug 14 2016 10:20
@hobdydion i wish i could help but i honestly haven't gotten that far myself. sorry :(
Dion Hobdy
@hobdydion
Aug 14 2016 10:20
No problem @leena-d, I appreciate the thought.
Leena
@leena-d
Aug 14 2016 10:21
@hobdydion it looks very nice so far though
Dion Hobdy
@hobdydion
Aug 14 2016 10:22
Thank you. :)
Rita Alfonso
@alfonsotech
Aug 14 2016 10:23
@hobdydion It doesn't look quite right, but first, what is this? <body class="margin-top margin-bottom"> In the meantime I'll fish out my code to see if I can give you some helpful suggestions...
Wojciech Sleziak
@wojtekbb
Aug 14 2016 10:24
hey, anyone can tell me why scrollspy doesn't work properly http://codepen.io/wojtbb/pen/WxPXXW
Rita Alfonso
@alfonsotech
Aug 14 2016 10:24
You navigation should be right at the top of your page, right after your opening body tag. Here is mine from my portfolio, maybe the example will help: ```<!-- NAVIGATION-->
<nav class="navbar navbar-default navbar-fixed-top topnav" role="navigation">
<div class="container topnav">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand topnav" href="#" target="_blank"></a><!--Display Happy day of the week or a philosophy quote -->
</div><!-- /.navbar-header-->
    <div class="collapse navbar-collapse">
      <ul class="nav navbar-nav navbar-right pull-right">
        <li><a href="#home">Home</a></li>
        <li><a href="#about">About</a></li>
        <li><a href="#projects">Projects</a></li>
        <li><a href="#contact">Contact</a></li>
      </ul><!--/.nav navbar-nav navbar-right -->
    </div><!-- /.collapse navbar-collapse-->    
  </div><!-- /.container topnav-->
</nav><!-- NAV BAR END-->```
You navigation should be right at the top of your page, right after your opening body tag. Here is mine from my portfolio, maybe the example will help:
<!-- NAVIGATION-->
    <nav class="navbar navbar-default navbar-fixed-top topnav" role="navigation">
      <div class="container topnav">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand topnav" href="#" target="_blank"></a><!--Display Happy day of the week or a philosophy quote -->
        </div><!-- /.navbar-header-->

        <div class="collapse navbar-collapse">
          <ul class="nav navbar-nav navbar-right pull-right">
            <li><a href="#home">Home</a></li>
            <li><a href="#about">About</a></li>
            <li><a href="#projects">Projects</a></li>
            <li><a href="#contact">Contact</a></li>
          </ul><!--/.nav navbar-nav navbar-right -->
        </div><!-- /.collapse navbar-collapse-->    
      </div><!-- /.container topnav-->
    </nav><!-- NAV BAR END-->
Dion Hobdy
@hobdydion
Aug 14 2016 10:26
@alfonsotech Thanks for the help dude. I use the margin-top and margin-bottom classes to keep the page compact.
CamperBot
@camperbot
Aug 14 2016 10:26
hobdydion sends brownie points to @alfonsotech :sparkles: :thumbsup: :sparkles:
:warning: hobdydion already gave alfonsotech points
Faisal Zulfiqar
@faisal1337
Aug 14 2016 10:26
Guys I have this form in Contact Me section. And I want the text area to expand as the user starts writing. The height should expand as the user write instead of becoming a scroll-able window. Any way I can do it?
Rita Alfonso
@alfonsotech
Aug 14 2016 10:27
<-- dudette : ) @hobdydion
Dion Hobdy
@hobdydion
Aug 14 2016 10:27
I apologise. dudette*
apologize* It's 3 am over here. lol
Rita Alfonso
@alfonsotech
Aug 14 2016 10:27
Anyhoos, @hobdydion , it is unusual to style body tags, especially in the html.
Dion Hobdy
@hobdydion
Aug 14 2016 10:27
hhmm Really?
Rita Alfonso
@alfonsotech
Aug 14 2016 10:28
No problem, it's common to get called a dude or a guy on here.
This message was deleted
@hobdydion That's what I've been taught. But if it works for you...
Dion Hobdy
@hobdydion
Aug 14 2016 10:32
Do you have any pens of the code you provided?
Rita Alfonso
@alfonsotech
Aug 14 2016 10:40
I have my code on github- don't really use codepen anymore. It's here: https://github.com/alfonsotech/alfonso-tech and live here: https://alfonsotech.github.io/alfonso-tech/
I provide my code as an example, but it's not exactly what you are trying to do. For example, I see you are trying to get a drop down menu. You might want to find a nav system that you like and use it as a model. Start by just typing it into your code, them play with it, break it, rework it, until you feel that you understand how it works. @hobdydion
Gaurav Tolani
@Gauravtolani
Aug 14 2016 10:47
can anybody help me with the random quote generator..
my javascript function is not printing anything...plz convey what should i add in the quick links of the javascript sections
Dion Hobdy
@hobdydion
Aug 14 2016 10:48
Alright @alfonsotech Thanks. :)
CamperBot
@camperbot
Aug 14 2016 10:48
hobdydion sends brownie points to @alfonsotech :sparkles: :thumbsup: :sparkles:
:warning: hobdydion already gave alfonsotech points
Rita Alfonso
@alfonsotech
Aug 14 2016 10:49
@hobdydion :thumbsup:
Leena
@leena-d
Aug 14 2016 10:50
Rita Alfonso
@alfonsotech
Aug 14 2016 10:50
@Gauravtolani It is printing out "Ready!" to your console, so what you have there is working. SO far so good!
@leena-d Oh yeah, veery nice!
Gaurav Tolani
@Gauravtolani
Aug 14 2016 10:52
@alfonsotech not printing anything..where did you see ready?
Rita Alfonso
@alfonsotech
Aug 14 2016 10:52
@leena-d thank you. :thumbsup:
CamperBot
@camperbot
Aug 14 2016 10:52
alfonsotech sends brownie points to @leena-d :sparkles: :thumbsup: :sparkles:
:cookie: 119 | @leena-d |http://www.freecodecamp.com/leena-d
Rita Alfonso
@alfonsotech
Aug 14 2016 10:53
@Gauravtolani On the bottom of your codepen window, there are some buttons. Second button from the left along the bottom there says "console". Click that to open your console viewer, and there you will see your "ready!" logged.
Gaurav Tolani
@Gauravtolani
Aug 14 2016 10:55
ok..got it.and one more issue
can we use any api for the random quote generator? @alfonsotech
Leena
@leena-d
Aug 14 2016 10:55
@alfonsotech :thumbsup: thanks
CamperBot
@camperbot
Aug 14 2016 10:55
leena-d sends brownie points to @alfonsotech :sparkles: :thumbsup: :sparkles:
:cookie: 385 | @alfonsotech |http://www.freecodecamp.com/alfonsotech
Rita Alfonso
@alfonsotech
Aug 14 2016 10:57
You don't need to use an API, but can build your own object of quotes to draw from. But if you want to use a quote api and know of one, it's up to you. That goes beyond what the assignment calls for tho. @Gauravtolani
APIs are fun, but can be challenging.
@Gauravtolani Do you know how to get started, or do you need some help?
Rita Alfonso
@alfonsotech
Aug 14 2016 11:05
Goodnight Campers, till tomorrow!
Gaurav Tolani
@Gauravtolani
Aug 14 2016 11:07
@alfonsotech i need some help..i am good with the html css part..but still confused how to start with the js part..
can you guide me..how do i start? @alfonsotech
Rita Alfonso
@alfonsotech
Aug 14 2016 11:08
@Gauravtolani Sure. Do you know how how to write an array? Start by writing an array of quotes in your js section. Just make up three quotes to start with, or find three quotes you want to use, and put them in the array.
Let me know when you've done this...
Gaurav Tolani
@Gauravtolani
Aug 14 2016 11:13
done..
Rita Alfonso
@alfonsotech
Aug 14 2016 11:13
I think I have to get to bed now. It's after 4am here. But what you want to do is iterate through your array...
excellent
now ?
just selected anyone element of the array through math.random()
Rita Alfonso
@alfonsotech
Aug 14 2016 11:14
so, now you want to use jQuery to put the first quote into the div where you want it to show up. If you can do that, the rest is just details.
Gaurav Tolani
@Gauravtolani
Aug 14 2016 11:14
i dont know that stuff.. :-(
so i need to store the quote variable and pass it to the div that should print the quote..
Rita Alfonso
@alfonsotech
Aug 14 2016 11:15
Okay. Do you know how to select the first item in an array?
Gaurav Tolani
@Gauravtolani
Aug 14 2016 11:15
yes.
m good in c++..just new with json and all..
Rita Alfonso
@alfonsotech
Aug 14 2016 11:16
good. So you put that into your div using either javascript or jquery. I think jquery is easiest.
Here is the syntax
$('the div you are wnating to target to put your quote into').text('your array name + itemxamarin/xamarin-android@a16673d');
Gaurav Tolani
@Gauravtolani
Aug 14 2016 11:17
ok..will do it.. thank you @alfonsotech
CamperBot
@camperbot
Aug 14 2016 11:17
gauravtolani sends brownie points to @alfonsotech :sparkles: :thumbsup: :sparkles:
:cookie: 386 | @alfonsotech |http://www.freecodecamp.com/alfonsotech
Rita Alfonso
@alfonsotech
Aug 14 2016 11:18
Let me take a look at what you've done so far and see if I can give you specifics
before i go to bed
okay, don't forget your semi-colons. quote[0] = 'quote number 1' should be ```quotexamarin/xamarin-android@a16673d = 'quote number 1';````
Weird that it's doing that...
anyhooos
Gaurav Tolani
@Gauravtolani
Aug 14 2016 11:20
ok.. m on it..
:-)
Rita Alfonso
@alfonsotech
Aug 14 2016 11:20
Do you wnat your quote to go here: <span id="text"></span>?
Gaurav Tolani
@Gauravtolani
Aug 14 2016 11:21
yes
Rita Alfonso
@alfonsotech
Aug 14 2016 11:21
If so, then $('#text).text( *quotexamarin/xamarin-android@a16673d ). That should put your first quote into your #text span.
*quote[0]
If so, then $('#text).text( quote[0] ). That should put your first quote into your #text span.
Let me check and make sure you have jQuery added to your header....
Gaurav Tolani
@Gauravtolani
Aug 14 2016 11:23
where should i do this..in the printquote() function?
Rita Alfonso
@alfonsotech
Aug 14 2016 11:24
yup, you have jQuery
Well, you are a little ahead of my game. Yes, you could put it into the function, but then don't forget to call the function to make it work.
Gaurav Tolani
@Gauravtolani
Aug 14 2016 11:26
ok..will do it..
thanks for the help...
:-)
its showing error when i am adding the jquery line..
Rita Alfonso
@alfonsotech
Aug 14 2016 11:29
I would try to get a quote (any quote) to show up in your #text span, then work on how to select different quotes to show up (you can either iterate through your array, or use Math method as you have begin to do). Finally, you can work on how to trigger a new quote to be inserted into the #text box (you'll probably need a button). But there are different parts that you cna work on one by one.
FavoriteFave
@FavoriteFave
Aug 14 2016 11:29
can someone help me with my tic-tac-toe game ?
Rita Alfonso
@alfonsotech
Aug 14 2016 11:29
Try writing out all the parts you need, then work on them piece by piece.
Gaurav Tolani
@Gauravtolani
Aug 14 2016 11:30
yes..m close to the completing it.. thank you very much @alfonsotech
Rita Alfonso
@alfonsotech
Aug 14 2016 11:30
Okay, I must go to bed now. Sorry to leave you but I must sleep....
CamperBot
@camperbot
Aug 14 2016 11:30
gauravtolani sends brownie points to @alfonsotech :sparkles: :thumbsup: :sparkles:
:warning: gauravtolani already gave alfonsotech points
Oxide Debbarma
@oxide94Git
Aug 14 2016 12:02
Hey friends bootstrap 3.0 does not go together with latest jquery. Where do i get the older version. Or else any other suggestion
NixonRichard
@NixonRichard
Aug 14 2016 12:02
Hi there
Im not a crook
Oxide Debbarma
@oxide94Git
Aug 14 2016 12:03
Hey nixon.
NixonRichard
@NixonRichard
Aug 14 2016 12:04
what s up
Oxide Debbarma
@oxide94Git
Aug 14 2016 12:05
Nthng just stuck with bootstrap and jquery version issue. What about you?
suresh kumar dhayal
@skd060
Aug 14 2016 12:07
can anyone tell me why my code is not working ?

<!DOCTYPE html>

<html>
<head>
<title>Grab Random Quote</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<!--<script type="text/javascript" src="randomQuote.js"></script>-->
<link rel="stylesheet" type="text/css" href="randomQuote.css">
</head>
<body>
<script type="text/javascript">
console.log('hi1');
$(document).ready(function() {
console.log('hi1');
$("#fourth").click(function(event){
console.log('hi');
$.getJSON('randomQuote.json',function(data){
console.log(data.Quote1.length);
var random = Math.floor(Math.random()*data.Quote1.length);
$(.quote2).text(data.Quote1[random].quote);
$(.author).text(data.Quote1[random].autho);



});

});
});
</script>
<div class="center"><h1 id="first">Grab a Random Quote </h1>
<div id="second">
<!--<textarea id="third" rows="6" cols="100">hello</textarea>-->

<div class="quotes">
<span class="quote2">Hello World!</span>
<span class="author">-The World</span>
</div>
<button id="fourth" class="btn; btn-primary">Click</button>
</div>
</div>
</body>
</html>

Quote1 is a array contains some quotes
Eldho.S.Paul
@Eldhosajipaul
Aug 14 2016 12:58
can anyone help me out with the weather app.
Bhushan Patil
@mrpatil007
Aug 14 2016 12:59
@Eldhosajipaul what type of help
Eldho.S.Paul
@Eldhosajipaul
Aug 14 2016 13:00
I'm not getting the proper weather API to proceed with..
Bhushan Patil
@mrpatil007
Aug 14 2016 13:01
post your code pen link
Eldho.S.Paul
@Eldhosajipaul
Aug 14 2016 13:07
@mrpatil007 I have just started my code. No use in posting the link. Can you find out a weather API for me.
Stephen James
@sjames1958gm
Aug 14 2016 13:07
@Eldhosajipaul openWeatherMap is not working for you?
Bhushan Patil
@mrpatil007
Aug 14 2016 13:09
@Eldhosajipaul use yahoo API
Eldho.S.Paul
@Eldhosajipaul
Aug 14 2016 13:14
let me try.. thank you.. @mrpatil007
CamperBot
@camperbot
Aug 14 2016 13:14
eldhosajipaul sends brownie points to @mrpatil007 :sparkles: :thumbsup: :sparkles:
:cookie: 188 | @mrpatil007 |http://www.freecodecamp.com/mrpatil007
sfmajors373
@sfmajors373
Aug 14 2016 14:04
Hello! I was wondering if someone could help me with my portfolio page for a moment?
Bhushan Patil
@mrpatil007
Aug 14 2016 14:05
@sfmajors373 what type of help
sfmajors373
@sfmajors373
Aug 14 2016 14:06
I have been trying to research online but I can not figure out how to make a thumbnail of another webpage and add it to my portfolio.
Bhushan Patil
@mrpatil007
Aug 14 2016 14:07
@sfmajors373 <img src="..." alt="..." class="img-thumbnail">
Moisés Man
@moigithub
Aug 14 2016 14:07
@sfmajors373 thumbnail is just an imagen... use any program to capture image n resize
ie.. print screen,, paste on mspaint, save , upload somewhere and apply to ur src
Bhushan Patil
@mrpatil007
Aug 14 2016 14:08
use this for thumbnail
sfmajors373
@sfmajors373
Aug 14 2016 14:08
@moigithub Oh, so it would work even if the image isn't a url?
Moisés Man
@moigithub
Aug 14 2016 14:09
u need to host that image file on a public server...
Bhushan Patil
@mrpatil007
Aug 14 2016 14:09
or directly pass the url of the image to source
sfmajors373
@sfmajors373
Aug 14 2016 14:09
How do I do that? (Sorry)
Moisés Man
@moigithub
Aug 14 2016 14:11
image hosting servers there r many outthere
Bhushan Patil
@mrpatil007
Aug 14 2016 14:11
like dropbox @sfmajors373
sfmajors373
@sfmajors373
Aug 14 2016 14:11
Ohhhh! Ok, I understand now!
Moisés Man
@moigithub
Aug 14 2016 14:12
postimage.com
imgsafe.com etc.. u only need to google...
u can also use file hosting (not only images) to upload the file
ofc.... some of em dont allow direct linking.. (like put the url on ur src/different page) u need to test/find one u canuse
sfmajors373
@sfmajors373
Aug 14 2016 14:13
@moigithub Thanks! I'll look into some of those. I had heard of that before.
CamperBot
@camperbot
Aug 14 2016 14:13
sfmajors373 sends brownie points to @moigithub :sparkles: :thumbsup: :sparkles:
:star2: 1893 | @moigithub |http://www.freecodecamp.com/moigithub
suresh kumar dhayal
@skd060
Aug 14 2016 14:25
can anybody told me how am i add a json file in code pen ?
baaank
@baaank
Aug 14 2016 14:26
Hi, Im working on TwitchTV JSON api and have a problem. When Im calling $.getJSON('https://api.twitch.tv/cretetion/streams?callback=?... or any other user I always get the same response which is $.getJSON('https://api.twitch.tv/cretetion/streams?callback=? _links: Object kraken: "https://api.twitch.tv/kraken"
Bhushan Patil
@mrpatil007
Aug 14 2016 14:27
@skd060 use add another resources button in setting panel
suresh kumar dhayal
@skd060
Aug 14 2016 14:29
thnx @ndburrus
CamperBot
@camperbot
Aug 14 2016 14:29
skd060 sends brownie points to @ndburrus :sparkles: :thumbsup: :sparkles:
:star2: 1585 | @ndburrus |http://www.freecodecamp.com/ndburrus
Norvin Burrus
@ndburrus
Aug 14 2016 14:29
@skd060 you're welcome! enjoy! :palm_tree:
Sayed Afif
@sayedafif
Aug 14 2016 14:32
needed some help. doing the local weather app. the background image appears below the components instead of behind them.
http://codepen.io/sayedafif/pen/mEwAaL?editors=0110
baaank
@baaank
Aug 14 2016 14:35
I solved my problem, do not bother that question!
encount
@encount
Aug 14 2016 14:46
@sayedafif put it on the body tag - it works in the inspector
jrandallhansen
@jrandallhansen
Aug 14 2016 14:59
@sayedafif Wow that is some complicated CSS you "wrote" lol
it is easier to understand how to fix/change issues when you actually write the code yourself
Sayed Afif
@sayedafif
Aug 14 2016 15:02
@encount thanks
CamperBot
@camperbot
Aug 14 2016 15:02
sayedafif sends brownie points to @encount :sparkles: :thumbsup: :sparkles:
:cookie: 256 | @encount |http://www.freecodecamp.com/encount
Sayed Afif
@sayedafif
Aug 14 2016 15:03
@jrandallhansen i just copied a responsive boiler plate for css "skeleton". i had used in ealier projects. its helpful. but it couldnt be added from the settings. so copied the whole thing down
Bhushan Patil
@mrpatil007
Aug 14 2016 15:07
@sayedafif just add css by bootstrap or link it by using url in setting
jrandallhansen
@jrandallhansen
Aug 14 2016 15:15
anyone have some guidance on best way to center my weather info under the city name? http://codepen.io/jrandall/pen/LkqNWY
I am trying to rewrite this project to work on my design skills. I dont think adjusting padding using pixels is really the best way since on other devices it would probably look ridiculous
Namit Dadlani
@namitdadlani
Aug 14 2016 15:57
Hey!
Is it illegal to use
.SomeClass :hover {.....} in css?
RoliverJavier
@Roliver-Javier
Aug 14 2016 15:57
Illegal?
@namitdadlani
Namit Dadlani
@namitdadlani
Aug 14 2016 15:58
@Roliver-Javier Means wrong :P
Faisal Zulfiqar
@faisal1337
Aug 14 2016 16:00
http://codepen.io/faisal1337/pen/bZONag?editors=1100 Help me to make this section responsive. I have to finish it by tonight.
Namit Dadlani
@namitdadlani
Aug 14 2016 16:00
@jrandallhansen Worked! Thanks!!
CamperBot
@camperbot
Aug 14 2016 16:00
namitdadlani sends brownie points to @jrandallhansen :sparkles: :thumbsup: :sparkles:
:cookie: 322 | @jrandallhansen |http://www.freecodecamp.com/jrandallhansen
Prydwen
@Prydwen
Aug 14 2016 16:07
Hi guys, I'm practicing html/css and am stuck on a positioning issue (can't align two elements on a line) ; does anyone have a second to check it out ? I've spent hours on it and I am slowly losing my mind
Brian Danowski
@mailtruck
Aug 14 2016 16:16
@Prydwen please post in a codepen
Prydwen
@Prydwen
Aug 14 2016 16:17
here it is : https://codepen.io/Prydwen/pen/YWAxLW I'm trying to align the search bar with the Preferences and Languages links, but can't figure it out
I've tried with display:inline-block, with float, with span elements... no success so far. I know it's probably something super easy
Faisal Zulfiqar
@faisal1337
Aug 14 2016 16:22
http://codepen.io/faisal1337/pen/bZONag Somebody please look at this. And help me to make it responsive. Its urgent :/
Joel Santos
@St3ps
Aug 14 2016 16:30
Hello everyone -- I'm trying to use a custom font in codepen but I seem to be unable to make it work
@font-face { font-family: EagleBook; src: url('https://github.com/St3ps/fonts/blob/master/Eagle-Book.otf'); } 


body {
 // font-family: 'Anton', sans-serif;
  font-family: 'EagleBook', sans-serif;

}
@faisal1337 if you're using bootstrap, why not use the nav bootstrap classes? It even has a specific brand class in it, and simple, responsive features you'll want
Faisal Zulfiqar
@faisal1337
Aug 14 2016 16:32
@St3ps Its not about the nav bar. I want those 3 headings beneath to be responsive.
Joel Santos
@St3ps
Aug 14 2016 16:34
when you say responsive, do you mean have it properly aligned regardless of the browser's dimensions?
swapnildaddikar
@swapnildaddikar
Aug 14 2016 16:35
yes
img-resposive means it will reproduce a proper image
one which is clear
as per the dimenstions
Adrienne Vermorel
@adriennevermorel
Aug 14 2016 16:42
Hi everyone, I am working on the FCC weather app, and it works fine on my iphone and tablet (safari and chrome) but it doesn’t work on my mac (safari, chrome and firefox). Do you know what could be the issue? Is it working ok on your end? https://codepen.io/avermorel/pen/jqXJaK
Nico
@nilenn
Aug 14 2016 16:45
Hi I wanted to make a flag as a part of the background of my page http://codepen.io/nilenn/full/LkqNKR/ but the height is different on each part how can i change that?
Norvin Burrus
@ndburrus
Aug 14 2016 16:49
Joel Santos
@St3ps
Aug 14 2016 17:00
@ndburrus Last link doesn't work, shame ...
Norvin Burrus
@ndburrus
Aug 14 2016 17:03
@St3ps we fix. :sparkles: ...my apologies.
Joel Santos
@St3ps
Aug 14 2016 17:10

@ndburrus Nothing to apologize for, awesome.
Humn, so how do i go to implement this?

<FilesMatch "\.(eot|ttf|otf|woff)$">
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin: "*"
</IfModule>
</FilesMatch>

It looks like html...but....it doesn't feel like html? lol

I've looked all over his codepen example and i don't see any of those lines
Norvin Burrus
@ndburrus
Aug 14 2016 17:30
@St3ps i don't have expertise in this subject. however, are you working with fonts hosted on a subdomain? is this a cors issue?
Moisés Man
@moigithub
Aug 14 2016 17:33
@St3ps that looks like server side config.. apache ???
(not applied on client)
Norvin Burrus
@ndburrus
Aug 14 2016 17:34
@moigithub great... thank you... i have a reference (apache). does this look applicable?
CamperBot
@camperbot
Aug 14 2016 17:34
ndburrus sends brownie points to @moigithub :sparkles: :thumbsup: :sparkles:
:star2: 1896 | @moigithub |http://www.freecodecamp.com/moigithub
Moisés Man
@moigithub
Aug 14 2016 17:41
@ndburrus im not sure..but i guess is something with the hosting
@St3ps @ndburrus if i go to this url.. https://github.com/St3ps/fonts/blob/master/Eagle-Book.otf i dont get a font.. but a github page
https://github.com/St3ps/fonts/raw/master/Eagle-Book.otf
try that instead ?? may or may not work :P
or probably try different host
Norvin Burrus
@ndburrus
Aug 14 2016 17:53
@St3ps @moigithub it looks like an otf font type is being used. these may be useful: :sparkles:
Joel Santos
@St3ps
Aug 14 2016 18:23
@moigithub doesn't work, something to do with some over-zealous security protocols i'm not very acquainted with... thanks anyway
CamperBot
@camperbot
Aug 14 2016 18:23
st3ps sends brownie points to @moigithub :sparkles: :thumbsup: :sparkles:
:star2: 1897 | @moigithub |http://www.freecodecamp.com/moigithub
Norvin Burrus
@ndburrus
Aug 14 2016 18:30
@St3ps if it's a CORS issue, these may help: :sparkles:
Darth Skywalker
@adityaparab
Aug 14 2016 19:07

Feedback welcome!

https://adityaparab.github.io/React/calc/

:D (+/- and % buttons are not implemented yet)

Islam Ibakaev
@dagman
Aug 14 2016 19:26
@adityaparab do you have a pen for this project?
Darth Skywalker
@adityaparab
Aug 14 2016 19:26
@dagman No. Let me create it
@dagman : Meanwhile you can check it out on github
Islam Ibakaev
@dagman
Aug 14 2016 19:27
@adityaparab i have recently build calc with react that looks nearly the same
Kunal Gupta
@kunalgupta05
Aug 14 2016 19:28
@kunalgupta05
Hi guys, please check out my Twitch TV project. It took me a long time to complete this as i was busy with something at work but i didn't lose motivation and kept at it. This isn't responsive as i would liked it to be but it does scale well. Do check it out on a desktop/laptop to enjoy its full features. I haven't incorporated full features on mobile version due to lack of time, and i would like to move on.
http://codepen.io/Kunal05/full/VjgXmW/
Islam Ibakaev
@dagman
Aug 14 2016 19:28
@adityaparab this
Darth Skywalker
@adityaparab
Aug 14 2016 19:29
@dagman That's how natice calc on iOS looks
Islam Ibakaev
@dagman
Aug 14 2016 19:30
@adityaparab yep kind of :smile:
Darth Skywalker
@adityaparab
Aug 14 2016 19:30
@dagman How did you get that division sign?
Islam Ibakaev
@dagman
Aug 14 2016 19:31
@adityaparab i didn't remember i stole it from my previous jquery calc
Darth Skywalker
@adityaparab
Aug 14 2016 19:31
lol.
Islam Ibakaev
@dagman
Aug 14 2016 19:32
it's not perfect though some bugs presented
i am quite lazy to fix them :smile:
Darth Skywalker
@adityaparab
Aug 14 2016 19:35
@dagman : I created this codepen for ya
Islam Ibakaev
@dagman
Aug 14 2016 19:37
looks very messy sry man :worried:
Brian Minnick
@Bminnick
Aug 14 2016 19:37
So sorry if some of ya’ll have seen this on another chat room but I’m not sure where to post it for something to help me :-P. Hello all, I have an odd question. I’m trying to add the ability to use social media buttons (through github) and it says I need to add bootstrap-social.css to my project. How do I do this (specifically in codepen). Thanks!
Islam Ibakaev
@dagman
Aug 14 2016 19:38
@adityaparab more components is needed
Darth Skywalker
@adityaparab
Aug 14 2016 19:38
like?
@dagman
Norvin Burrus
@ndburrus
Aug 14 2016 19:45
Brian Minnick
@Bminnick
Aug 14 2016 19:47
Thanks. But in a more general way: I know how to import things if there is a full web address. Is there a way to do it without one?
Norvin Burrus
@ndburrus
Aug 14 2016 19:49
This message was deleted

@Bminnick :sparkles:

they only specified a file name - not the url.
ref: How to use Social Buttons in CodePen

Brian Minnick
@Bminnick
Aug 14 2016 19:52
@ndburrus Woot! Thanks. That was harder than it should have been haha
CamperBot
@camperbot
Aug 14 2016 19:52
bminnick sends brownie points to @ndburrus :sparkles: :thumbsup: :sparkles:
:star2: 1593 | @ndburrus |http://www.freecodecamp.com/ndburrus
Yolanda Granados
@yolandagranados
Aug 14 2016 19:52
This message was deleted
This message was deleted
Norvin Burrus
@ndburrus
Aug 14 2016 19:55
@Bminnick you're welcome! enjoy! :sparkles: you da man! :palm_tree:
Hussein Zaki
@Hussein90
Aug 14 2016 20:20
can anyone help me @all
how to Develop a javascript utility to allow users create website mockups fast and easily.
Ken Haduch
@khaduch
Aug 14 2016 20:23
@Bminnick - if you have a full web server or paid account on codepen, you can put images and js files in subdirectories and refer to them with relative addressing such as "sec='img/my photo.jpg'". But you have to be able to put those resources on the same filesystem.
That should have been "src="
Brian Minnick
@Bminnick
Aug 14 2016 20:25
Thanks @khaduch! I don’t have a paid account unfortunately :’(. I figured it out with the address I recieved earlier, for the most part. I’m still having trouble finding where to put the actual link to my facebook.
CamperBot
@camperbot
Aug 14 2016 20:25
bminnick sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1541 | @khaduch |http://www.freecodecamp.com/khaduch
Brian Minnick
@Bminnick
Aug 14 2016 20:26
oh, jk, lol. I was doing something stupid haha
Ken Haduch
@khaduch
Aug 14 2016 20:42
@Bminnick - okay - hope you got it working. Basically, the key is that if you are referencing a resource (image, CSS file, JS file, etc.) that is coming from an external server, you would use a fully-qualified URL - http:// or https:// with the server URL. Eventually, if you have an ISP account, or a paid CodePen account (for example) you can upload those resources, and build a directory structure with img/myImage1.jpg, img/myImage2.jpg, css/myStyles.css, js/myScript.js and refer to those with that relative addressing. You'll see those common directory names if you do any kind of example site creation tutorial.
Saqib
@Saqibm128
Aug 14 2016 20:43
Hi guys
I'm having trouble with making a Wikipedia Viewer. I get the results and JSON object and parse it correctly, but the page always refreshes on codepen. I see the list of results show up, but it immediately refreshes and i lose it.
can anyone help me?
BobbyB007
@BobbyB007
Aug 14 2016 20:55
Hello all. starting on my portfolio page. I was trying to get the contacts / social media part done. do I need to add font awesome to get the icons?
Ahmed
@HosTilezZz
Aug 14 2016 20:57
@BobbyB007 if you like font awesome icons then yeah why not, notice that you will have to add the following component to your codepen project "http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css"
@BobbyB007 i personally just used the icons available online and used <button><img src="">text</buton>
BobbyB007
@BobbyB007
Aug 14 2016 20:59
@HosTilezZz okay. I will try the standard ones first.
Tyler Conoff
@Yoplay8
Aug 14 2016 21:00
is thier a way for me to add images to my codepen with out copying a link from google images?
BobbyB007
@BobbyB007
Aug 14 2016 21:04
@Yoplay8 I want to know this too.
@HosTilezZz <button><img src="">text</buton> what do i put in the src? how do i get the icon?
Tyler Conoff
@Yoplay8
Aug 14 2016 21:05
@BobbyB007 Are you being sarcastic or serious?
BobbyB007
@BobbyB007
Aug 14 2016 21:08
@Yoplay8 serious. I just googled and copied the image I wanted. i even linked one to my facebook photo album. i have a feeling this is not the correct thing to be doing. I'm guessing we should be uploading the photos to our own site somewhere.
Tyler Conoff
@Yoplay8
Aug 14 2016 21:11
@BobbyB007 I know im kind of annoyed on how a previous project I just coded last week had a google image and now it only displays a white page becasue the image can not be found with the URL I used.
Edgaras Benediktavicius
@edgarascom
Aug 14 2016 21:15
you can use http://pipsum.com/ for dummy images for test projects
Jerzz
@2cool4school
Aug 14 2016 21:21
I have a couple of questions. First, why do no api's just... work? second, how do i make them work.
BobbyB007
@BobbyB007
Aug 14 2016 21:22
@edgarascom thanks..
CamperBot
@camperbot
Aug 14 2016 21:22
bobbyb007 sends brownie points to @edgarascom :sparkles: :thumbsup: :sparkles:
:cookie: 15 | @edgarascom |http://www.freecodecamp.com/edgarascom
Michael Sagar
@Rooked1
Aug 14 2016 21:24
Hi,looking for some help, Random Quote Generator, I am totally stuck on how to add a paragraph from my codepen into a tweet, Google has not been my friend with this. Does anyone have any links to any sites/reference that will help?
Meadows1
@Meadows1
Aug 14 2016 21:27
Is this the right area for beginners? Video says sublime text is free, but, just got hit up for $70. Is it free or $70?
Oops wrong coding class....
James Hall
@James-H33
Aug 14 2016 21:29
@Meadows1 Should be free.. but perhaps things have changed. You can use Atom Text Editor if you'd like.
lemonpepper512
@lemonpepper512
Aug 14 2016 21:29

Hello everyone! I need some advice.
I'm working on my Tribute Page and I can't understand why my image won't show up?

<div class="thumbnail">
<img src="http://imgur.com/a/6ruwO" alt="polar family">
<div class="caption">
A mother and her cubs
</div>

James Hall
@James-H33
Aug 14 2016 21:30
@lemonpepper512 you're link url is wrong: http://i.imgur.com/c4PxEFX.jpg
lemonpepper512
@lemonpepper512
Aug 14 2016 21:30
Oh, that's weird haha thank you! :)
James Hall
@James-H33
Aug 14 2016 21:31
@lemonpepper512 no problem! :)
Meadows1
@Meadows1
Aug 14 2016 21:32
@James-H33. Thanks for alternative, it is indeed free here in code camp, but, I am also in aonother class that requires you to download it...logged into wrong class for the question...yet still got helped...so thx again.
CamperBot
@camperbot
Aug 14 2016 21:32
meadows1 sends brownie points to @james-h33 :sparkles: :thumbsup: :sparkles:
:cookie: 46 | @james-h33 |http://www.freecodecamp.com/james-h33
James Hall
@James-H33
Aug 14 2016 21:34
@Meadows1 No problem! :)
Jerzz
@2cool4school
Aug 14 2016 22:22
guys do i have to use CORS to make api's work??
Manuel Tancoigne
@mtancoigne
Aug 14 2016 22:27
@2cool4school which api ?
Jerzz
@2cool4school
Aug 14 2016 22:38
@mtancoigne The wikipedia one, but I looked up an ajax example rather than using the simple jquery example from the section before the challenges. ive successfully accessed the api, thanks though!
CamperBot
@camperbot
Aug 14 2016 22:38
2cool4school sends brownie points to @mtancoigne :sparkles: :thumbsup: :sparkles:
:cookie: 446 | @mtancoigne |http://www.freecodecamp.com/mtancoigne
Stephen James
@sjames1958gm
Aug 14 2016 22:41
@2cool4school If you are using jquery it can help you around CORS with JSONP
I just finished by TIC TAC TOE game (I think ) rewritten in React.
http://codepen.io/silgarth/full/RRZqAq/
Jerzz
@2cool4school
Aug 14 2016 22:48
@sjames1958gm i used jsonp with ajax, adding p on the end of format=json didnt work in my jquery call... also about yoru tic tac toe game, does it have multiplayer functionality?
Stephen James
@sjames1958gm
Aug 14 2016 22:57
@2cool4school Only vs. the computer.
TheRenaissanceMan3
@TheRenaissanceMan3
Aug 14 2016 22:58
Anyone here with a good understanding of buddypress on Wordpress? Looking for advice!
Jerzz
@2cool4school
Aug 14 2016 23:04
@sjames1958gm I see.