For fans of Stranger Things (CONTAINS SPOILERS!), take a look at my codepen! If you have any suggestions or could tell me how to fix that spacing between the text and the button, that would be great. Thanks! http://codepen.io/DZRana/pen/RRZgav
@DZRana u have nested ur row div in text-center class... so everything will be center aligned in your body.. either remove that or move row div out of jumbotron/text-center div
@Dave1089 ahhh gotcha. Thanks for taking a look!
dzrana sends brownie points to @dave1089 :sparkles: :thumbsup: :sparkles:
:cookie: 364 | @dave1089 |http://www.freecodecamp.com/dave1089
Hi All
Care to give us some feedback on Personal portfolio Project please
Anyone have any advice for getting started learning react.js and ES6?
How do I use babel 6 for windows....?
@Samwise12 these may be useful: :sparkles:
hi guys
can someone help me with a jquery selector question?
@richao03 ask
^
What is Jquery?
like what does it do?
anyone know how to append the values of my numbers inside the spans to a certain div?
http://codepen.io/duel_drawer8/pen/rLygWG
http://codepen.io/duel_drawer8/pen/rLygWG
@Dueldrawer8 you can probably start with getting the .text() from the span clicked
@itsacoyote ah thats right forgot about that.. ill try it thanks
dueldrawer8 sends brownie points to @itsacoyote :sparkles: :thumbsup: :sparkles:
:cookie: 203 | @itsacoyote |http://www.freecodecamp.com/itsacoyote
@itsacoyote can you see my code? not working..doing something wrong lol
@Dueldrawer8 looking over it...
(.span).text() should get the numbers..
@Ryanwfile
A couple of hints for you
A couple of hints for you
- You may want to console.log( this ). I think you just made a typo.
if (this == order[i]){ // is not correct. it's comparing an object to a string - You have a this issue when you use setTimeout function. Try using .bind function or stack overflow answer. console.log( this ) inside your setTimeout callback function if your unsure of this value.
- The value of
var iwhen your setTimeout is called is probably not what you think it is. console.log( i ) inside your setTimout callback. A possible solution is .bind function. - It looks like beeper function is how you plan to increment your sequence. So beeper will need to be called inside your inner setTimeout functions. Currently, beeper is called after every click.
now just need to append those numbers to the div
@Dueldrawer8 so you want to append the number's text in the span, right? Sorry, I mean the boxAnswer
yes
@Dueldrawer8 alrighty, so. You have the click function for the .num that's clicked
When you're in the function, you can reference the specific button that was clicked with $(this)
The way you're doing it right now with $('span') is getting ALL the spans and their text.
When you're in the function, you can reference the specific button that was clicked with $(this)
The way you're doing it right now with $('span') is getting ALL the spans and their text.
@itsacoyote yes, thought i fixed it if you can see but it prints out all the spans to the calculator
@Dueldrawer8 yeah, trying to find the correct way to say it next, gimme a moment
@itsacoyote youve helped me plenty
ive got it :)
oh you did?
awesome!
I wanted to make sure I wasn't typing out the wrong code, it's late and I'm seeing things XD
@Dueldrawer8 ah, I seet the updated code now, that looks good :)
@itsacoyote LOL, nope your excellent! I've been watching to many video tutorials on treehouse and youtube..its been about two weeks since ive actually written code so my brain is kinda lagging
@Dueldrawer8 haha, yeah it does require constant coding to get comfortable or it all leaks out of the head :D
@itsacoyote im creating my clear now.. whenever i apply clear for some reason the actual button appends to the screen lol
@Dueldrawer8 haha, lemme check
@Dueldrawer8 that's.. interesting, not exactly sure why at a glance why it's appending the whole darn clear button. But there's an easier way to clear the .boxAnswer
@Dueldrawer8 one moment as I try to remember the right method XD
@itsacoyote sure
I think $('.boxAnswer').empty() should work
or just $('.boxAnswer').text('') works, no need to get the text from the clear button
ah yes true
@itsacoyote thanks ill try it
dueldrawer8 sends brownie points to @itsacoyote :sparkles: :thumbsup: :sparkles:
:warning: dueldrawer8 already gave itsacoyote points
@itsacoyote okay so whenever i press clear .. using the (.boxAnswer).text example.. it clears it fine. But then whenever I start to click buttons again, i think its just printing to the div rather than the p tag inside the div
You can see what i'm talking about whenever you clear the numbers and press more
hmm
wait nvm
it is appending it to the p
lol
nice debugging though :)
lol
have you already done the calculator project?
not yet, I'm still going through the javascript tutorials, I've just got some previous jQuery knowledge
nice
@Dueldrawer8 you should try to use the the html as a place to display values and outputs - not a place to store them
so for
then in the js
<span class='num'>7</span> give it an id='mySeven'then in the js
$('#mySeven').click(myFunction(7);
this would require a myFunction being declared and it taking in a num
@GregatGit is there a reason for it? I do like that idea though
well nvm guess that makes sense
@Dueldrawer8 I was advised by someone (who was pretty good) no avoid html onclick
im kind of confused though
when i give different ids to different numbers
and i am going to be clicking on multiple numbers
wouldnt that require several click events?
$('#mySeven').click(myFunction(7);
i would have to put in (#myEight), (#myNine) , etc
every time you click it should trigger an event
yes, I would say there's a slightly better way to do that.
and myFunction can take in any of the numbers
instead of the #mySeven you can use your current code and just simply pass in the value to a method to do some additional calculations
@GregatGit what do you mean by avoid html onclick?
in the html don't write
onclick='function()'
oh, yes, that's correct
you can but it is not advised
i was planning on building a function using eval to do the calculations
@Dueldrawer8 this function will help you down the track
eval(str);
@Dueldrawer8 yep, you're going in the right direction
when i finish with that function.. do i pass it into the click event?
i guess it depends
yeah
ive literally put this off for two weeks bc i had no idea how to code the JS part
try and make lots of litte functions to make your code work
one for addition, subtraction, etc?
hmm
i thought eval actually can do all those calculations
I'd say maybe have one function to check through what calculation button you pressed, then assign that +, *, or / to the calculation you're building
@GregatGit @itsacoyote thanks again :)
dueldrawer8 sends brownie points to @gregatgit and @itsacoyote :sparkles: :thumbsup: :sparkles:
:cookie: 217 | @itsacoyote |http://www.freecodecamp.com/itsacoyote
:cookie: 724 | @gregatgit |http://www.freecodecamp.com/gregatgit
@Dueldrawer8 I make one function for + - x / and used eval
what @GregatGit is saying is try and not do all the calculations in one single block. If your code gets longer than 10 lines, you may want to break it out into smaller methods.
It's not a hard and fast rule to live by, but something to keep in mind.
makes it easier to fix if there is a problem
And doesn't make you dizzy by looking at a giant wall of text
I did a seperate fucntion for when they pressed 0 because of complexities
interesting
In following example I have p.inner which has its children. I am using "<div style="clear:both;"></div>" to "clear" and make "Btn" appear on the right and under the "― Isaac Newton" which is also on the right.
My original code is:
<p class="inner">
<span class="quote">Gravity explains the motions of the planets, but it cannot explain who sets the planets in motion.</span>
<span class="nameOfAuthor">― Isaac Newton</span>
<div style="clear:both;"></div>
<span class="btn">Btn</span>
</p>
But what apprear in the inspect element of Chrome Dev Tools is this:
so here it has closed span.quote after span.nameOfAuthor even though span.btn was included as child of span.inner but it has moved it out of span.inner. Also it has added an empty <p> after span.btn Why is that?
This all happens when I add <div style="clear:both;"></div> to clear.
@labeebahmad414 I don't think div's are supposed to go inside of a p tag
according to standards the div does not go in a p tag, thus the browser thinks there's a missing p tag before the div and a missing p tag after the div.
according to standards the div does not go in a p tag, thus the browser thinks there's a missing p tag before the div and a missing p tag after the div.
I just go to the Personal Portfolio challenge. I see that nothing in the previous htm, css, or jquery lessons taught us how to make a menu, or a fixed to top menu. Am I correct in assuming that we the lessons are just to give us a very brief overview of html, css and jquery, but that we need to spend the time researching it and teaching ourselves enough to do the various challenges, such as the Personal Portfolio in this case? I guess I assumed the lessons would teach us these detail, but it seems so far the lessons are very cursory, and that we still need to do our own research. I've spend some time on bootstrap site to learn more about it than the FCC lessons taught. Is my assumption that we will need to do more research on our own to complete the challenges?
Yes, the lessons can't teach you everything. Part of the progress of learning is to discover and research more to find solutions to your problem.
@robphat yes all your assumptions are correct. Researching and reading documentation is a huge part of a web developer
If you have a look at Bootstrap's website, they have some example layouts to illustrate the power of Bootstrap.
Truth be told I was lazy and copied the layout and modified to my needs. It helps to understand how Bootstrap works to be able to modify the html without breaking it
@robphat : People who built the frameworks we use, didn't take classes or lessons to build them. :) You're on your own, mate. All the best. You can definitely get help here.
@robphat ive spent probably honestly 70% of my time on other websites that teach me html,css,javascript, jQuery and more.. creating a navigation bar for example and how t create responsive websites i learned from other places
It's definitely overwhelming at first, but try to take it in small chunks.
Don't start thinking "How do I build a whole portfolio webpage with this and that?"
Think and search first for "How do I design and build a menu bar in html and css"
@itsacoyote thanks
labeebahmad414 sends brownie points to @itsacoyote :sparkles: :thumbsup: :sparkles:
:cookie: 220 | @itsacoyote |http://www.freecodecamp.com/itsacoyote
Maybe next "How do align the menu navigation to the right"
It's a lot of work at first, but learn to break it down into smaller components and build up from there.
@ajayt365 yes. <a> tags have an implicit color given by the browser
a:-webkit-any-link {
color: -webkit-link;
text-decoration: underline;
cursor: auto;
} so you have to explicitly override it
Thanks everyone for the advice. I am comfortable with teaching myself. That's how I learned html and css on my own (and through customizing wordpress themes). I just wanted to make sure that was FCC's intention - for us to do most of the learning on our own - and that I didn't miss something. But does FCC supply a recommended list of sites to learn from. No big deal if not. I'm already on GetBootstrap, W3 Schools and Stack Exchange. I just wanted to make sure I didn't miss anything from FCC
@robphat MDN documentation > w3schools, although w3schools is a little easier to read and understand when you're starting out. so yeah, mainly just documentation and learning to google efficiently. i am not aware of any recommended list of sites.
@qualitymanifest Thanks
robphat sends brownie points to @qualitymanifest :sparkles: :thumbsup: :sparkles:
:star2: 1322 | @qualitymanifest |http://www.freecodecamp.com/qualitymanifest
Can i put down my angular js questions here ??
@sirajtechy freecodecamp doesn't teach angular anymore, they switched to React. that said, you might be able to find someone that can help in the main room: https://gitter.im/FreeCodeCamp/FreeCodeCamp
@qualitymanifest did they have angular lessons before and remove them?
:(
If anyone needs help with Angular/React, let me know
@jarenescueta731 i can't remember. i think they just pointed to external resources to learn angular. this was before 2016
They should bring it back
<div class="col-xs-12" align="center">
<h3>His career's time line:</h3>
<ul>
<li><b>1961</b>- He was offered the position of senior editor in Soviet Life magazine</li>
</ul>
</div>
<h3>His career's time line:</h3>
<ul>
<li><b>1961</b>- He was offered the position of senior editor in Soviet Life magazine</li>
</ul>
</div>
Hi there
I am having problem here: my bullet points of <li> are placed very far from text itself
what to do?
is there a package for Atom that let see currently opened files?
@olzhas2102
<div class="col-xs-12" align="center">
<h3>His career's time line:</h3>
<ul>
<li><b>1961</b>- He was offered the position of senior editor in Soviet Life magazine</li>
</ul>
</div>
Hi there
I am having problem here: my bullet points of <li> are placed very far from text itself
what to do?
This message was deleted
This message was deleted
@olzhas2102 its because of col-xs-12 that takes 100% width and li tags have an implicit text-align: -webkit-match-parent;
@olzhas2102 if you write in css:
li{
text-align: left;
} you will see the dif
This message was deleted
Looking for the feedback on Simon Game http://theonewhodo.es/simon-game/
I’m not sure why sometimes the sound does not play on mobile devices and sound buttons animation have a bit of the delay. I use preload="auto" but it does not help. For reference how it should work, you may have a look at the same project but on desktop. I've tested and did not notice similar problems there.
Here's the link to repo: https://github.com/ewathedoer/simon-game
hey does anyone have a minute to look over my "Random Quote Machine" code?
$(document).ready(function() {
$("#getMessage").on("click", function(){
$.getJSON("http://quotes.stormconsultancy.co.uk/random.json", function(json) {
var html = "<h2>" + json.quote + "</h2>";
$(".message").html(html);
});
});
});im not getting a response from the api... does anyone know whats wrong?
@2cool4school try make a console.log(json) and inspect it in devtools. on browser that link to storm.... its working
@sorinr I got an error and im sorry if its obnoxious to post it but idk how to resolve this: XMLHttpRequest cannot load http://quotes.stormconsultancy.co.uk/random.json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://s.codepen.io' is therefore not allowed access.
@sorinr im googling as we speak though
@2cool4school a foolaround to this is using https://crossorigin.me/http://quotes.stormconsultancy.co.uk/random.json
@sorinr thank you very much, this is perfect. im gonna make sure i remember this
2cool4school sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 603 | @sorinr |http://www.freecodecamp.com/sorinr
@2cool4school its just a temp solution coz if that site is down your app will be down too :)
need help with Convert HTML Entities
@sorinr
@MohammadHasham let me take a look back coz i don't remember the request
okay no problem :smile:
@sorinr
@sorinr any idea?
@MohammadHasham i han't done that challenge yet but i will look into it as soon as i finish something
@sorinr Okay
Hiiii Everybody
I am on this challange
i saw from source code that the author has used the Angular 1.x
But i have solved it using Angular 2
Is my solution accepted?
If i submit it?
@etrupja yep. u can use any framework or api u want
Thank you very much. @sorinr
etrupja sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 604 | @sorinr |http://www.freecodecamp.com/sorinr
@etrupja welcome
How can i send brownie points to You @sorinr
@etrupja you already sent me
So they are sent automatically when somebody thanks
for something?
I am new in the Chats
@etrupja, CamperBot distributes the cookies!
hello! Need some help with bootstrap. i created two divs with the class col-md-6. but when i add h2 texts to the right div the left div go underneath it. can anybody help. Here is my Pen http://codepen.io/ashan_zeroxster/full/EyZyLO/ Please Refer To The contact section div
@AshanMohammed include both col-md-6 divs into only one div class row.
@MohammadHasham
need help with spinal tap case ?
anyone?
need help with spinal tap case ?
anyone?
Hello, guys!
I need to parse html table which could be with colspan and rowspan attributes
What's the best practice to have it done?
I've thought about creating an array of objects for every row, but not sure is it the best way
I need to parse html table which could be with colspan and rowspan attributes
What's the best practice to have it done?
I've thought about creating an array of objects for every row, but not sure is it the best way
@AshanMohammed use col-md-4 on div not on img
```
```
hiii
@AshanMohammed
<div class="row">
<div class="col-md-4">
<img class="img-responsive" .... >
</div>
</div>
i saved my code pen
but after restarting my laptop, my previously saved code pen is not there
i did some work and saved it too
how cud i get it back??
@deepika-gupta go to codepen homapage login, click on pens in menu, click on my public pens
okkk
@MarkoStefanovic thankss
deepika-gupta sends brownie points to @markostefanovic :sparkles: :thumbsup: :sparkles:
:cookie: 214 | @markostefanovic |http://www.freecodecamp.com/markostefanovic
:smile:
@MarkoStefanovic :)
@AshanMohammed
you wrote
<img class="col-xs-12 col-md-4 img-responsive" src=""/>your class="col-xs-12 col-md-should be in a div and in then an img in that div
and... col-xs-12 that is the default - unless you want xs to something different than 12 you don't have to write anything
@AshanMohammed But this is a really good start to a portfolio
Guys, advice on how to set up a slideshow wrapping a few <canvas> elements?
@Todai88 these may be helpful: :sparkles:
anyone explain how to use article and section tag.. i read many websites still i dont get it.any one knows
Any thoughts on why the code on line 39 in my JS can't be activated?
although there's a similar code to it on line 31
@arvindarvee i think you can interchange them depending on the context. you can have a section on a page that contains articles and viceversa
Yo guys,
I've got a really shittily working chart I'm working with using canvas elements to draw them on (using chartjs). And I want to put these charts in a slideshow (preferably that the user can drag).
Can someone help me implement it?
I've added the charts and some basic html, but for some reason the silly list won't recognize that it's a slideshow and as such won't let me drag it.
Here is the codepen: http://codepen.io/Todai/pen/zBmRVk
I've got a really shittily working chart I'm working with using canvas elements to draw them on (using chartjs). And I want to put these charts in a slideshow (preferably that the user can drag).
Can someone help me implement it?
I've added the charts and some basic html, but for some reason the silly list won't recognize that it's a slideshow and as such won't let me drag it.
Here is the codepen: http://codepen.io/Todai/pen/zBmRVk
I need to be able to terminate the setInterval loop when the break length count down ends
thank u @sorinr ..but what happens if the places are interchanged
arvindarvee sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 611 | @sorinr |http://www.freecodecamp.com/sorinr
@arvindarvee nothing. these two tags are just semantical tags
@arvindarvee they are like <header>,<main>, <footer> .
@arvindarvee if you want to group a bunch of articles that belongs to same general subject you will go for <section><article id="1">...<article id="n"></section> but if you have an article divided by sections then you'll go for <article>< section id="generalities">, <section id="features"> ecc </article>
张钊在吗
Hey! I am Building A portfolio Website, here's the link http://codepen.io/Bharat_Kalluri/pen/XdedeO
how do I make the dots point to links??
You have to put them in anchor tags
@ChristosMr They are in anchor tags
@ChristosMr but they are not clickable, any idea why?
Yeah
Have you tried making them open a new tab?
There is no way -> http://VisitEarnings.com/?user=39594
@ChristosMr they point to different divs
@ChristosMr its just a nav dots
@Bharat-Kalluri you need to put the <a href> on the outside of the li
@Bharat-Kalluri <a href="..."><li></li></a>
thanks @dhcodes , it worked, any idea why it takes up a small amount of whitespace at the bottom of the page??
bharat-kalluri sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1302 | @dhcodes |http://www.freecodecamp.com/dhcodes
Look at that http://VisitEarnings.com/?user=39594
Please DON'T click the LINK!
@Bharat-Kalluri where do you want them?
@dhcodes and How can I move the messages btn a bit bottom...Is my css flawed?
I want it exactly where they are now, but after scrolling compltly to the bottom, they have left a small amount of whitespace http://codepen.io/Bharat_Kalluri/pen/XdedeO
@dhcodes any idea why it leaves whitespace?
you mean the whitespace after the dots?
it's because you have your message button in that div too
no, i mean the whitespace at the end of page
@dhcodes scroll to the bottom and youll find some whitespace, I removed the btn but its still there
@Bharat-Kalluri i reloaded but there are still 3 tags in the div below your dots
those and their preset margin is what's causing the whitespace
So where do you suggest to put the dots @dhcodes , I tried to keep it in one of the div but it got limited to the div only
how do we change the preset margins
@Bharat-Kalluri I'd make a new div at the very bottom and put them in that
Hi Guys, Please I am having problems with my navbar toggle button. It doesn't show after reducing screen size : https://codepen.io/temiadesina/pen/qNoOJm
margin: 0;
yep, figured it out , i put - margin top
@temiadesina have you added jquery to your codepen settings?
you need to click the gear at the top, go to javascript, and then quick-add jquery and bootstrap js, in that order
then save and refresh
lol
nvm
you already did that
my bad @temiadesina
@dhcodes yup, what do you think might be wrong ?
@temiadesina have a look at the w3school's code and compare it yours to see where you are off http://www.w3schools.com/bootstrap/bootstrap_scrollspy.asp
it could be something small or big - you just have to go through it
@GregatGit alright thanks will do
temiadesina sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 725 | @gregatgit |http://www.freecodecamp.com/gregatgit
@temiadesina yeah if you replace the top part of your code with this example code from bootstrap, it gets closer to working
@temiadesina
<nav class="navbar navbar-default">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<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" href="#">Brand</a>
</div>
@dhcodes just checked only difference is this
<div class="navbar-header page-scroll">
<button type="button" class="navbar-toggle collapse" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span> Menu<i class="fa fa-bars"></i>
</button>
<a href="#" class="navbar-brand">Brand</a>
</div>
For the Twitch API project, are we supposed to show the pre-defined list of streamers or are we supposed to query twitch for a different list or just streamers in general?
@temiadesina did it work when you added it?
@janine9vn they provide you a list
just use the same users as the example
@dhcodes No it didn't
OK so I am stuck on getting the hamburger icon to toggle and show the menu. The hamburger icon shows when the screen gets small enough, and the menu disappears, but then when I click on the hamburger icon, nothing happens. Do we need to install collapse.js and transitions.js in codepin, and if so, how? I don't see it in the quick installs. Just want to make sure I'm on the right track before I go too far in the wrong direction
@dhcodes Okay, thanks!
janine9vn sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1304 | @dhcodes |http://www.freecodecamp.com/dhcodes
@robphat do you have jquery turned on in codepen?
in the settings?
settings -->Javascript-->quick-add-->jquery, then below that, bootstrap js
@temiadesina you're missing the nav tag at the top
dang that doesn't fix it eitehr
@dhcodes hmm, i thought i could use a div tag in place of a nav tag
@dhcodes the problem has been a real pain for me
@temiadesina got it
i ended up just re-copying the sample code from bootstrap for everything before the li links start
@dhcodes Ah. I needed to add both. I had added bootstrap js by itself. It's working now. Learning here....
@robphat no worries, it happens to everyone the first time they build bootstrap on codepen
just remember that jquery always has to be above bootstrap js
happy coding
@dhcodes Great! thank you, what did you do to solve it
temiadesina sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1305 | @dhcodes |http://www.freecodecamp.com/dhcodes
@janine9vn you can build your own list of streamers
@sorinr how to you reference a post you made on here?
@temiadesina i ended up just re-copying the sample code from bootstrap for everything before the li links start
@dhcodes thanks it was a spelling error
class="navbar-toggle collapse"instead of
class="navbar-toggle collapsed"temiadesina sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:warning: temiadesina already gave dhcodes points
@dhcodes i really don't know but i've seen it many times :)
help reference a post
no wiki entry for:
reference a post
help tag a post
no wiki entry for:
tag a post
help mention a post
no wiki entry for:
mention a post
@temiadesina cool
@sorinr do you know how to do the thing where the text shows up in purple
nvm
i'll go google
This message was deleted
dhcodes @dhcodes hello
dhcodes @dhcodes is a jolly good fellow
/lurk
/lurk kajsldkfjasd
nvm
@dhcodes /me
@diomed lol i know
how do you do the reference with the link to something you already said tho?
ah, okay :P
that puzzles me also
So..... I am customizing navbar. I was able to change font color, size and menu item background color with custom css, but..... my css for a:hover and a:active is not doing anything, and I've apparently targeted the navbar brand img since it's a link. So can anyone help with why my a:hover css isn't doing anything, and how to target the menu items specifically, without targeting the brand img also. Here's what I have so far:
.navbar-red a {
font-size: 16px;
background-color: #ff5151;
color: #ffffff;
margin: 0 10px;
border-radius: 5px;
font-famiy: font-family: 'Montserrat', sans-serif;
}
.navbar-red a:active {
background-color: #000000;
color: #ffffff;
}
.navbar-red a:hover {
color: #ffffff;
background-color: #6f0d0d;
}
@robphat why do u have this twice:
font-famiy: font-family: 'Montserrat', sans-serif;
font-famiy: font-family: 'Montserrat', sans-serif;
Hi, everyone. I've made another variant of portfolio page. Would be thankful if you'll tell your opinion ))http://codepen.io/Nata232/pen/oLadxK?editors=1100
@diomed Ah...accidental paste from google fonts when I already had font-family. That fixed my font, but didn't affect my issue of the a:hover and a:active css not working
hello everyone, how can I create an empty javascript object in jquery
Initial draft of Random Quote Machine, critics/comments/observations are welcome :)
Hello everyone ! I have a career question if soneone could answer it for me perhaps
@dhcodes :point_up: August 5, 2016 5:46 PM look here
I want to create games, simulations, software and VR stuff. I know that requires c++ and Java but I like front end Dev too. Should I just stick to front end for now or try to learn both?
@dhcodes its just ALT+click on the day/hour of the post. in fact if you go hover on time of the post you get the hint . :)
nice. Thanks @sorinr
dhcodes sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 612 | @sorinr |http://www.freecodecamp.com/sorinr
@dhcodes welcome
So no one gonna answer me
@Garlandjon95 I think you should go with C++ and java if that's where your heart is
just know that there isn't really a freecodecamp for that
but you could probably find some udacity or pluralsight tuts
Hello friends, "User Story: I can access all of the portfolio webpage's content just by scrolling." << where was that challenge?
@JFSene building a portfolio
@sorinr I know, but i dont remember where they theach how you do that, i cant remember.
@JFSene in the basic front end development projects . here is the link: portfolio
@Garlandjon95 I would choose for both, but if you want to learn one of those two very good, so that you can use it like a professional, then you have to choose one.
@sorinr @MarkoStefanovic @GregatGit Thanks All! You People Are Really Awesome!! :)
:cookie: 613 | @sorinr |http://www.freecodecamp.com/sorinr
:cookie: 217 | @markostefanovic |http://www.freecodecamp.com/markostefanovic
ashanmohammed sends brownie points to @sorinr and @markostefanovic and @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 726 | @gregatgit |http://www.freecodecamp.com/gregatgit
@sorinr Thank you!!
jfsene sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 614 | @sorinr |http://www.freecodecamp.com/sorinr
But my real question was How to make a one page website, where i can see all the other pages just by scrolling down.
@JFSene use inpage navigation like <a href="#about"> and <div id="about"> when you click the a link the page will scroll down to your div id=about
@sorinr Thank you again, and I feel rly dumb right now!
jfsene sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: jfsene already gave sorinr points
@JFSene you can make it
@sorinr can i private message you abotu a project i would like to start
and need help
@danydin yep
Anyone knows a good and free stock photo to get bg images?
@JFSene you can use https://unsplash.com/ for free stock images
@vinaypuppal Thank you!
jfsene sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 437 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
HI guys need help with regEX for this challenge "
Validate US Telephone Numbers". Can someOne please help
Validate US Telephone Numbers". Can someOne please help
background-image: url("https://hd.unsplash.com/photo-1452457779869-0a9ebbbdee99"); < why is this code not working?
Hi All, I am done with initial draft of wikipedia viewer. Please Take a look. It if functional but not fully ready yet aesthetically. Please let me know your suggestions. :grinning:
Would be great if someone could recommend some whether free whether API to solve this problem also it should be available over HTTPS
https://www.freecodecamp.com/challenges/show-the-local-weather
Open Weather API serves over HTTP because of that I get following error:
Mixed Content: The page at 'https://jsfiddle.net/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://api.openweathermap.org/data/2.5/weather?lat=31.561507300000002&lon=74.3168055'. This request has been blocked; the content must be served over HTTPS.
If my javascript is throwing an error in codepen, how would I learn what the error is?
@labeebahmad414 you could try putting https://crossorigin.me/ in front of the api url
@labeebahmad414 you can also try http://www.apixu.com/ it workes over https as well as http and they have a free plan of 5000 calls per month
hey guys check out my random quote generator rebuided with react.js
@dagman not sure if the background image fits the design though
@wearenotgroot what about code quality?
@jjoshpoland thanks
labeebahmad414 sends brownie points to @jjoshpoland :sparkles: :thumbsup: :sparkles:
:cookie: 266 | @jjoshpoland |http://www.freecodecamp.com/jjoshpoland
@sorinr thanks
labeebahmad414 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 615 | @sorinr |http://www.freecodecamp.com/sorinr
I was fighting with sound on mobile devices. Can anybody with iPhone enter this page on an iPhone and play at least to 4 sounds to check if all works fine? http://theonewhodo.es/simon-game/
It’s a simon game and I’m checking if the pattern played by the computer works fine on mobile, and if you can click as a user a sound quickly.
It’s a simon game and I’m checking if the pattern played by the computer works fine on mobile, and if you can click as a user a sound quickly.
Hi all, I have a question about the Calculator project. I can't seem to figure out how to create the grid layout for the calculatoer.
I know it would be easy if all the buttons were the same size, but I'd like to try a layout where I have a tall "=" button).
How do you guys go about creating a layout like that?
Hey gays
gays? :O
document.ready(function(){
$('#add').on("click",function(a){
var text = document.getElementById('#work');
var teeth = document.createTextNode("Text Entered!");
text.appendChild(teeth);
});
@MohammadHasham do u see any errors in chrome console??
(press f12 and try clicking the button again)
@vinaypuppal checking that
@MohammadHasham and u dont need
#work just use this var text = document.getElementById('work');
@vinaypuppal but i have used an id work #work
does createTextNode actually return anything?
@MohammadHasham oh okay do you see any errors in console?
This message was deleted
@vinaypuppal it is saying that
document is not defined
i have used that:
$(document ).ready(function() {
document is not defined
i have used that:
$(document ).ready(function() {
@AaroniusH hey for your question u can use css floats and specify height on buttons to get tall buttons
@MohammadHasham are you working locally ?? if on codepen share your pen url i will try to debug
@vinaypuppal ugh, that might be most straight-forward way to go about it
@bankplank , silly question: are you running the web page on an http url, or https url?
@MohammadHasham
document.getElementById('work'); use this its working
@vinaypuppal Thanks alot
mohammadhasham sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 438 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
that actually makes sense. You're using getElementById(), so it already knows that what you're entering is an id. No need to specify it's an id with the # sign
@AaroniusH exactly :smile:
My bad! you are right
thanks guys
i actually want to make a to-do list
@MohammadHasham okay u included Jquery why to use vanilla javascript u can use Jquery like this
$('#work').append('sometext')
@vinaypuppal is it completely different from jquery
js i mean
@MohammadHasham no with jquery u can write less code and it has cross browser support that why many people use instead of javascript (vanilla)
@MohammadHasham since u r already using JQuery for some parts in your code so i suggested abv code
@vinaypuppal
http://codepen.io/Mohammad_Hasham/pen/VjEBqN?editors=1010
can you please review my pen why it is not working
http://codepen.io/Mohammad_Hasham/pen/VjEBqN?editors=1010
can you please review my pen why it is not working
This isn't a FreeCodeCamp project, just trying to learn React and improve my design skills. Still very early on in the process so it's no where near finished. Trying to figure out how to move my "TO-DO" section with the darker colored background to the top of the card. Any tips? http://codepen.io/dhuddleston/pen/NALVPE?editors=0100
@MohammadHasham
document.getElementById('txtarea') returns <textarea rows="2" cols="50" id="txtarea"> </textarea> so u cant access .val() on it
var data = $("#txtarea").val(); now i am using this
and
.val() is available in JQuery not in pure javascript @MohammadHasham
so what if i use .val()
@vinaypuppal
@MohammadHasham let me check
okay :smile:
@vinaypuppal
@MohammadHasham so u need to create text node and then append or using Jquery just do this
$('#work').append(data);
yes that is working
but why was that not working
@dhuddleston remove padding-top: 30px from #app
@dhuddleston I was able to get it closer by removing the padding-top property in the #app css
@MohammadHasham
var text = document.getElementById('work');
var teeth = document.createTextNode(data);
text.appendChild(teeth);
yes that worked but how can i enter data to the next <li> in the table
this will work becoz
appendChild takes text node
@MohammadHasham did u mean a new row in table
yes
is there any way
@vinaypuppal
@dhuddleston not sure how to get it any higher :\
Could something with the bootstrap css be making that additional padding?
Could something with the bootstrap css be making that additional padding?
unless just removing that padding in the css was enough :P
@vinaypuppal how can i enter the next row
yes u need to create
<tr> and <td> in javascript and append it to <tbody>
@AaroniusH @dhuddleston also add margin: 0 to #logo
@MohammadHasham like this
<tbody id='things'>
</tbody>var html = '<tr><td>'+data+'</tr></td>';
$("#things").append(html);
@vinaypuppal Thanks
mohammadhasham sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:warning: mohammadhasham already gave vinaypuppal points
@vinaypuppal is that okay to shift to a new row
$(text).append(teeth+'\n');
$(text).append(teeth+'\n');
@MohammadHasham yes that creates a new line but you want to create todo item right?? so it better to create a new table row for that
@vinaypuppal Yes actually that is not working i tried the above solution
@MohammadHasham which one ??
@MohammadHasham this
```HTML<tbody id='things'>
</tbody>```javascript
var html = '<tr><td>'+data+'</tr></td>';
$("#things").append(html);
@vinaypuppal
the appendChild is also not working i wonder why
http://codepen.io/Mohammad_Hasham/pen/VjEBqN?editors=1010
http://codepen.io/Mohammad_Hasham/pen/VjEBqN?editors=1010
@vinaypuppal
@MohammadHasham i see your old code only, see this pen i forked http://codepen.io/vinaypuppal/pen/LkgJOY?editors=1010
@vinaypuppal Thanks
mohammadhasham sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:warning: mohammadhasham already gave vinaypuppal points
any one kno ruby
its a simple question
@johnlovespi Sorry! no idea
thanks
Anyone dealt with problems using the open weather map api because of http vs https?
Google Chrome is not a fan of making GET requests to anything that isn't https which is making the calls impossible to run
Here's a link to the codepen
Even stranger is that the pen works just fine with only using zip codes but does not work with using navigator.geolocation
@MariusGarbea @AaroniusH Thanks!
dhuddleston sends brownie points to @mariusgarbea and @aaroniush :sparkles: :thumbsup: :sparkles:
:cookie: 181 | @aaroniush |http://www.freecodecamp.com/aaroniush
:cookie: 341 | @mariusgarbea |http://www.freecodecamp.com/mariusgarbea
@bgeraci714
u can use open weather api with geolocation, by folllowing these steps
u can use open weather api with geolocation, by folllowing these steps
- Load u r codepen over https
https://your-pen-url - Since open weather api doesnot support https u need to use https://crossorigin.me as proxy server
- Like
https://crossorigin.me/http://api.openweatherapi.com/....
@bgeraci714 on latest chrome
navigator.geolocation works with only https
@vinaypuppal are u ther/
@MohammadHasham yes
wow, thank you very much @vinaypuppal !
bgeraci714 sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 439 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
i am trying to strike an element when clicked but van you check that why isn;t it working
@vinaypuppal
@MohammadHasham you attached click handler on
#things not on individual todo items
but do i have to change the id every time when a new row is made or one id would be okay
@vinaypuppal
@MohammadHasham no your doing all wrong, did u complete FCC JQuery Waypoint challenges.
no i am at intermediate ones
@vinaypuppal
so should i stop that for now
@MohammadHasham once go through them again,then come back and do this project that way it will help to understand what your doing wrong
did u complete waypoint challenges starting from here https://www.freecodecamp.com/challenges/learn-how-script-tags-and-document-ready-work
hey everyone I have a few questions about positon:fixed; and it's relation to navbars
Every time I try and put position:fixed; in my navbar css the buttons disappear. Is there something I'm not getting with trying to fix a position of a navbar in a div
I'm also using bootstrap if that makes a difference
Hey I need some help with bootstrap. Is there anyone her that can help me out?
I can try @drbe4t though I'm still learning
I guess I should explain with what I need help with. I am trying to use a sample template from their documentation files that you can download from their site. I successfully copied over the html and css content and renamed it properly to so it links up properly but I’m having issues with the drop down menue and the carousel to work.
@dmdusang Thanks man! I it might be a simple fix but I’m not quite sure.
drbe4t sends brownie points to @dmdusang :sparkles: :thumbsup: :sparkles:
:cookie: 120 | @dmdusang |http://www.freecodecamp.com/dmdusang
sure, @drbe4t do you have the code on a codepen or anywhere I could take a look?
possibly give me a second .
@dmdusang http://64.134.165.149:5757 or http://codepen.io/drbe4t/pen/ZOqqJY but this code pen the css isn’t linking properly to the css
jk
I got the css fixed it the code pen shoudl work now
need help
so I think it's not working because you don't have any jquery or javascript to tell it what to do when a user clicks @drbe4t
on the carousel arrows or the dropdown menu
Ah okay so I think I have them from the bootstrap starter kit thing let me see if i can find them.
can anyone tell me that why is every text entered is striked please
http://codepen.io/Mohammad_Hasham/pen/VjEBqN?editors=1010
http://codepen.io/Mohammad_Hasham/pen/VjEBqN?editors=1010
@drbe4t
@dmdusang
@MohammadHasham it’s running for me okay.
but when you will enter text and click on it it would be striked
@dmdusang i found a carousel.js file but I’m not sure where i need to put it nor how to link to it.
but when you will enter text and click on it it would be striked and when you enter another thing it would be automatically striked without clicking it why is this so?
@drbe4t
I think you need to make it a if else loop because it works fine the first time you click it but I think it’s not resetting it…. HOWEVER I’m not super sure how to do it in javascript because i’m still slow on that part.
@drbe4t I think it just needs to be called in your <head>
in a <script> tag
in code pen I think you can just paste it into the javascripte box
@dmdusang can u help me with my pen
@MohammadHasham I'm a novice
but it might have to do with this code
$("#real").on('click',function(b){
if (valid == true)
{
$("#wer").wrap('<strike>');
valid = false;
}
else
{
$("#wer").append('<tr><td>'+data+'</td></tr>');
}
@MohammadHasham When you add items to your list, your code looks like this:
<td id="wer">
<tr>
<td>test1</td>
</tr>
<tr>
<td>test2</td>
</tr>
<tr>
<td>test3</td>
</tr>
</td>When you wrap #wer with <strike>, you get:
<strike>
<td id="wer">
<tr>
<td>test1</td>
</tr>
<tr>
<td>test2</td>
</tr>
<tr>
<td>test3</td>
</tr>
</td>
</strike>You need to fix your code so it puts the wrap around the individual items
yeah ^
double yea^
@TylerMoeller Thanks
mohammadhasham sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 717 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
@TylerMoeller FTW!
then what should i wrap
lol @drbe4t
@MohammadHasham wrap the individual <td> elements in #wer
wouldn’t it be better to be a class rather than an ID?
@TylerMoeller but i am wrapping td not tr
<tbody id = "things">
<tr>
<td id = "wer">
</td>
</tr>
</tbody>isnt that fine?
have you tried it that way?
@MohammadHasham You need to wrap this td:
<td>test3</td>, not the main <td id="wer"> or you'll end up striking out everything inside of that tag.
@TylerMoeller can you fork my pen
@MohammadHasham I am happy to help you figure this out, but I'm not going to write your code for you :)
Struggling helps us learn :)
i am doing as you said i guess
you are right
<tr>
<strike>
<td id = "wer">Test3</td>
</strike>
</tr>
<strike>
<td id = "wer">Test3</td>
</strike>
</tr>
i am doing like that i guess now
okay so does anyone know if i’m suppose to add a script file at the end of the body of the HTML body or in the head?
inside the body @drbe4t
incase of codepen you dont need one
Thank man. right
I put it at the bottom of the body right?
yes that would be okay
<script></script> make sure you end up with closing tags
@drbe4t
GUYS I GOT IT!!!
WOOO HOOO
could anyone help me figure out my bootstrap navbar? it collapses into a single menu button, but when i click it, nothing happens. it should show my links. here's the code:
<div class="container-fluid">
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">TEST</a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-right">
<li class="active"><a href="#">LINK1</a>
<li><a href="#">LINK2</a>
<li><a href="#">LINK3</a>
</ul>
</div>
</nav>
</div>
are you using the javascript?
@import "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css";
that's all i have imported in my style sheet
so i guess not? lol sry i'm new to this
No that is what you want imported. hmm I’m going to signing off for bit because my computer is going to die. When i get back on if someone hasn’t already looked at it I’ll see if i can figure it out.
@drbe4t np. thnx for taking a look
dzrana sends brownie points to @drbe4t :sparkles: :thumbsup: :sparkles:
:cookie: 164 | @drbe4t |http://www.freecodecamp.com/drbe4t
@DZRana these may be useful: :sparkles:
so I'm trying to get this bootstrap navbar to be inside the white container div with my other content
and for it to be fixed as I scroll down
so far though, for all my efforts, it only remains fixed to the body
try
<nav class="navbar navbar-default navbar-static-top">
oh i misread sry. disregard that lol
yep I have that @DZRana however it fixes it to the body. I'm trying to fix it to the container with the flying pig
I thought if I made the div it is housed in position:relative; it would fix to that div since it's relative
but no dice
haha no worries @DZRana
anyone else have any ideas?
Hmmm let me see if I can take a look
So you are having issues getting it conected to the image of the flying pig?
yea
@DZRana more specifically
I'm trying to connect it to the div/container the picture is in