@cwkatzmann there is a problem with your if statement in your call back
Can anyone help me with my twitch.tv stream? Here's my code. I can't figure out why my text and descriptions are not directly across their images. http://codepen.io/lukenetti3/pen/oLEmYK
why do we have to use display: block?
can someone plz answer
hey guys i doing the tribute page thing at the moment do you have a good ideer what i can do it about sorry for met english
i am doing a simple tribute page
I need to align the timeline of events
can anyone give me some clue
how to do it
<div align="center">
<h3> Time line of events </h3>
<ul>
<li> June 29, 2007 Iphone</li>
<li> September 4, 1998 Google</li>
<li> 2010 Windows 10</li>
Now I need to align the ul element
@ravikumar-cmu Can you paste your codepen?
sure
@ravikumar-cmu When I did my tribute page I tried the same thing and had problems getting those bullets to center. What I ended up doing, was using bootstrap description styling. Here's the link for that. Just scroll down to description lists. By doing it that way it bold fonts your dates and I think it looks nice. http://getbootstrap.com/css/#type
Here's my tribute page if you want to see if you like the styling before you use it. http://codepen.io/lukenetti3/pen/qZvJvK?editors=1000
Hi guys,
I'm just getting started on the quote machine, and it's a huge step up from the JSON API stuff I just completed. I'm wondering where I should even get started?
hey guys what about my rebuilded with react.js
twitch streamers? http://codepen.io/dagman/pen/ZOxjLN
Obviously the easy(?) part is just making the site, but where do I even put the quotes that the API will draw from?
....asking for a friend.
:[
Hi all! I'm somewhat new to this and I feel like I'm hitting a wall on creating my portfolio.
@JacksonElo What do you need help with?
Making it look more smooth and slick like the example page...lol
@JacksonElo Can you paste your codepen link, I might be able to help.
be gentle!
@JacksonElo I think it looks good. Personally I might make my header not so thick and possibly the same with the footer. Maybe even some different fonts to mix it up. It looks good though!
Cool! Thanks. I didn't realize how intimidating the design aspect could be
Oh, I can't figure out how to link the elements in the nav bar to the corresponding parts of the page. Any advice?
@JacksonElo Yeah for sure. I have just recently started doing Free Code Camp as well. I am studying electrical and computer engineering in college but thought it would be something fun over the summer. It will get more challenging, but don't give up. It's worth it!
@JacksonElo Yeah give me a second and I will look at it.
@JacksonElo So for the links to parts of the page. Each one of my sections I gave an id="section1" and so on for all my sections. Then in your button for the different parts, you should just be able to href="#section1" in it. I used bootstraps navbar so it might be a little different.
Ok cool. Thanks a bunch!
I have to go now though. Here's a link to mine if that can help you out at all. http://codepen.io/lukenetti3/pen/ZOzEvb?editors=1000
@JacksonElo Good luck!
hey there, i am struggling and was wondering, if someone could help me: http://codepen.io/JonathanWbn/pen/AXVgkL problem: how du i get my navigation bar to be completely on top with no space?
@JonathanWbn take out
position: fixed; for the ul attribute
@dhcodes yes, but i want this blue bar to always stay on top.
so i have to keep fixed.
then do:
position: fixed;
top: 0;
@JonathanWbn
@dhcodes yep, got it. thanks.
jonathanwbn sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1239 | @dhcodes |http://www.freecodecamp.com/dhcodes
np, sorry to hear what's happened in Munich btw
sucks
yeah. the terror in this world is getting out of hand. just makes me sad.
thanks tho.
np. sad that we're all so used to it :(
happy coding
if i may i would like to ask another question: how can i make the blue bar always "overwrite" everything, so when i scroll i dont see the text running through
@JonathanWbn add
z-index:9999;
Awesome! you made my day. thanks.
@dhcodes thanks
jonathanwbn sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:warning: jonathanwbn already gave dhcodes points
np, have a good one
anyone know how I can center my whole calculator?
http://codepen.io/duel_drawer8/pen/rLygWG
http://codepen.io/duel_drawer8/pen/rLygWG
where your class for the boxes are, try making the
width: 50%
could you link the class code for those so I could see what it looks like.
@Dueldrawer8 are you figuring it out?
@CollinBird yes sorry didnt think i would get a reply ill try it out
@CollinBird thanks
dueldrawer8 sends brownie points to @collinbird :sparkles: :thumbsup: :sparkles:
:cookie: 40 | @collinbird |http://www.freecodecamp.com/collinbird
@Dueldrawer8 you have to remember the columns should add up to 12 per row with bootstrap
@coymeetsworld ah yes i changed that thanks
dueldrawer8 sends brownie points to @coymeetsworld :sparkles: :thumbsup: :sparkles:
:star2: 1267 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
yes so you can use also col-size-sm=3 for each column
@CollinBird i did..still didnt center it
i thought the container element in bootstrap centered the content? maybe it just contains it all in one container. Do I need to apply an explicit width to container?
you still have the column problem :)
thats not how it works, columns need to add up to 12, per row
@coymeetsworld yes i did 4 rows..each with col-sm-3
basically you're saying just use the first fourth of the row's width to put content
columns need to add to 12, per row
ohh
@trip16661 No I have worked a lot with responsive sites, but for my organizations ... now I want to create my personal portfolio :)
lol
anyways you probably shouldn't do it that way anyways
try using a table instead
i was just trying to use bootstrap in this project
you can still use it, but for laying out the calculator i would use a table
youre going to have to hack around bootstrap to get it working correctly the way you want it
so i would set my .calc div to display: table?
no i mean actually use table tags, idk just a though
you can try with bootstrap to lay it out but I had problems doing it that way, just went to table
@coymeetsworld okay thanks
dueldrawer8 sends brownie points to @coymeetsworld :sparkles: :thumbsup: :sparkles:
:warning: dueldrawer8 already gave coymeetsworld points
np good luck
@coymeetsworld what about assigning spans to each number instead of buttons?
i think buttons are ok
you can style buttons too
hey guys i am bilding my own portfolio at the moment and i wanted to know how i do this think at the top that like in this page https://codepen.io/FreeCodeCamp/full/YqLyXB/
i this case it is the pink think at the top
@najre you can do it through css
setting up a fixed position on an element
yeah create an:
```.hr.star-bright {
}
and try to get it aligned correctly within your header
```.hr.star-bright {
}
and try to get it aligned correctly within your header
.hr.star-bright {
}
nvm that does’t work I’m not sure how to do it.
@Dueldrawer8 to center a block in bootstrap, set it to center-block. I think it needs to be in a row class div
@Dueldrawer8 also try setting margin: 0 auto; in CSS
@Dueldrawer8 if you're using columns, try adding an offset class to it. Check booststrap documentation for offsetting
Hey all, how can I make all these buttons centered within the navbar?
I tried containing the buttons within one div, within the bar, and giving the div
margin: 0 auto; but that did not work
const setShowcaseImg = function() {
const thisProject = project[$(this).data("project")];
//gets the name of the project to later use it to fetch properties from that project
$showcaseImg.find("img").attr("src", thisProject.img);
//gets the url of the imagen and set it
$showcaseImg.find("p").text(thisProject.description);
//gets the description
$showcaseImg.find("a").attr("href", thisProject.url);
//gets the url
$showcaseImg.addClass("showcase-open");
// then it opens a div containing this info
}any idea of why, or how to work around it? I guess i can just simplely add a conditional or a setTime function to delay it but if you ask me it sound cheap :worried:
Nevermind! I found out all I have to do is add
text-align: center; to the navbar, and it centers the button elements.
I am trying to align my button and my temperature on the same line.
Ideally, I would like the button to be align to where the degree symbol should be, but I will settle for just getting them on the same line for now.
html
var code = "formatted";
<div class="row-fluid" id="pushDown">
<div class="col-xs-12">
<h1 id="temp"><h1>
<button class = "btn btn-circle" id = "button" onclick = "switchScale()">C</button>
</div>
</div>css
var code = "formatted"
#button{
width: 3vw;
height: 3vw;
text-align: center;
padding: 1vw 0 ;
font-size: 1vw;
line-height: 1.42;
border-radius: 2vw;
}
#pushDown {
display: inline-block;
margin-top: 10%;
}
manu-4216 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1475 | @khaduch |http://www.freecodecamp.com/khaduch
help react
:point_right: building applications with react and flux [wiki]
Building applications with React and Flux
This is designed to run in a c9 environment.
Once installed, enter npm install into the bash terminal. Then type gulp from the bash terminal.
Your React development environment is now ready.
The environment will compile React JSX, Lint JSX and JS with ESlint, Bundle your JS and CSS files, Migrate the built app to the dist folder, and run a dev web-server.
:pencil: read more about building applications with react and flux on the FCC Wiki
resources react
Hey guys
Could anyone recommend some resources for me to get better at front-end, specifically responsive and mobile first sites
that freecodecamp got me isn't up to the level I want
@donaldpittard oh, duh. thank you.
cwkatzmann sends brownie points to @donaldpittard :sparkles: :thumbsup: :sparkles:
:cookie: 375 | @donaldpittard |http://www.freecodecamp.com/donaldpittard
i have somewhat of a deep technical question about css.. i basically hacked this together and cant figure out how i got the width of .calculator of 325 px.. should it be 320px? My .boxAnswer class has width of 305 and the .clear class has width of 95 plus two margins of 5px is 320.
http://codepen.io/duel_drawer8/pen/rLygWG
http://codepen.io/duel_drawer8/pen/rLygWG
Hey guys, I am trying to center a unorder list inside a div using bootstrap. However. the text centers but the bullets remain on the left.
how do I center the bullets as well >,< sorry I'm really beginner
@Dueldrawer8 you told it to have 425px, so that's what you get. It divided that like so: (421 + 2*2px) border = 425px. The content inside it won't change it
@manu-4216 correct, i had to guess though.. if i set the width to 420 px.. the spans start to break apart
@Dueldrawer8 IMO it would be better to use percentages for the buttons width and margin. that way you could change the size of .calculator and the buttons would work no matter what.
@qualitymanifest thanks! that works perfectly
dueldrawer8 sends brownie points to @qualitymanifest :sparkles: :thumbsup: :sparkles:
:star2: 1291 | @qualitymanifest |http://www.freecodecamp.com/qualitymanifest
@manu-4216 thanks for help
dueldrawer8 sends brownie points to @manu-4216 :sparkles: :thumbsup: :sparkles:
:cookie: 335 | @manu-4216 |http://www.freecodecamp.com/manu-4216
@Dueldrawer8 or you can use flexbox for the layout
http://codepen.io/redixhumayun/pen/JKryAZ?editors=0011
Hey, I'm having some issues, understanding why my timers are behaving really oddly in my script for the Simon game. Can anybody help me out here?
The values show up fine for the first three timer loops and then they just show undefined values.
@sorinr i wouldn't mind it but of course its not supported in all browsers apprently
so then how do i set the height for the .calculator div so that it encompasses all the buttons inside?
@Dueldrawer8 i would go for flex column for the .calculator and flex row for the buttons
@sorinr tanks
@sorinr thanks
dueldrawer8 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 521 | @sorinr |http://www.freecodecamp.com/sorinr
alright..how am i suppose to apply margin without my buttons breaking apart? buttons seem to overlap if you can see the white spaces betwen them.
http://codepen.io/duel_drawer8/pen/rLygWG
http://codepen.io/duel_drawer8/pen/rLygWG
does the openweathermap api give temperature in kelvin? it says my current temperature is 301.65...the only way that seems to make sense is if it was in kelvin :worried:
@bethqiang yes default is kelvin
thanks, @Dueldrawer8!
bethqiang sends brownie points to @dueldrawer8 :sparkles: :thumbsup: :sparkles:
:cookie: 417 | @dueldrawer8 |http://www.freecodecamp.com/dueldrawer8
@bethqiang but you can call it in imperial or metrics as well
i was just about to look up how to do that :)
new question--i'm using 2 .getjson functions, 1 to go through an ip api to get latitude and longitude which i then want to put into the url of the next .getjson to get the actual data for that location (i've decided for now to just bypass all of the insecure vs not issues...), but i can't figure out how to carry the variables over that i've stored the latitude and longitude values in...
@bethqiang you can use it like:
https://crossorigin.me/http://api.openweathermap.org/data/2.5/weather?lat="+lat+"&lon="+lon+"&units=metric&cnt=7&lang=en&appid=your api key here"; and change the units to your needs
@sorinr - yep, i found it in the doc :)
just need to figure out the variable thing now, hah
@bethqiang i am passing the vars like +lat+ or +lon+ in my url
so i have this: var weatherapiurl = "http://api.openweathermap.org/data/2.5/weather?lat=xx.xxxx&lon=-xx.xxxx&units=imperial&APPID=xxxxxxx"; (x=blocked out information, but it's there for real in my code, i promise)
so instead of the xx's basically where lat and lon would go...
...do i just put the variable names? (javascript doesn't seem to recognize them) @sorinr
@bethqiang in your first get you call the ip api that returns the position coordinates as latitude and longitude. so, var lat = json.latitude, var lon= json.longitude (of course you change json.lat and long with your response from first get)
@sorinr yes, i have that:
var ipapiurl = "http://ip-api.com/json"
$.getJSON(ipapiurl, function(response){
var latitude = response.lat;
var longitude = response.lon;
assign city name here });
var ipapiurl = "http://ip-api.com/json"
$.getJSON(ipapiurl, function(response){
var latitude = response.lat;
var longitude = response.lon;
assign city name here });
then i have the var weatherapiurl line, then the second .getJSON
@bethqiang then you will have the url for the second call like:
'http://api.openweathermap.org/data/2.5/weather?lat="+latitude+"&lon="+longitude+"&units=imperial&APPID=xxxxxxx';
hows it look so far..just the html/css?
http://codepen.io/duel_drawer8/pen/rLygWG
http://codepen.io/duel_drawer8/pen/rLygWG
@sorinr yes, i have that as well. javascript doesn't make the latitude and longitude values blue (like it does with all variables), so i assume it's not recognizing them as variables
@bethqiang close var ipapiurl = "http://ip-api.com/json" with ; semicolon
@sorinr thanks for catching that, although it doesn't seem like it affected it at all--that function actually worked with or without it. the issue from the start has been that i can put in the exact latitude and longitude values into the url and it'll return info, but when i try to put the variables in instead of actual numbers, it doesn't return any info.
bethqiang sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 522 | @sorinr |http://www.freecodecamp.com/sorinr
@Dueldrawer8 when you added <h2>Goldsmith Calculator</h2> all your buttuns where pushed down and some of them are out of the calculator background
@sorinr yes i saw that. I just removed the h2 for now.. i believe an element collasped
i thought i had to either apply some sort of padding or margin for it to go away but there already is both
@sorinr - fixed it. just declared them outside the first .getjson first and then they were both recognized in the second .getjson :)
@bethqiang good.
guyz look at this Great Wiki Viewer !!!
Behoooolllllldddd !!!
@NixonRichard - wow, looks great! and it told me everything that I need to know at 6 a.m.... ;)
can anyone please share where i can read about using API and JSON? I'm on the random quote generator and I don't know anything, where to start, anything. tnx!
hey guys, i need help: i dont get my <hr> working. http://codepen.io/JonathanWbn/pen/AXVgkL?editors=1100 can anyone help?
where is img in you page?? @JonathanWbn
watch json api tutorials on youtube @jod29
@shivam13 thanks. will try watching maybe a dozen tonight. :)
jod29 sends brownie points to @shivam13 :sparkles: :thumbsup: :sparkles:
:cookie: 33 | @shivam13 |http://www.freecodecamp.com/shivam13
@JonathanWbn you have placed elements "absolute", hence the line is rendering on the top
:smile: :+1: gud luck @jod29
@Bhushan933 yes, but how can i make it be there where i want it to be
@JonathanWbn where you want it?
under &MINIMALISM @Bhushan933
explain rooms
:point_right: help rooms [wiki]
FreeCodeCamp Chat Rooms
Help Rooms
| Chat Room Description | Chat Room |
|---|---|
| HTML/CSS/Bootstrap | FreeCodeCamp/Help |
| JavaScript/Algorithms | FreeCodeCamp/HelpJavaScript |
| Front End | FreeCodeCamp/HelpFrontEnd |
| Data Visualization | FreeCodeCamp/HelpDataViz |
| Back End | FreeCodeCamp/HelpBackEnd |
Choose the right room for your questions!
See also: :earth_asia: Language Specific | :satellite: Technology | :crystal_ball: Miscellaneous
@JonathanWbn hr {
position: absolute;
top: 690px;
width: 100%;
display: block;
border-color: #000;
}
position: absolute;
top: 690px;
width: 100%;
display: block;
border-color: #000;
}
@JonathanWbn change your hr CSS with above
@JonathanWbn but it is not a good thing to place elements as absolute, specially when you want a responsive site
thanks. yes, i am starting to realizing that. gonna change that today. still, thanks! @Bhushan933
jonathanwbn sends brownie points to @bhushan933 :sparkles: :thumbsup: :sparkles:
:cookie: 3 | @bhushan933 |http://www.freecodecamp.com/bhushan933
hey guys can someone please check why I am not getting my geo location in my weather app? it's not showing lat or lon http://codepen.io/EvanDCP/pen/akGdpJ
Hi, If someone want to get done PSD to HTML responsive design, please contact me ... I will do it for free :)
use ip api @EvanDCP
@shivam13 how? can you show me please?
@shivam13 should I copy paste all this code? O.o
I don't understand any of it lol isn't there a easier way to get your geolocation?
its nothing confusing in this code
here var GEOCODING gives you the lat and long
@EvanDCP
@shivam13 gonna try thank you!
evandcp sends brownie points to @shivam13 :sparkles: :thumbsup: :sparkles:
:cookie: 34 | @shivam13 |http://www.freecodecamp.com/shivam13
gud luck :+1:
@EvanDCP
hi, I've got a question about bootstrap. I have 1 div (row) with 1 div (xs-col-12) within it. Then I've got another div (row) with 1 div (xs-col-10) within it. But I somehow fail to center this div. I tried everything so far. Would someone mind to give me a hint? Thanks
codepen link: http://codepen.io/jofrly/pen/mELdap?editors=1100
@jofrly col-xs-offset-1
@jofrly the grid is 12 wide, and by default it goes left to right
@jofrly so if you want the 10 centered, you need to use col-xs-offset-1 to push it 1 over, giving you 1, 10, 1, for the overall 12 width
@shivam13 it's not working. My page is still completely blank despite copy pasting your code :(
@Benalron aaah wow, thank you! is there some literature about this so I can read some more about this?
jofrly sends brownie points to @benalron :sparkles: :thumbsup: :sparkles:
:cookie: 413 | @benalron |http://www.freecodecamp.com/benalron
@jofrly just the bootstrap docs
@Benalron okay. thank you :smile:
jofrly sends brownie points to @benalron :sparkles: :thumbsup: :sparkles:
:warning: jofrly already gave benalron points
Hi guyz this s my new wiki viewer
@jofrly NP, good luck
@EvanDCP move your var lat;
var lon; outside of any function and make them global
var lon; outside of any function and make them global
@NixonRichard as long as u use <form class=" pure-form"> you should prevent form submitting
what do u mean ?
@sorinr
AGGHHH nothing works I'm getting frustrated
I've edited my code so much, tried so many differents things and websites and whatevers
fucking shitty weather app challenge
:laughing:
I know the feeling
using F-bombs ll make u get banned @EvanDCP
@NixonRichard how so? are there any kids here or something? can't even vent now T_T
@NixonRichard when you press enter on you input field theform will try to sumbmit that will lead to a page reloading. if you want to do something else there just prevent the default behaviour
how to prevent that ?
delete the class ?
@NixonRichard event.preventDefault();
put that in js ?
@NixonRichard NO. you read about preventing default behaviours :)
@NixonRichard yes you put it in js
@sorinr :+1:
@NixonRichard hope u got the idea of preventing the default behavior. i think you r writing something while i was writing something else :)
$(".pure-form").click(function(event){
event.preventDefault();
});
Am i doing this the right way ? @sorinr
how do i change the dimensions of bootstrap’s social butttons on css?
@NixonRichard take a look here at your code:
<form class=" pure-form"> what is wrong?
why is the twitter icon so on the left? i need it to be more centered http://codepen.io/emud/pen/wWjrkv
any idea why button alignment is broken here: https://codepen.io/zachbpd/pen/EyEdyp ?
@DumeD i can get it to more in the center with flexbox and using justify-content. is that what you are looking for?
@AWhiteRabbit can you show me how you did it?
in this chalenge Build a Personal Portfolio Webpage
can i look in the others work
like google it
or never see any code for who complete this challenge
@DumeD http://codepen.io/AWhiteRabbit/pen/zBjqxR i put it on line 13 'a' tag
@AWhiteRabbit that’s perfect! thanks!
dumed sends brownie points to @awhiterabbit :sparkles: :thumbsup: :sparkles:
:cookie: 133 | @awhiterabbit |http://www.freecodecamp.com/awhiterabbit
@DumeD your welcome =D
My project stopped working suddenly
It was working till yesterday
hello could some one guide me through the process of getting my project to post on FreeCodeCamp from Code Pen.
@kdrye72 - copy the URL and post it to the project, I think that's it?
@khaduch I appreciate you, thanks gonna give it a shot.
:star2: 1477 | @khaduch |http://www.freecodecamp.com/khaduch
kdrye72 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
@MathewtheCoder - for some reason, you have a user
phantoml0rd, and an error is resulting while fetching that user. (If it worked before, maybe it's just a transitional thing?) I commented out that user and re-ran your project, and it loaded. So you might have some error handling problem that could be adjusted? I haven't looked at your code...
@kdrye72 - you might want to make sure to copy the "full" view URL, just makes it a little better for the initial click. Let me know if it works?
@khaduch ok
@khaduch I guess I should have payed a little more attention to the "Ive completed this challenge" link. There was a place to post my URL on the link. Thanks for the help.
kdrye72 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:warning: kdrye72 already gave khaduch points
Hey guys I'm having a problem with api
@bgeraci714 which one?
API's for the random quote generator. The issue is that I can't use http API's from an https site and I was wondering if anyone had a workaround
(sorry, I accidentally hit send a little early)
i found a few good ones but the only issue is that they're all http
@bgeraci714 just make your page http
I tried doing that but to no avail, is there a way to make that happen automatically?
I'm using github pages for my sites
@kdrye72 :+1: good luck! There are so many things to pay attention to on the way, you'll get used to it!
hey guys, im trying to use things like a speechbubble or a light bulb like on this page under "what can i do for you?". http://tilano.de/index.html#work how do i approach those things?
@JonathanWbn - looks like he is using the font-awesome icon set for the images- you can easily add those to your codepen project by going to the CSS external libraries in the config tab and type
font-awesome in one of the blank text boxes. Then look up the font-awesome page for instructions and a list of the icons. For instance, for his lightbulb icon on that page you showed, the HTML code is : <i class="fa fa-lightbulb-o icon huge"></i>, which is the standard way to include a font-awesome icon. Then you just have to figure out the CSS for the :hover pseudoclass to make that highlight when you hover over it.
WOW
Okay so I've been working on making my JS fancy for 2 hours so that I didn't have to write 10 more lines of code
And it didn't work, one part of it
APPARENTLY I just needed to make one of the for loops run on the j variable rather than i
It's ALWAYS the little things
No matter what
@khaduch thanks a LOT.
jonathanwbn sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1478 | @khaduch |http://www.freecodecamp.com/khaduch
@JonathanWbn - you're welcome. The CSS for those looks something like this (and he somehow has it set up for only "no-touch" devices - probably differentiates between touch screen and a standard desktop in some way)
.no-touch .serviceblock:hover i {
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}one of the pseudo-class selectors that he has is .no-touch .icon.huge:hover,, which matches the class that is in the HTML for that font-awesome icon.
And here is the other missing piece of the CSS, since I'm looking - the thing that he is transitioning:
.icon.huge:hover {
color: #bba454;
border: 3px solid #bba454;
}That should give you a lot to play with! :)
again, thanky ou
@khaduch
Hello ,please anyone who has completed Tic ac project have a look at my code for case ".5" in if else loops,and tell me why clicking 1 not producing the right ouput as written in switch. Also is there a way to do this in less code,my code has reached 610 lines http://codepen.io/meow414/pen/rLJaPJ
@khaduch Thanks man that channel was closed thats what caused the error i guess i have to include error handling to take care of such cases
mathewthecoder sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1479 | @khaduch |http://www.freecodecamp.com/khaduch
can someone please tell me why my background always leaves sth like 15px or 20px on the left and right side?
my code is here
how can I fill them out with that background, it was 1920x1080 on size
nevermind I figured out
What did you do?
Hello, campers! I could use some help with the priject Build a Random Quote Machine.It is almost done, except for one thing. When I tweet the quote, if its too long Js will cut it but the Twitter still reports tweet is too long.I dont know why.Here is my CodePen link: https://codepen.io/djoles/pen/LkdExd/
hi de hi
hi all
All sugestions are most welcome.
@djoles2401 try to get the quotes from an api not from a hard coded json
@sorinr thanks, i will.
djoles2401 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
@djoles2401 these may be useful: :sparkles:
:cookie: 524 | @sorinr |http://www.freecodecamp.com/sorinr
@ndburrus thanks a lot
djoles2401 sends brownie points to @ndburrus :sparkles: :thumbsup: :sparkles:
:star2: 1096 | @ndburrus |http://www.freecodecamp.com/ndburrus
@djoles2401 you're welcome! enjoy :palm_tree:
In React, how do you get the content between component tags? For example, I might have a component called
Spoiler, and rather than <Spoiler text='Snape kills Dumbledore' />, I might write it as <Spoiler>Snape kills Dumbledore</Spoiler>, but how would I get the text from the props?
@Fourbits
<Spoiler>{this.props.text}</Spoiler>
@sjames1958gm I don't want to pass another component's props into
<Spoiler>; I want my Spoiler component to know what text was passed to it, like so:class Spoiler extends React.Component {
render() {
return <u>{this.props.contentBetweenTags}</u>
}
}
@Fourbits why not export your data to be visible to all your components?
@Fourbits <Spoiler contentBetweenTags={some value}></Spoiler>
@sorinr I am just curious, as I saw that you can do that in React Native and React Bootstrap.
Like
<Text>some text</Text> or <Button>button name</Button>
You can even nest React components, like
<View>
<Text>Hello, World</Text>
</View>
Guys is there any good resource to learn about asynchronous programming in js
I am greatly confused by promises and deferred and also how to use callback
hi, i am trying wiki viewer project, I am having problem with my input, can't take the string value from my input id="search-text" to jquery variable .
I am using var var searchString = document.getElementById("search-text").value; in jquery
@MitulIslam You assigned the value before the user clicked the button.
Just move it inside the click function:
$(".search-button").click(function() {
var searchString = document.getElementById("search-text").value;
...
oh man , how did I do that, so stupid of me
I am looking at that for hours :smile: , thanks @Fourbits
mitulislam sends brownie points to @fourbits :sparkles: :thumbsup: :sparkles:
:cookie: 343 | @fourbits |http://www.freecodecamp.com/fourbits
Sometimes it's easy to miss the most obvious things :)
can anyone tell me that how can i make a box when the search icon is clicked do i need to create a box or what ?
really stuck at it
https://codepen.io/FreeCodeCamp/full/wGqEga/
really stuck at it
https://codepen.io/FreeCodeCamp/full/wGqEga/
@MathewtheCoder these may be helpful: :sparkles:
@ndburrus Thanks man is there any textbook related to this what about eloquent javascript
mathewthecoder sends brownie points to @ndburrus :sparkles: :thumbsup: :sparkles:
:star2: 1103 | @ndburrus |http://www.freecodecamp.com/ndburrus
@MohammadHasham What exactly do you mean
i want to ask that in this codepen haas the icon when it is clicked a box appears hoe can i make that
@MathewtheCoder
hi guys.... beating my head against a wall here. I have a jquery slideToggle function that works on codepen but not on github pages... I have no idea how to freaking fix this and have tried all sorts.... is there a nuance that I don't know about?
Can anyone help explain to me why the parent needs
position: relative; in order for vertical centering to work? http://codepen.io/woofiewilly/pen/RRyRLV
Look at classes five and six
@daansteraan there is a issue with https and http request if you are getting data/image from and http request(ajax call/api). github page is https supported ,so http ajax call won't work
how do you fix that though @MitulIslam ?
@MohammadHasham So you want to now how to generate the box seen in this codepen.
Sorry for the late reply
Or, @MathewtheCoder , have any ideas?
I found the opposite solution where you can force your site to use https, but it doesn't seem to work the other way around. https://gist.github.com/konklone/9968713
find api that supprots https , use that instead of http api/ajax call @bgeraci714
find api that supprots https use that instead of http apiajax call @bgeraci714
nothing found
nothing found
okay, thanks for the tip. Weird that there's not a better work around =/
(thanks @MitulIslam )
bgeraci714 sends brownie points to @mitulislam :sparkles: :thumbsup: :sparkles:
:cookie: 271 | @mitulislam |http://www.freecodecamp.com/mitulislam
tell me a little more and give me github project link, let's see there is anything I can do @bgeraci714
I recently found an error in my twitch api project in which if a channel is closed my entire app will stop working as some error occurs.So i want to know how to use fail() of getJSON to handle failed requests
function getData(id) {
var url = "https://api.twitch.tv/kraken/streams/" + id;
return $.getJSON(url); // this returns a "promise"
}
Yo, I haven't done the styling, but does my weatherapp work for you guys?
@CrumrineCoder Yep it works
@daansteraan these may be helpful: :sparkles:
- jquery/jquery#2308
- jquery/jquery#2591
- julianshapiro/velocity#276
what is the best way to make a page responsive (not huge resolution changes but small)
like for eg: I tried using direct numbers for margin....that was bad
then I tried %....better
I've heard rem..em? may help.
@checkmate-bitch well using em for fonts and % for positioning and all can help
How do you solve this without bootstrap using vanilla cs
@MathewtheCoder how do you go about building a site? How do you come up with a logical structure.
Right now I first finish the html and then accordingly I use css.
Well theres a great video on devtips about greating a website from scratch that might help you
I personally suggest you to learn css properly if you get a proper grasp of box model that is how to use padding margin and border you can create some nice websites
And also look into display and positioning in CSS.This article is pretty nice.
CSS Positioning 101
CSS Positioning 101
@MathewtheCoder So what should i do?
thank!
hello for the weather app. does anyone know if the temp is originally in Celsius or kelvin
nvm it's in kelvin
@mpettaw2 but you can ask for it in your url to be in imperial or metric
@sorinr ok, you always seem to find me lol
i just wrote the formulas to convert the temps
but i will remember that next time
That feeling when the core functionality of your project actually works ^.^
@bgeraci714 nice
For the weather app, is there a way to get the location without HTTPS? Because when I use HTTPS, I get a mixed content error with the API call.
Hi, I have a question about scope of var in jquery.
Here is my code
This message was deleted
$(document).ready(function() {
$("#input1").keypress(function(event) {
console.log(event);
if (event.keyCode == 13) {
$.getJSON("https://www.crossorigin.me/https://en.wikipedia.org/w/api.php?action=query&format=json&list=search&srsearch=" + $("#input1").val(), function(json) {
var html = "";
json.query.search.forEach(function(val) {
html += val.title + "<br>";
$.getJSON("https://www.crossorigin.me/https://en.wikipedia.org/w/api.php?format=json&action=query&prop=extracts&&exsentences=1&titles=" + val.title, function(json) {
html += Object.values(json.query.pages)[0].extract + "<br>";
$(".result1").html(html);
});
// Now a different json
});
});
};
});
});
what is your question @designBuildShipSoftware
My question is if I put '$(".result1").html(html);' below '// Now a different json', the brower won't show the extract, and I wonder why not
because then it's executing before being populated by the return of the ajax
so it is techincally updating it, but with an empty string
if you want to see that to confirm, give .result1 element a value first
you'll see that it removes what you put there
make sense?
with where you're updating it in your paste, html has a value set at the return of the getJSON
moving it out of that function though, it tries to update the $('.result1').html() before the getJSON comes back
at which point the html variable is the empty string it was initialized with
i will take your silence as confident understanding
:)
@badc0ded Oh, I see. So if I want to add the data from getJSON to var html, I will have to put html+= in the scope of that getJSON function.
I am still thinking
correct
because it can only have that data upon a successful return
but the execution of the other code doesn't stop while that call is out
anyone here finish the pomodor app? how did you create the timer? my prototype is using setinterval to update the time but i’m realizing i need a way to hook into the timer’s last callback (i.e., when it finishes)
@badc0ded This makes sense now. Thank you Sean:)
designbuildshipsoftware sends brownie points to @badc0ded :sparkles: :thumbsup: :sparkles:
:cookie: 427 | @badc0ded |http://www.freecodecamp.com/badc0ded
no problem, i'm glad i could help
@Travmatth there are different ways to do it depending on your approach
mostly react + redux
i've actually not done enough with react to be a real help on that one
sorry
doesn't it sweet? :smile:
function sweet(...args) {
return args;
}
sweet(...[1, 2, 3, 4, 5]); // [ 1, 2, 3, 4, 5 ]
what did I do wrong?
{
error: "Unprocessable Entity",
message: "Channel 'brunofin' is unavailable",
status: 422
}
I need help with JSON call on twitch project.
I am unable to access the data that has an error from my JSON call
I am confused :0
@mikebeers check for typos
Chances are that user doesn't exist, hence the 422
I was looking at another pen for the twicth app and they had
I do not understand the callback=?
Yeh, it was interesting looking at some of your stuff, some of your ajax (.get, etc.) calls are different from what I've seen before
The "callback=?" would be to make the asynchronous work
I have JSONVEIW installed on chrome and it returns nothing but with out the callback I get a response
Yeh, but if you change Beohoff to brunofin
you'll get the same error
Just searching through twitch, that looks to be the problem
there's not a "brunofin" user, so the server returns an error
I am going to try and work with new info.
This might be helpful to explain the "callback=?" part of it. Good Luck!
@Rom2711 thanks I will look at this now
mikebeers sends brownie points to @rom2711 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for rom2711
Hi. Anyone feeling helping out on the personal portfolio? I’d love some feedback on the technique for keeping the divs connected to each other. Also on techniques for centering the content in the well.http://codepen.io/aarmand/pen/dXmjor
pretty old-fashioned looking !
lol
thanks @lpy1994
aarmand sends brownie points to @lpy1994 :sparkles: :thumbsup: :sparkles:
:cookie: 205 | @lpy1994 |http://www.freecodecamp.com/lpy1994
take a look at mine, Just finished recently.
nice
I am new to this thing as well, best advice I can give you is to copy others that you like
and then gradually form your own style.
yeah, thanks. Sounds good. I think thats how most folks do it. Learn by doing.
yeah man, just keep coding
@lpy1994 will do
Can someone please help me with this code for the simon project, I am trying to have the start button start the main game function but I can't seem to get it working properly, thank you
function game(){
starter();
console.log(start);
if (start == true){
beeper();
}//ends if start == true statement
}//ends game function
all of the functions are made separately and can be seen in this codepen if it helps http://codepen.io/Ryanwfile/pen/GqdNBo