Hello, someone has done the camper news project and had problems converting the unix time stamp to date?
I'm trying to convert it using javascript Date object, but I think I have to remove the last three digits. If I don't remove them I got a date into the future
Removing the las three digits in an online conversion tool works ok, I got the correct date, but when I remove the las three digits and create a new Date object I got 1/1/70
@mutantspore Huh, I never thought Jumbotron bootstrap was causing the problem. Thank you very much for the pork. It does the job!
swoozeki sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1093 | @mutantspore | http://www.freecodecamp.com/mutantspore
So, Jumbotron really only affects the appearance. I thought it'd aid in the responsiveness of the website, so I was adamant on not changing it
@Swoozeki jumbotron is for a very specific purpose, making a large “banner” type heading for your web page…. I have no idea of teh consequences of your use of it so I just stepped to one side lol.
in my calulator
if i set a value inside of a function, how do i also set it outside the function
Hey guys. I'm working on the weather app and I'm wondering if anyone ran into an issue with the amount of API calls these weather API's allow. Since CodePen auto-updates it's making a ton of calls and I keep getting e-mails that say that I'm going over my limit. It also doesn't help that my code uses an API call inside an API call. :worried:
@FatTone225 I used the Open Weather Map api, i think you’ll be ok with that. I do understand what you are saying though. You can either develop locally and just paste it all to codePen when you have finsihed or I think there is a CodePen option to turn off the auto up date
@mutantspore I thought about the possibility of turning off that auto update. Hopefully there is a way to do that and then manually run the code when I want. I just don't want to code it all then get my API key banned or something. lol
@FatTone225 yes it’s under Behavior in teh settings. you can have a RUN button instead of auto-preview on code change
@mutantspore Thanks!
fattone225 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1094 | @mutantspore | http://www.freecodecamp.com/mutantspore
what is a good refence site for showing you all css that you can use
codingducky sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1095 | @mutantspore | http://www.freecodecamp.com/mutantspore
hi guys, I just started worked on my weather app and I signed up for an API key but when I call it it says invalid API key... this is my JSON link... any ideas what's wrong? Thanks.
http://api.openweathermap.org/data/2.5/weather?q=London&APIID=95d5498364c9638ec3b29a7faf0d1df8
http://api.openweathermap.org/data/2.5/weather?q=London&APIID=95d5498364c9638ec3b29a7faf0d1df8
hey guys, i'm pretty well finished up with my portfolio. anyone wanna check it out let me know what you think. Maybe something you see wrong or something needs to be changed?
http://codepen.io/andrewchar/pen/NxLeje?editors=1100
http://codepen.io/andrewchar/pen/NxLeje?editors=1100
one thing ive been trying to do but cant for the life of me get is hover effects on my navbav to work. i wanted to have the text color change on hover
@andrewchar Nice work! It's clean, responsive and I see you got your css filter issue figured out.
one thing i wanna do with is have a scroll effect. so when you start scrolling from the top of the page. it looks like the picture is not moving but the page is moving up
@mutantspore sure, there's not much there, I'm just getting started but I wanted to get any weather info first http://codepen.io/ninja-ml/pen/PZyYwL
@andrewchar On my browser when I click the navigation buttons the nav bar sits on the headers.
Should the nav bar be a little bit above the headers?
@ninja-ml from what you posted earleir it looks like you have APIID instead of APPID
@mynameissal oh i see what you mean. yeah thats something i also have been looking into. im not sure how to fix that yet
@mynameissal its kind of like its not recognizing that there is a navbar there and its scrolling it to the top of the page instead of bellow the nacbar
@mynameissal maybe the js code is off
@andrewchar You might like to take a look at @petajamaja 's portfolio. She isn't quite finished with it, but she implmented something similar to what you are talking about. You can find it here
@andrewchar add
padding-top: 50px; to your body tag. but not both html and body
Wow, you guys are all doing so much cool stuff lol and I'm sitting here getting excited that my nav bar changes colour after I scroll past a point! ahahah
@andrewchar
from the bootstrap site
Body padding required
The fixed navbar will overlay your other content, unless you add padding to the top of the <body>. Try out your own values or use our snippet below. Tip: By default, the navbar is 50px high.
body { padding-top: 50px; }
Anyone know of a very polished personal portfolio webpage? I want to look at html structure.
If anyone sees this message later please email me a link: salmanshahid@hotmail.com.au I am off. Thanks.
@mutantspore in my .content-container i had margin set to 70px which was throwing it of. i changed it to padding top and bottom of 50 and it works perfect now
now to figure out how to make pseudo classes work for my navbar
@andrewchar i didn’t read your issue properly in teh first place . i thought it was about the nav bar blocking stuff.. yes, once i looked again i could see the stray margin
@mutantspore i am trying to make it so i can get a scrolling effect on the top of my page. like the image stays there and the rest of the page scrolls over it. do you know what this is called? like the effect name?
people say that’s the one shown is a parallax effect.. it’s not really
try
try
background-attachment: fixed; to make the background image fixed in place and scroll to allow it to scroll
oh there you go haha yeah i just found that code on google
well i like to make sure it works in your pen before i tell you… takes a sec
This message was deleted
haha thanks anyway :) im just working on making :hover work for my navbar. apparently trying to target the right place is hard?
@andrewchar i gave the nav bar an id and targeted the ul and li in it
i am able to target the right side stuff, just not the left
the home button
<div class="navbar-header"><a class="navbar-brand color-me" href="#home">Home</a>.navbar-header .color-me:hover {
color: #0099cc;
}
now for the hardest part. filling in the About me section :P
@andrewchar Don't worry, every new web developer goes through an existential crisis the first time they write their first
About Me page.
yeah im at a loss
Just go into great detail describing every physical feature you have.
so this scar i got when i was 3
Be sure to list your drivers license, SSN, and DOB.
let me tell you about that one, sit down, have a seat
@andrewchar - pretty nice looking page! My usual complaint - on CodePen, you are not supposed to put
But I think it's a very nice page!
<body> tag in the HTML panel - CodePen puts the various pieces from the UI into a template. This results in malformed HTML. It might not affect the page display on CodePen, depends on what you are doing. If you look at the frame source from the CodePen view frame, you'll see multiple <body> tags, other things that are flagged in the FireFox view of the source as stray </div> tags, stray <script> tags.But I think it's a very nice page!
@khaduch thank you, the more i look at it the more i want to tweek lol im already making changes haha
andrewchar sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star: 488 | @khaduch | http://www.freecodecamp.com/khaduch
@khaduch ive been debaiting the look of my footer. if i want to make it a standard one or not. for now im just making it a bit smaller
@andrewchar - I just noticed something - your 'social' connect icons do not appear in firefox, but they do in Chrome? (I was looking at them in Chrome first, then I opened the page in firefox and noticed that they weren't there. Kind of strange!
hmm they work on my firefox
I am using firefox on windows - it looks like they show up in the firebug display, just that the bottom section (the contact div) is very short, only 40px high? And when I try to just expand the size they do not show up?
maybe it is just my firefox? I just tried to reload the page. I see them in the firebug tools, not being displayed? The height of that lowest div is set by the height of the <h1>? Strange?
i dont know if it matters or not but here is an updated one. not sure if you see my updated saves as i do them
http://codepen.io/andrewchar/pen/NxLeje
http://codepen.io/andrewchar/pen/NxLeje
My firefox is 43.0.4, but it says "updates available"... I'll try updating and try again?
I just pasted my firefox view in there - the scroll bar is pegged against the bottom, but the icons are not there?
do you have adblock enabled on codepen khaduch? i seem to recall running into that when i was making my profile page
@andrewchar @calicode - that is it - adblock was blocking the icons? (and the icons only?)
its not like the links are to malicious sites or something
I could set it up to block all codepen.io page? Maybe somehow it was set up to block social media sites? Now it is showing them, at any rate.
thanks for that tip, @calicode
khaduch sends brownie points to @calicode :sparkles: :thumbsup: :sparkles:
:star: 324 | @calicode | http://www.freecodecamp.com/calicode
am i doing my important thing right.
.home-intro {
color: white;
font-family: 'Tillana', cursive !important;
padding: 270px 0;
}
and they are font awesome icons also so i dont even know
its not like you are linking to icons from the social media sites themselves
@calicode - yes, it was strange, and I cannot get it set to do that same thing again, I can block all codepen.io pages, so the entire page is blanked out...
trying to get something fun as a font for my h1-h6 headers
I like it - it's different, not too odd looking. I think that it looks professional.
just a little something to add flavour
back to the task at hand, again... try and make my About Me
@andrewchar I think it looks 'okay', but I'm not sure it really matches the theme of your site.
:P
Haha, I'd change the images a bit if you wanted 'playful' to be your theme and then that font would work great.
this one won because it had more of a "light" feel to it. the other was a somewhat darker image with slight blur, was also a pic of a mac on a desk lol
I think you're on the right track, and overall your portfolio looks great. Personnally, I'd go with a bit stronger serif font for your headings and a sans serif font for your other content. However, it depends on the feel you want. Here are a few resources you could look at.
yeah i have no ides about fonts. today is the first time i have EVER given them any thought what-so-ever
google fonts visited today for the first time
@andrewchar wel I think Google fonts also has a “this goes with that” section or suggestions
Wait until you decide you need a new font for your text editor. Then the search for the perfect monospace font will begin.
At the moment it is
Code New Roman for anybody curious.
i want a new theme for mine. i dont like the current colors
but i have yet to look into them
still new to sublime
I use Atom when I'm not in Visual Studio, and I like the Hydra syntax theme.
how do you like now
can you review my weather ap
weather app
@andrewchar I like it. Feels more dependable and professional to me.
@andrewchar Neat... In your portfolio, try to use variety of images instead of the same ones. It will speak volumes about yourself
@chethanbhat yeah i just have that as a place holder for the moment until i have some stuff to to in them :)
to put in*
@shannon-latham awesome
@shannon-latham looks like unsplash. I borrowed from there as well :P
@andrewchar No problem... Keep going !
didnt find this one
actually i remember now. if i use a picture that is thumbnail size for my placeholder it makes my portfolio section go really crazy and do weird things
@chethanbhat I got a nice beach scene. My primary critique is that simply using a white font could be difficult to read on a lighter background.
chethanbhat sends brownie points to @shannon-latham :sparkles: :thumbsup: :sparkles:
:star: 381 | @shannon-latham | http://www.freecodecamp.com/shannon-latham
@shannon-latham I have kept all my backgrounds dark. So white i felt was more suitable
@shannon-latham hope weather,location and description was correct?
if there is rain, there is different background, same for snow, clouds
@shannon-latham what can i do it to make it better with the white font?
@chethanbhat Yep, clear skies. Correct City and Country. No state though. Temp is accurate.
If you place a small black border around it it will be readable on any color. Try adding this to your
text-center css class: text-shadow: black 0px 0px 10px; and see how it looks.
chethanbhat sends brownie points to @shannon-latham :sparkles: :thumbsup: :sparkles:
:warning: chethanbhat already gave shannon-latham points
check the result
here it is... my minimal About me lol good enough? My name is Andrew, I am an aspiring web developer. I love developing clean and elegant dynamic websites and web applications. I've learned languages such as HTML, CSS, JAVASCRIPT and continually learn much more. I have also worked with popular frameworks such as Bootstrap.
@andrewchar Sounds good, but typically JS is either abbreviated as JS or spelled out as JavaScript.
Hello, I have a question about making a navigation bar using Bootstrap, mainly in CodePen. The responsive toggle button isn't working. I've added the necessary BS and jQuery like the challenge videos suggested, but I'm having trouble testing the drop-down menu when the view is re-sized. Would anyone mind taking a look? http://codepen.io/Benmhz/pen/PZyaMq
@Benmhz you also need to add Bootstrap.js after jquery in the js scripts
It's required for the collapse part
@HermanFassett Do I have to hand write that in? I've used the CodePen options that the videos have suggested.
im not sure but dont you need to use this
class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"
@Benmhz just go to JavaScript settings and Quick-add bootstrap, not sure what video you used
Wait, I see what @HermanFassett meant: when I added the CSS, I was assuming that CodePen was adding all the dependencies. Checking the JS window, it had the jQuery, but the bootstrap.min.js wasn't loaded. Thanks @HermanFassett!
benmhz sends brownie points to @hermanfassett and @hermanfassett :sparkles: :thumbsup: :sparkles:
:star: 1546 | @hermanfassett | http://www.freecodecamp.com/hermanfassett
:star: 1546 | @hermanfassett | http://www.freecodecamp.com/hermanfassett
@andrewchar , thanks for the tip. I was following a tutorial on Tutorial Republic as a guide. Funny thing, everything worked perfectly cause I was loading everything by hand. Thanks guys!
benmhz sends brownie points to @andrewchar :sparkles: :thumbsup: :sparkles:
:star: 272 | @andrewchar | http://www.freecodecamp.com/andrewchar
Alright!!!! im done for now, time to hand this baby in.
does someone actually check these projects ? i had to give the link to it. do they get posted on the site or something
not sure though
@andrewchar the projects will be checked when you claim the front-end certification. If you want to work on other bonfires you can pass this one and complete them when you are ready
You are not obligated to resolve them in this order
that's okay the order is no problem, i enjoy doing it all!
hi guys, i have difficulties creating a twitter share button that dynamically links the currently displayed quote in RandomQuoteMachine project. Any clues?
saw the page earlier, read it but didnt understand how to go about implementation
@johnotu you can use jquery
$('selector').attr('href', 'URL' + variable);
@qualitymanifest how do you get to change "your quote variable goes here" every other time quote changes?
@johnotu that's as much as i can give you without giving you the full solution... i basically just told you
johnotu sends brownie points to @qualitymanifest :sparkles: :thumbsup: :sparkles:
:star: 921 | @qualitymanifest | http://www.freecodecamp.com/qualitymanifest
guess the jquery selector listens to the tweeter button click and i have to hash the quote elements. now i see
@johnotu you don't have to hash them. you use
$('HTMLplaceWhereYouPutYourQuote').attr('href', 'URL' + yourCurrentQuoteVariable);. you don't have to add in the %20's in place of spaces, they're added in for you. try playing around with https://twitter.com/intent/tweet?text= and adding some sentences after it, in your browser
where would one go to look for websites i could help build for people.
id like to kinda practise making sites more
maybe find a free project to do somewhere
@andrewchar finish the FCC curriculum and they will be provided for you. or if you can't wait and you're sure you're ready, look for them yourself
about @andrewchar
@andrewchar there's like 20 (or more?) project websites left for you to build on FCC
i will continue to push on with the curriculum here, i have every intention of finishing, i was just curious to check out some sites.
@cannelflow thank you! i cant wait to be able to get some stuff for the portfolio part :)
andrewchar sends brownie points to @cannelflow :sparkles: :thumbsup: :sparkles:
:star: 743 | @cannelflow | http://www.freecodecamp.com/cannelflow
pretty happy about how it turned out for my first real project
gr8 start
i did recreate google for a project from odin project before i decided to commit to fcc
i think it looks pretty close but the code is really messy lol
@andrewchar as a jr dev you do things in 3 steps:
step 1: panic
step 2: mash some mess together
step 3: refactor
step 4: repeat skipping step 2 (hopefully)
step 1: panic
step 2: mash some mess together
step 3: refactor
step 4: repeat skipping step 2 (hopefully)
you forgot to add step 5 and 6 and 7 ... stay up all night 2 days in a row , breath like an angry animal trying to stay calm, and hate life itself
@scienceoflife
which is what i've been doing all week with th tictactoe zipline(seriously why?) and this wikipedia zipline
which causes step 2
i havent done any of the ziplines, or basically any of the challenges, but when i was going to school for web dev tic-tac-toe was like the hardest thing for me
i got so mad from that , i still have a headache, i deleted everything except the part that puts a marker on a square when you click on it
but about the wikipedia zipline ... what;s wrong with my get request ? T.T
imgur seems not to be displaying images on my portfolio page. google drive gave me same issues too. anyone knows a better alternative?
@scienceoflife code pen. but i took backgrounds and other images from my imgur page
i had the same problem with imgur .. it shows the photos on codepen for a while then when you refresh the page or come back later it would not show the images .. i think i used postimage.org or tinypic.com .. whichever wrked better :/
@johnotu you are correct. Imgur can;t be used in that way anymore. Dropbox will work, as will something like http://postimage.org
hey @johnotu for your project photos they aren't urls but data streams it looks like
@johnotu if you are going to use an img tag on codepen make sure all img tags end with a file format i.e. .jpg, .gif, etc
@Zerelt @mutantspore will try postimage.org
in this precise moment in time i think i seriously just want.to.die ... whoever wrote this wikipedia sandbox is either very very very smart and wanted to share his way of letting people know how to use this damn api or someone who wanted to make you have a stroke from reading the damn thing
just used postimg.org and the mobile view is with all the images. thanks guys
@Zerelt what kind of troubles are you having reading the api
making the damn get request to work for starters .. tehn i notice that the snipets are differernt from the summary that's displayed under the title in the fcc zipline example, trying to figure out wheather to use generator=search or list=search, and so much more .... i'm actually gonna be happy when i get to the regex part and replace the spaces between the words with %20 ... T.T
seriously .. these last 3 ziplines i;m trying to do .. pure madness
if you aren't using it already @Zerelt cough postman cough
i've really been up all night 2 days in a row and crashing from exhaustion during the afternoon wit hthe tictactoe,wikipedia and the pure rage that's overflowing .. can you be more specific than "postman" please ?
the weather zipline , the freecodecamp news zipline the twitch zipline ... i swear i did not have as much trouble with them as i am with this damn thing
.hover() gives unexpected results :(
https://jsfiddle.net/himynameissal/dn3ekoos/ Any ideas on why my quote-text div is not centered inside the quote-box?
Nvm, I understand now. My quote-text div is moving relative to it's own width and height. I set the position of the inner div to relative and then adjusted the top and left property.
This message was deleted
mynameissal sends brownie points to @dukbcaaj :sparkles: :thumbsup: :sparkles:
:star: 388 | @dukbcaaj | http://www.freecodecamp.com/dukbcaaj
can you do something like
for( var i in json.query.pages) { etc} ?
anyone?
@mutantspore - you there?
anyone?
$('#1').click(function(){
var num1=$('#1').val();
alert(num1);
});
});
you wrote alert(num1); so alert box will popup
it is popping up, but the value is not getting displayed
https://jsfiddle.net/himynameissal/dn3ekoos/ Anyone know why my other elements inherit opactiy of #quote-box. Also, how to center text vertically in a div - I've tried
display: table-cell;
vertical-align: middle;but this changes the height of my div.
@cannelflow - i think jQuery allows this
@Zerelt as long as "i" is an actual property of your object, you could, but are you sure that json.query.pages is an object?
@marcogoldin yeah the jquery.query.pages is an object not an array ... there are no arrays in the entire main object ... and no the i is not a property it was just a variable i was hoping to use to iterate through that specific sub-object
ok then, it depends on which results you expect from your iterator. For iterating through keys there's a shortcut
for (var key in json.query.pages) {}
that's just like what i wrote the first time except it has key in it instead of i xD
@Zerelt :D well, personally i'd go with this:
var pages = json.jquery.pages;
for (var i = 0; i < pages.length; i++) {}
Hi everyone, I'm working on the second frontend project. I have a small problem. The new quote button disappears after one click. How do I make it stay?
This is the JS code I have, for now.
function myFunction() {
var quote=document.getElementById("quote");
quote.innerHTML="haha, I changed it!";
}And this is the button html code
<button class="btn btn-primary btn-lg new-quote" onclick="myFunction()">New quote
</button> var num1=$('#1').val();
alert(num1);
});
});anyone please??
@manojansh
$('#1').click(function(){
var num1=$('#1').val();
alert(num1);
});
});
this code does not display value at html location with id="1"
anyone please??
$('#1').click(function(){
var num1=$('#1').val();
alert(num1);
});
});
this code does not display value at html location with id="1"
anyone please??
do i need to turn the column values of tables into buttons?? @URobert
the alert box should display 1, but it isn't @URobert
@manojansh this is what you want:
var num1=$('#1').text();
@manojansh try it
manojansh sends brownie points to @urobert :sparkles: :thumbsup: :sparkles:
:star: 560 | @urobert | http://www.freecodecamp.com/urobert
@manojansh I'm not sure. Do some digging on MDN and W3S on .val();
manojansh sends brownie points to @urobert :sparkles: :thumbsup: :sparkles:
:warning: manojansh already gave urobert points
@manojansh I only used .val() when working with inputs from search bars etc
I need an advice for my Simon h
game
how can I make it scale on iphone screen
without using media queries
I get this error when using wikipedia api to make request - help plz - 'No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. '
@shkurata I do not think this is applicable to your case but I have put Simon to a Canvas. I set the canvas width and height to a certain ratio of the viewport. Than everything I draw to the canvas I set the size as a certain percentage of the canvas width
This way it looks good on small and large displays as well.
Hi, Is there any drag and drop way to create background image for code pen project?
because can not find url for many images
@TridevGuha I do not think so. But if you right click to any image you should be able either to copy its url or to open the image in a new tab. In the second case, the url is visible in the browser
thanks @dzsobacsi
tridevguha sends brownie points to @dzsobacsi :sparkles: :thumbsup: :sparkles:
:star: 301 | @dzsobacsi | http://www.freecodecamp.com/dzsobacsi
$('#1').click(function(){
var num1=$('#1').val();
alert(num1);
});
});
this code does not display value anyone please??
var num1=$('#1').val();
alert(num1);
});
});
this code does not display value anyone please??
it should display 1 in alert box
anyone please i am stuck here
for the second project, where am i supposed to get quotes from? Hardcode them?
@nikhil1011 , you can, or you can use an api. many people do both, it is up to you :)
@dzsobacsi , thanks, I thought for using canvas but I want first to try with css.
shkurata sends brownie points to @dzsobacsi :sparkles: :thumbsup: :sparkles:
:star: 302 | @dzsobacsi | http://www.freecodecamp.com/dzsobacsi
@nikhil1011 , here are three sites for the quotes should you choose the hard way: forismatic.com , http://www.icndb.com/api/ , http://quotesondesign.com/
(please note, i hardcoded, those are from friends, dunno how they work or the quality :blush: )
Hi All btw haha
In portfolio project, at the portfolio section, I am unable to figure out how to add the images of the projects I have created. How do I do that?
@TridevGuha I use screenshot sofware then resize it in gimp. Yoiu can then host it on imgr
tridevguha sends brownie points to @wcat13 :sparkles: :thumbsup: :sparkles:
:star: 270 | @wcat13 | http://www.freecodecamp.com/wcat13
Hi campers, can you please review my javascript calculator. Thanks.
@sigursiguros functionality is almost there. I have been working on aesthetics all morning saving the functionality for after. I think you'll want to use an input tag to use for your display. http://www.w3schools.com/tags/tag_input.asp
HI all, How do I acess the JSON data so I can get it in my HTML?
hi guys. some of the quotes i'm using for the #RandomQuoteMachine have more characters than the 150-character tweet limit. should i still let them be there or should i remove those ones?
@sigursiguros It is displaying oddly in my browser. try http://blog.codepen.io/2014/03/28/new-feature-autoprefixer/
yeah but how exactly ?
$.getJSON("http://api.openweathermap.org/data/2.5/weather?lat="+ position.coords.latitude +"&lon="+ position.coords.longitude+"&appid=44db6a862fba0b067b1930da0d769e98", function(json) {
var obj = json;
$(".message").html(JSON.stringfy(obj.coord[0]));
I srsly don't know what I'm doing @_@
msg.payload = {};
msg.payload = msg.data.current_observation.observation_time.replace(" EST",", ")
// + "location: " + msg.data.current_observation.display_location.full + ", "
+ "station: " + msg.data.current_observation.observation_location.full + ", "
+ "temp: " + msg.data.current_observation.temp_f + "°F, "
+ "humidity: " + msg.data.current_observation.relative_humidity + ", "
+ "wind: " + msg.data.current_observation.wind_string;
msg.time = msg.data.current_observation.observation_time;
return msg;
That is from something was playing with a few months back.
actually thats python and I am being dumb
function(data) {
var msg = JSON.parse(data);
console.log(msg)
});
Is using margin-top: 50px; bad for mobile/smaller devices? Should I be using a percentage instead of pixels?
I am working on building a static website with bootstrap but I honestly just do not feel I understand the concepts
I cannot envision it and it is driving me F̼ insane
@brownfitterman I do not find it easy either. But the challanges available on FCC can give you some grasp. BTW, I think I saw some front end course on Coursera as well
sigursiguros sends brownie points to @wcat13 :sparkles: :thumbsup: :sparkles:
:star: 271 | @wcat13 | http://www.freecodecamp.com/wcat13
@WCat13 But when I do this, I get nothing D:
$.getJSON("http://api.openweathermap.org/data/2.5/weather?lat="+ position.coords.latitude +"&lon="+ position.coords.longitude+"&appid=44db6a862fba0b067b1930da0d769e98", function(json) {
var c = json.coord;
$(".message").html(c);
I dont think json.coord part is right
http://www.wunderground.com/weather/api/d/docs?d=resources/code-samples
jQuery(document).ready(function($) {
$.ajax({
url : "http://api.wunderground.com/api/Your_Key/geolookup/conditions/q/IA/Cedar_Rapids.json",
dataType : "jsonp",
success : function(parsed_json) {
var location = parsed_json['location']['city'];
var temp_f = parsed_json['current_observation']['temp_f'];
alert("Current temperature in " + location + " is: " + temp_f);
}
});
});
I'm trying to get the json from openweather based on the navigator coordinates but I'm stuck
Oh let me try it again
function getWeather(city, callback) {
var url = 'http://api.openweathermap.org/data/2.5/weather';
$.ajax({
dataType: "jsonp",
url: url,
jsonCallback: 'jsonp',
data: { q: city },
cache: false,
success: function (data) {
data.city = city;
callback(data);
}
});
}
Codepen: http://codepen.io/tstusr/full/OMBdbG/
In the first page if you hover on the buttons they will change size. However, the other buttons will change their position, how can I avoid that?
In the first page if you hover on the buttons they will change size. However, the other buttons will change their position, how can I avoid that?
@tstusr441
.but:hover {
background-color: black;
border-color: black;
color: red;
transition-property: font-size;
transition-duration: 0.2s;
transform: scale(1.2);
}
instead of transforming the text
Thanks @WCat13 . So, scale inscreases the height & width of an element?
tstusr441 sends brownie points to @wcat13 :sparkles: :thumbsup: :sparkles:
:star: 272 | @wcat13 | http://www.freecodecamp.com/wcat13
.but:hover {
background-color: black;
border-color: black;
color: red;
transition: .3s;
transform: scale(1.2);
}
Not sure targeting the font was the problem. https://css-tricks.com/snippets/css/scale-on-hover-with-webkit-transition/
Thanks again :P I was just trying to figure out why delay wasn't working.
also you can cut everything between your style tags and add it into the css pane then remove the style tags from html section.
Oh yeah, I forgot about that. I should do it, it is a lot cleaner.
I'm having a hard time trying to find out why my image won't cover the full width of the page. I tried a lot of things, including trying to set the div full width or setting the paddind&margin to 0.
http://codepen.io/tstusr/full/OMBdbG/
http://codepen.io/tstusr/full/OMBdbG/
@tstusr441 put the test class in the div above where it is now. and I think that container-fluid div is not closed with a </div>
Thank you @WCat13 @mutantspore . Adding an additional </div> worked.
tstusr441 sends brownie points to @wcat13 and @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 273 | @wcat13 | http://www.freecodecamp.com/wcat13
:star: 1096 | @mutantspore | http://www.freecodecamp.com/mutantspore
Guys, how is the outer look of my Simon game?
nikhil1011 sends brownie points to @wcat13 and @rphares :sparkles: :thumbsup: :sparkles:
:star: 274 | @wcat13 | http://www.freecodecamp.com/wcat13
api offline
This is my simon game - partially completed
not sure why the text is aligning like that - looks okay when I edit something and codepen resets
shkurata sends brownie points to @ellf :sparkles: :thumbsup: :sparkles:
api offline
I'm almost done with my calculator, but I can't seem to get eval() to evaluate my string. I'm not sure why it won't work:
http://codepen.io/BrettPen/pen/jWeLgN
http://codepen.io/BrettPen/pen/jWeLgN
@BLayman console.log your
expression var right before you try to eval() it... you have   in there.
@BLayman think about using width and height in your "screen" class perhaps?
@MattYamamoto Sorry, but I'm not sure what you mean. Just add console.log(expression)?
if you put a console.log(expression); after line 44 you'll see the output from your eval() in the console.
The console is your friend when debugging
@BLayman to be clear, I believe @Ellf meant a
console.log(expression); after line 44 will show you the INPUT to your eval() call on the next line.
and so in the console you'll see why it's not working as you intend... you're passing
eval() an unexpected string.
indeed you are correct my use of 'output' was incorrect in this context
@Ellf @MattYamamoto Ah, I see. Now I understand. Yeah, it must be the  . Thanks.
blayman sends brownie points to @ellf and @mattyamamoto :sparkles: :thumbsup: :sparkles:
:star: 910 | @mattyamamoto | http://www.freecodecamp.com/mattyamamoto
:star: 323 | @ellf | http://www.freecodecamp.com/ellf
@Ellf Do you know how I could adjust the height and width in a responsive way? Percentage doesn't seem to work.
@BLayman learn to love it. In fact without even adding the
console.log() there is an error in the console that would have helped point you to the problem. CodePen recently added a "console" window (see the button for it on the lower left of the screen), but the browser console can be a little more informative
You could also make more use of the Boostrap framework. You're using it partially with your 'col-xs-6' classes. I'd probably put my "screen" class in it's own <div> inside the col-xx-x class and see how that works. But it's a bit of a change to implement.
@Ellf That sounds good for the height. But I tried width:50%, and it didn't seem to work.
What browser are you using? I'm in chrome
@BLayman You should also be aware that Code Pen has a
Debug Mode in the Change View options that will open your pen in a full screen mode that makes working with the browser's DevTools much easier.
@Ellf I'm using firefox, but I tried opening it in Chrome with the same issue. Maybe I'm doing something wrong in the CSS:
.screen{
background-color:white;
color:black;
position:relative;
height:22px;
width:50%;
}
It's looks fine to me - not sure about the others in the channel.
Oh, for some reason I was expecting it to be half of it's original size, and I noticed it hadn't changed.
@Ellf Thanks again.
blayman sends brownie points to @ellf :sparkles: :thumbsup: :sparkles:
:warning: blayman already gave ellf points
I was trying to add in some margins on the left and right, which I should be able to do now that I can make it smaller.
when you say it’s done it should ask fo rthat
of course FCC has issues right now so I can’t check tehdetails :(
Hi All, I'm working on the Validate US Telephone Numbers and feel I'm going about it incorrectly. Currently I'm doing the following and trying to check every valid combination. I think there is probably an easier way but failing to find it. Any help would be appreciated.
```
```
Dang it Hold on sorry, didn't mean to hit enter.
...
// Test 555-555-5555
if(/\d{3}-\d{3}-\d{4}/.test(str)) {
return true;
// Test (555)555-5555
} else if(/\(\d{3}\)\d{3}-\d{4}/.test(str)) {
return true;
// Test (555) 555-5555
} else if(/\(\d{3}\) \d{3}-\d{4}/.test(str)) {
return true;
...
} else {
return false;
}
@alcatrats go play around at https://regex101.com/ with some of the other quantifiers. I think
? would be helpful here.
Nice. That link looks very help. Appreciate it. Thanks @MattYamamoto
alcatrats sends brownie points to @mattyamamoto :sparkles: :thumbsup: :sparkles:
:star: 911 | @mattyamamoto | http://www.freecodecamp.com/mattyamamoto
Well I dont know how to start setting up my calculator
I feel really dumb that I can get this. I am at Stand in Line and feel very clueless. Can someone help me figure out what I'm doing wrong? This is what I have right now and am clearly not getting it.
function queue(arr, item) {
// Your code here
var myArr = arr.push(item);
var newArr = myArr.shift();
return newArr;
}
// Test Setup
var testArr = [1,2,3,4,5];
// Display Code
console.log("Before: " + JSON.stringify(testArr));
console.log(queue(testArr, 6)); // Modify this line to test
console.log("After: " + JSON.stringify(testArr));
hehe @SusanGrattan that job is lready done, but cannot figure it out how to start the work outs
=]
abel1987 sends brownie points to @susangrattan :sparkles: :thumbsup: :sparkles:
:star: 323 | @susangrattan | http://www.freecodecamp.com/susangrattan
So I'm on the weather app and I'm just sitting here staring at an empty codepen wondering where on earth do I start. I feel clueless and ill-prepared. Any one have any resources they recommend?
most are using teh Open weather Map api.. you’ll need to sign up for a free api key
You can use their weather condition icons or look around for some others like http://adamwhitcroft.com/climacons/
you have done the api lessons?
susangrattan sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star: 1097 | @mutantspore | http://www.freecodecamp.com/mutantspore
Yes I have. But a lot of it didn't make sense. They barely explained anything. Just said
Here's the code to do that"...
Here's the code to do that"...
yes true.. well you first hav eto know where the person actually is. so look up geolocate. there wil be some stock code you’ll find for that to get their latitude and longitude
once you know where they ar eyou can read up on getJSON to get the actual weather.
susangrattan sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:warning: susangrattan already gave mutantspore points
@SusanGrattan the most important thing that you wil come across is that calls to api’s (and the geolocate) are “asynchronous”. meaning that function will go off on it’s own to do what it has to do and the rest of your code will just keep running. the api result will come back when it’s ready! lol . so you will have to nest the operations or at least call the next one from inside the first. I know that won’t make sense right now but keep it in mind for later when values come back undefined.