These are chat archives for FreeCodeCamp/HelpFrontEnd

5th
Aug 2016
DZRana
@DZRana
Aug 05 2016 00:10 UTC
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
Darshan
@Dave1089
Aug 05 2016 00:29 UTC
@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
DZRana
@DZRana
Aug 05 2016 00:43 UTC
@Dave1089 ahhh gotcha. Thanks for taking a look!
CamperBot
@camperbot
Aug 05 2016 00:43 UTC
dzrana sends brownie points to @dave1089 :sparkles: :thumbsup: :sparkles:
:cookie: 364 | @dave1089 |http://www.freecodecamp.com/dave1089
Roger Hart
@wilcombebolger
Aug 05 2016 01:00 UTC
Hi All
Care to give us some feedback on Personal portfolio Project please
Sam
@Samwise12
Aug 05 2016 01:56 UTC
Anyone have any advice for getting started learning react.js and ES6?
How do I use babel 6 for windows....?
Norvin Burrus
@ndburrus
Aug 05 2016 02:07 UTC
@Samwise12 these may be useful: :sparkles:
Richard
@richao03
Aug 05 2016 02:24 UTC
hi guys
can someone help me with a jquery selector question?
DJ
@qualitymanifest
Aug 05 2016 02:55 UTC
@richao03 ask
William Cross
@williamtech814
Aug 05 2016 03:10 UTC
^
What is Jquery?
like what does it do?
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 03:38 UTC
anyone know how to append the values of my numbers inside the spans to a certain div?
http://codepen.io/duel_drawer8/pen/rLygWG
Sabrina Ferguson
@itsacoyote
Aug 05 2016 03:39 UTC
@Dueldrawer8 you can probably start with getting the .text() from the span clicked
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 03:41 UTC
@itsacoyote ah thats right forgot about that.. ill try it thanks
CamperBot
@camperbot
Aug 05 2016 03:41 UTC
dueldrawer8 sends brownie points to @itsacoyote :sparkles: :thumbsup: :sparkles:
:cookie: 203 | @itsacoyote |http://www.freecodecamp.com/itsacoyote
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 03:49 UTC
@itsacoyote can you see my code? not working..doing something wrong lol
Sabrina Ferguson
@itsacoyote
Aug 05 2016 03:49 UTC
@Dueldrawer8 looking over it...
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 03:50 UTC
(.span).text() should get the numbers..
Reggie
@Reggie01
Aug 05 2016 03:50 UTC
@Ryanwfile
A couple of hints for you
  1. 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
  2. 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.
  3. The value of var i when 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.
  4. 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.
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 03:50 UTC
now just need to append those numbers to the div
Sabrina Ferguson
@itsacoyote
Aug 05 2016 03:50 UTC
@Dueldrawer8 so you want to append the number's text in the span, right? Sorry, I mean the boxAnswer
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 03:50 UTC
yes
Sabrina Ferguson
@itsacoyote
Aug 05 2016 03:52 UTC
@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.
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 03:53 UTC
@itsacoyote yes, thought i fixed it if you can see but it prints out all the spans to the calculator
Sabrina Ferguson
@itsacoyote
Aug 05 2016 03:54 UTC
@Dueldrawer8 yeah, trying to find the correct way to say it next, gimme a moment
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 03:54 UTC
@itsacoyote youve helped me plenty
ive got it :)
Sabrina Ferguson
@itsacoyote
Aug 05 2016 03:55 UTC
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 :)
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 03:56 UTC
@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
Sabrina Ferguson
@itsacoyote
Aug 05 2016 03:57 UTC
@Dueldrawer8 haha, yeah it does require constant coding to get comfortable or it all leaks out of the head :D
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:13 UTC
@itsacoyote im creating my clear now.. whenever i apply clear for some reason the actual button appends to the screen lol
Sabrina Ferguson
@itsacoyote
Aug 05 2016 04:14 UTC
@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
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:16 UTC
@itsacoyote sure
Sabrina Ferguson
@itsacoyote
Aug 05 2016 04:17 UTC
I think $('.boxAnswer').empty() should work
or just $('.boxAnswer').text('') works, no need to get the text from the clear button
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:17 UTC
ah yes true
@itsacoyote thanks ill try it
CamperBot
@camperbot
Aug 05 2016 04:17 UTC
dueldrawer8 sends brownie points to @itsacoyote :sparkles: :thumbsup: :sparkles:
:warning: dueldrawer8 already gave itsacoyote points
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:20 UTC
@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
Sabrina Ferguson
@itsacoyote
Aug 05 2016 04:21 UTC
hmm
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:21 UTC
wait nvm
it is appending it to the p
lol
Sabrina Ferguson
@itsacoyote
Aug 05 2016 04:22 UTC
nice debugging though :)
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:23 UTC
lol
have you already done the calculator project?
Sabrina Ferguson
@itsacoyote
Aug 05 2016 04:24 UTC
not yet, I'm still going through the javascript tutorials, I've just got some previous jQuery knowledge
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:24 UTC
nice
Greg Duncan
@GregatGit
Aug 05 2016 04:25 UTC
@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 <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
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:33 UTC
@GregatGit is there a reason for it? I do like that idea though
well nvm guess that makes sense
Greg Duncan
@GregatGit
Aug 05 2016 04:34 UTC
@Dueldrawer8 I was advised by someone (who was pretty good) no avoid html onclick
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:34 UTC
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
Greg Duncan
@GregatGit
Aug 05 2016 04:36 UTC
every time you click it should trigger an event
Sabrina Ferguson
@itsacoyote
Aug 05 2016 04:36 UTC
yes, I would say there's a slightly better way to do that.
Greg Duncan
@GregatGit
Aug 05 2016 04:36 UTC
and myFunction can take in any of the numbers
Sabrina Ferguson
@itsacoyote
Aug 05 2016 04:37 UTC
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?
Greg Duncan
@GregatGit
Aug 05 2016 04:38 UTC
in the html don't write onclick='function()'
Sabrina Ferguson
@itsacoyote
Aug 05 2016 04:38 UTC
oh, yes, that's correct
Greg Duncan
@GregatGit
Aug 05 2016 04:38 UTC
you can but it is not advised
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:39 UTC
i was planning on building a function using eval to do the calculations
Greg Duncan
@GregatGit
Aug 05 2016 04:39 UTC
@Dueldrawer8 this function will help you down the track eval(str);
Sabrina Ferguson
@itsacoyote
Aug 05 2016 04:40 UTC
@Dueldrawer8 yep, you're going in the right direction
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:41 UTC
when i finish with that function.. do i pass it into the click event?
i guess it depends
Greg Duncan
@GregatGit
Aug 05 2016 04:42 UTC
yeah
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:42 UTC
ive literally put this off for two weeks bc i had no idea how to code the JS part
Greg Duncan
@GregatGit
Aug 05 2016 04:43 UTC
try and make lots of litte functions to make your code work
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:43 UTC
one for addition, subtraction, etc?
Sabrina Ferguson
@itsacoyote
Aug 05 2016 04:43 UTC
hmm
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:43 UTC
i thought eval actually can do all those calculations
Sabrina Ferguson
@itsacoyote
Aug 05 2016 04:44 UTC
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
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:45 UTC
@GregatGit @itsacoyote thanks again :)
CamperBot
@camperbot
Aug 05 2016 04:45 UTC
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
Greg Duncan
@GregatGit
Aug 05 2016 04:45 UTC
@Dueldrawer8 I make one function for + - x / and used eval
Sabrina Ferguson
@itsacoyote
Aug 05 2016 04:45 UTC
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.
Greg Duncan
@GregatGit
Aug 05 2016 04:46 UTC
makes it easier to fix if there is a problem
Darth Skywalker
@adityaparab
Aug 05 2016 04:46 UTC
And doesn't make you dizzy by looking at a giant wall of text
Greg Duncan
@GregatGit
Aug 05 2016 04:47 UTC
I did a seperate fucntion for when they pressed 0 because of complexities
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:48 UTC
interesting
labeebahmad414
@labeebahmad414
Aug 05 2016 04:51 UTC

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:

http://imgur.com/a/DlaQO

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.
Sabrina Ferguson
@itsacoyote
Aug 05 2016 04:54 UTC
@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.
Robert Taylor
@robphat
Aug 05 2016 04:58 UTC
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?
Sabrina Ferguson
@itsacoyote
Aug 05 2016 04:59 UTC
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.
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 04:59 UTC
@robphat yes all your assumptions are correct. Researching and reading documentation is a huge part of a web developer
Sabrina Ferguson
@itsacoyote
Aug 05 2016 05:00 UTC
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
Darth Skywalker
@adityaparab
Aug 05 2016 05:01 UTC
@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.
Randy Goldsmith
@Dueldrawer8
Aug 05 2016 05:01 UTC
@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
Sabrina Ferguson
@itsacoyote
Aug 05 2016 05:02 UTC
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"
labeebahmad414
@labeebahmad414
Aug 05 2016 05:03 UTC
@itsacoyote thanks
CamperBot
@camperbot
Aug 05 2016 05:03 UTC
labeebahmad414 sends brownie points to @itsacoyote :sparkles: :thumbsup: :sparkles:
:cookie: 220 | @itsacoyote |http://www.freecodecamp.com/itsacoyote
Sabrina Ferguson
@itsacoyote
Aug 05 2016 05:03 UTC
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.
Sorin Ruse
@sorinr
Aug 05 2016 05:09 UTC
@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
Robert Taylor
@robphat
Aug 05 2016 05:09 UTC
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
DJ
@qualitymanifest
Aug 05 2016 05:15 UTC
@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.
Robert Taylor
@robphat
Aug 05 2016 05:18 UTC
@qualitymanifest Thanks
CamperBot
@camperbot
Aug 05 2016 05:18 UTC
robphat sends brownie points to @qualitymanifest :sparkles: :thumbsup: :sparkles:
:star2: 1322 | @qualitymanifest |http://www.freecodecamp.com/qualitymanifest
Muhammad Sirajuddeen
@sirajtechy
Aug 05 2016 06:14 UTC
Can i put down my angular js questions here ??
DJ
@qualitymanifest
Aug 05 2016 06:16 UTC
@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
Jaren Escueta
@jarenescueta731
Aug 05 2016 06:48 UTC
@qualitymanifest did they have angular lessons before and remove them?
:(
Darth Skywalker
@adityaparab
Aug 05 2016 06:49 UTC
If anyone needs help with Angular/React, let me know
DJ
@qualitymanifest
Aug 05 2016 06:49 UTC
@jarenescueta731 i can't remember. i think they just pointed to external resources to learn angular. this was before 2016
Cyril de Wit
@cyrildewit
Aug 05 2016 07:25 UTC
They should bring it back
OLZHAS KURIKOV
@olzhas2102
Aug 05 2016 07:38 UTC
<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?
Islam Ibakaev
@dagman
Aug 05 2016 07:40 UTC
is there a package for Atom that let see currently opened files?
OLZHAS KURIKOV
@olzhas2102
Aug 05 2016 07:41 UTC

@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?

kirbyedy
@kirbyedy
Aug 05 2016 07:45 UTC
This message was deleted
This message was deleted
Sorin Ruse
@sorinr
Aug 05 2016 08:07 UTC
@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
axel8591
@axel8591
Aug 05 2016 08:16 UTC
This message was deleted
the doer
@ewathedoer
Aug 05 2016 08:26 UTC

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

Jerzz
@2cool4school
Aug 05 2016 08:40 UTC

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?

Sorin Ruse
@sorinr
Aug 05 2016 08:46 UTC
@2cool4school try make a console.log(json) and inspect it in devtools. on browser that link to storm.... its working
Jerzz
@2cool4school
Aug 05 2016 08:48 UTC
@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
Sorin Ruse
@sorinr
Aug 05 2016 08:49 UTC
Jerzz
@2cool4school
Aug 05 2016 08:53 UTC
@sorinr thank you very much, this is perfect. im gonna make sure i remember this
CamperBot
@camperbot
Aug 05 2016 08:53 UTC
2cool4school sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 603 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Aug 05 2016 08:56 UTC
@2cool4school its just a temp solution coz if that site is down your app will be down too :)
Muhammad Hasham
@MohammadHasham
Aug 05 2016 08:59 UTC
need help with Convert HTML Entities
@sorinr
Sorin Ruse
@sorinr
Aug 05 2016 09:02 UTC
@MohammadHasham let me take a look back coz i don't remember the request
Muhammad Hasham
@MohammadHasham
Aug 05 2016 09:02 UTC
okay no problem :smile:
@sorinr
Muhammad Hasham
@MohammadHasham
Aug 05 2016 09:09 UTC
@sorinr any idea?
Sorin Ruse
@sorinr
Aug 05 2016 09:10 UTC
@MohammadHasham i han't done that challenge yet but i will look into it as soon as i finish something
Muhammad Hasham
@MohammadHasham
Aug 05 2016 09:10 UTC
@sorinr Okay
etrupja
@etrupja
Aug 05 2016 09:11 UTC
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?
Sorin Ruse
@sorinr
Aug 05 2016 09:12 UTC
@etrupja yep. u can use any framework or api u want
etrupja
@etrupja
Aug 05 2016 09:16 UTC
Thank you very much. @sorinr
CamperBot
@camperbot
Aug 05 2016 09:16 UTC
etrupja sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 604 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Aug 05 2016 09:17 UTC
@etrupja welcome
etrupja
@etrupja
Aug 05 2016 09:17 UTC
How can i send brownie points to You @sorinr
Sorin Ruse
@sorinr
Aug 05 2016 09:17 UTC
@etrupja you already sent me
etrupja
@etrupja
Aug 05 2016 09:18 UTC
So they are sent automatically when somebody thanks
for something?
I am new in the Chats
nebastion
@nebastion
Aug 05 2016 09:19 UTC
@etrupja, CamperBot distributes the cookies!
Ashan Mohammed
@AshanMohammed
Aug 05 2016 09:21 UTC
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
Sorin Ruse
@sorinr
Aug 05 2016 09:23 UTC
@AshanMohammed include both col-md-6 divs into only one div class row.
Muhammad Hasham
@MohammadHasham
Aug 05 2016 10:00 UTC
@MohammadHasham
need help with spinal tap case ?
anyone?
Andrey
@apiyron
Aug 05 2016 11:01 UTC
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
Marko Stefanovic
@MarkoStefanovic
Aug 05 2016 11:46 UTC
@AshanMohammed use col-md-4 on div not on img
```
Deepika Gupta
@deepika-gupta
Aug 05 2016 11:48 UTC
hiii
Marko Stefanovic
@MarkoStefanovic
Aug 05 2016 11:49 UTC
@AshanMohammed
<div class="row">
 <div class="col-md-4">
<img class="img-responsive" .... >
</div>
</div>
Deepika Gupta
@deepika-gupta
Aug 05 2016 11:49 UTC
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??
Marko Stefanovic
@MarkoStefanovic
Aug 05 2016 11:51 UTC
@deepika-gupta go to codepen homapage login, click on pens in menu, click on my public pens
Deepika Gupta
@deepika-gupta
Aug 05 2016 11:52 UTC
okkk
@MarkoStefanovic thankss
CamperBot
@camperbot
Aug 05 2016 11:52 UTC
deepika-gupta sends brownie points to @markostefanovic :sparkles: :thumbsup: :sparkles:
:cookie: 214 | @markostefanovic |http://www.freecodecamp.com/markostefanovic
Marko Stefanovic
@MarkoStefanovic
Aug 05 2016 11:53 UTC
:smile:
Deepika Gupta
@deepika-gupta
Aug 05 2016 11:57 UTC
@MarkoStefanovic :)
Greg Duncan
@GregatGit
Aug 05 2016 12:11 UTC

@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
Joakim Bajoul Kakaei
@Todai88
Aug 05 2016 12:29 UTC
Guys, advice on how to set up a slideshow wrapping a few <canvas> elements?
Norvin Burrus
@ndburrus
Aug 05 2016 12:41 UTC
arvindarvee
@arvindarvee
Aug 05 2016 12:51 UTC
anyone explain how to use article and section tag.. i read many websites still i dont get it.any one knows
Harry Adel
@harryadel
Aug 05 2016 12:52 UTC
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
Sorin Ruse
@sorinr
Aug 05 2016 12:53 UTC
@arvindarvee i think you can interchange them depending on the context. you can have a section on a page that contains articles and viceversa
Joakim Bajoul Kakaei
@Todai88
Aug 05 2016 12:53 UTC
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
Harry Adel
@harryadel
Aug 05 2016 12:53 UTC
I need to be able to terminate the setInterval loop when the break length count down ends
arvindarvee
@arvindarvee
Aug 05 2016 12:54 UTC
thank u @sorinr ..but what happens if the places are interchanged
CamperBot
@camperbot
Aug 05 2016 12:54 UTC
arvindarvee sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 611 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Aug 05 2016 12:58 UTC
@arvindarvee nothing. these two tags are just semantical tags
@arvindarvee they are like <header>,<main>, <footer> .
Sorin Ruse
@sorinr
Aug 05 2016 13:13 UTC
@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>
Glory Wong Zhaohui
@GloryWong
Aug 05 2016 13:17 UTC
张钊在吗
Bharat
@BharatKalluri
Aug 05 2016 13:31 UTC
Hey! I am Building A portfolio Website, here's the link http://codepen.io/Bharat_Kalluri/pen/XdedeO
Bharat
@BharatKalluri
Aug 05 2016 13:31 UTC
how do I make the dots point to links??
Christos Maris
@ChristosMr
Aug 05 2016 13:36 UTC
You have to put them in anchor tags
Bharat
@BharatKalluri
Aug 05 2016 13:37 UTC
@ChristosMr They are in anchor tags
@ChristosMr but they are not clickable, any idea why?
Christos Maris
@ChristosMr
Aug 05 2016 13:39 UTC
Yeah
Have you tried making them open a new tab?
ayostacks
@ayostacks
Aug 05 2016 13:40 UTC
Bharat
@BharatKalluri
Aug 05 2016 13:40 UTC
@ChristosMr they point to different divs
@ChristosMr its just a nav dots
Dylan
@dhcodes
Aug 05 2016 13:41 UTC
@Bharat-Kalluri you need to put the <a href> on the outside of the li
@Bharat-Kalluri <a href="..."><li></li></a>
Bharat
@BharatKalluri
Aug 05 2016 13:44 UTC
thanks @dhcodes , it worked, any idea why it takes up a small amount of whitespace at the bottom of the page??
CamperBot
@camperbot
Aug 05 2016 13:44 UTC
bharat-kalluri sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1302 | @dhcodes |http://www.freecodecamp.com/dhcodes
Abhisek Pattnaik
@abhisekp
Aug 05 2016 13:46 UTC

Please DON'T click the LINK!

Dylan
@dhcodes
Aug 05 2016 13:46 UTC
@Bharat-Kalluri where do you want them?
Bharat
@BharatKalluri
Aug 05 2016 13:46 UTC
@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?
Dylan
@dhcodes
Aug 05 2016 13:52 UTC
you mean the whitespace after the dots?
it's because you have your message button in that div too
Bharat
@BharatKalluri
Aug 05 2016 13:54 UTC
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
Dylan
@dhcodes
Aug 05 2016 13:56 UTC
@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
Bharat
@BharatKalluri
Aug 05 2016 14:01 UTC
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
Dylan
@dhcodes
Aug 05 2016 14:03 UTC
@Bharat-Kalluri I'd make a new div at the very bottom and put them in that
Temi
@temiadesina
Aug 05 2016 14:03 UTC
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
Dylan
@dhcodes
Aug 05 2016 14:03 UTC
margin: 0;
Bharat
@BharatKalluri
Aug 05 2016 14:03 UTC
yep, figured it out , i put - margin top
Dylan
@dhcodes
Aug 05 2016 14:03 UTC
@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
Temi
@temiadesina
Aug 05 2016 14:04 UTC
@dhcodes yup, what do you think might be wrong ?
Greg Duncan
@GregatGit
Aug 05 2016 14:06 UTC
@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
Temi
@temiadesina
Aug 05 2016 14:07 UTC
@GregatGit alright thanks will do
CamperBot
@camperbot
Aug 05 2016 14:07 UTC
temiadesina sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 725 | @gregatgit |http://www.freecodecamp.com/gregatgit
Dylan
@dhcodes
Aug 05 2016 14:07 UTC
@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>
Temi
@temiadesina
Aug 05 2016 14:11 UTC
@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>
Janine vN
@janine9vn
Aug 05 2016 14:12 UTC
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?
Dylan
@dhcodes
Aug 05 2016 14:19 UTC
@temiadesina did it work when you added it?
@janine9vn they provide you a list
just use the same users as the example
Temi
@temiadesina
Aug 05 2016 14:21 UTC
@dhcodes No it didn't
Robert Taylor
@robphat
Aug 05 2016 14:21 UTC
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
Janine vN
@janine9vn
Aug 05 2016 14:21 UTC
@dhcodes Okay, thanks!
CamperBot
@camperbot
Aug 05 2016 14:21 UTC
janine9vn sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1304 | @dhcodes |http://www.freecodecamp.com/dhcodes
Dylan
@dhcodes
Aug 05 2016 14:21 UTC
@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
Temi
@temiadesina
Aug 05 2016 14:24 UTC
@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
Dylan
@dhcodes
Aug 05 2016 14:28 UTC
@temiadesina got it
i ended up just re-copying the sample code from bootstrap for everything before the li links start
Robert Taylor
@robphat
Aug 05 2016 14:30 UTC
@dhcodes Ah. I needed to add both. I had added bootstrap js by itself. It's working now. Learning here....
Dylan
@dhcodes
Aug 05 2016 14:30 UTC
@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
Temi
@temiadesina
Aug 05 2016 14:35 UTC
@dhcodes Great! thank you, what did you do to solve it
CamperBot
@camperbot
Aug 05 2016 14:35 UTC
temiadesina sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1305 | @dhcodes |http://www.freecodecamp.com/dhcodes
Sorin Ruse
@sorinr
Aug 05 2016 14:37 UTC
@janine9vn you can build your own list of streamers
Dylan
@dhcodes
Aug 05 2016 14:43 UTC
@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
Temi
@temiadesina
Aug 05 2016 14:46 UTC

@dhcodes thanks it was a spelling error

class="navbar-toggle collapse"

instead of

class="navbar-toggle collapsed"
CamperBot
@camperbot
Aug 05 2016 14:46 UTC
temiadesina sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:warning: temiadesina already gave dhcodes points
Sorin Ruse
@sorinr
Aug 05 2016 14:46 UTC
@dhcodes i really don't know but i've seen it many times :)
help reference a post
CamperBot
@camperbot
Aug 05 2016 14:47 UTC
no wiki entry for: reference a post
Sorin Ruse
@sorinr
Aug 05 2016 14:47 UTC
help tag a post
CamperBot
@camperbot
Aug 05 2016 14:47 UTC
no wiki entry for: tag a post
Sorin Ruse
@sorinr
Aug 05 2016 14:47 UTC
help mention a post
CamperBot
@camperbot
Aug 05 2016 14:47 UTC
no wiki entry for: mention a post
Dylan
@dhcodes
Aug 05 2016 14:47 UTC
@temiadesina cool
@sorinr do you know how to do the thing where the text shows up in purple
nvm
i'll go google
Robert Taylor
@robphat
Aug 05 2016 14:48 UTC
This message was deleted
dhcodes @dhcodes hello
dhcodes @dhcodes is a jolly good fellow
Dylan
@dhcodes
Aug 05 2016 14:50 UTC
/lurk
/lurk kajsldkfjasd
nvm
May Kittens Devour Your Soul
@diomed
Aug 05 2016 15:01 UTC
@dhcodes /me
Dylan
@dhcodes
Aug 05 2016 15:01 UTC
@diomed lol i know
how do you do the reference with the link to something you already said tho?
May Kittens Devour Your Soul
@diomed
Aug 05 2016 15:01 UTC
ah, okay :P
that puzzles me also
Robert Taylor
@robphat
Aug 05 2016 15:03 UTC

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;
}

May Kittens Devour Your Soul
@diomed
Aug 05 2016 15:03 UTC
@robphat why do u have this twice:
font-famiy: font-family: 'Montserrat', sans-serif;
Natalya122
@Natalya122
Aug 05 2016 15:06 UTC
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
Robert Taylor
@robphat
Aug 05 2016 15:10 UTC
@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
Ogundele Olumide
@Lumexralph
Aug 05 2016 15:11 UTC
hello everyone, how can I create an empty javascript object in jquery
Darth Skywalker
@adityaparab
Aug 05 2016 15:12 UTC

Initial draft of Random Quote Machine, critics/comments/observations are welcome :)

http://codepen.io/AdityaParab/full/akRVaj/

Jonathan Garland
@Garlandjon95
Aug 05 2016 15:23 UTC
Hello everyone ! I have a career question if soneone could answer it for me perhaps
Sorin Ruse
@sorinr
Aug 05 2016 15:25 UTC
@dhcodes :point_up: August 5, 2016 5:46 PM look here
Jonathan Garland
@Garlandjon95
Aug 05 2016 15:25 UTC
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?
Sorin Ruse
@sorinr
Aug 05 2016 15:30 UTC
@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 . :)
Dylan
@dhcodes
Aug 05 2016 15:34 UTC
nice. Thanks @sorinr
CamperBot
@camperbot
Aug 05 2016 15:34 UTC
dhcodes sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 612 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Aug 05 2016 15:34 UTC
@dhcodes welcome
Jonathan Garland
@Garlandjon95
Aug 05 2016 15:43 UTC
So no one gonna answer me
Dylan
@dhcodes
Aug 05 2016 15:44 UTC
@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
Joe
@JFSene
Aug 05 2016 15:45 UTC
Hello friends, "User Story: I can access all of the portfolio webpage's content just by scrolling." << where was that challenge?
Sorin Ruse
@sorinr
Aug 05 2016 15:52 UTC
@JFSene building a portfolio
Joe
@JFSene
Aug 05 2016 15:54 UTC
@sorinr I know, but i dont remember where they theach how you do that, i cant remember.
Sorin Ruse
@sorinr
Aug 05 2016 15:56 UTC
@JFSene in the basic front end development projects . here is the link: portfolio
Cyril de Wit
@cyrildewit
Aug 05 2016 15:56 UTC
@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.
Ashan Mohammed
@AshanMohammed
Aug 05 2016 16:00 UTC
@sorinr @MarkoStefanovic @GregatGit Thanks All! You People Are Really Awesome!! :)
CamperBot
@camperbot
Aug 05 2016 16:00 UTC
: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
Joe
@JFSene
Aug 05 2016 16:07 UTC
@sorinr Thank you!!
CamperBot
@camperbot
Aug 05 2016 16:07 UTC
jfsene sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 614 | @sorinr |http://www.freecodecamp.com/sorinr
Joe
@JFSene
Aug 05 2016 16:09 UTC
But my real question was How to make a one page website, where i can see all the other pages just by scrolling down.
Sorin Ruse
@sorinr
Aug 05 2016 16:12 UTC
@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
Joe
@JFSene
Aug 05 2016 16:13 UTC
@sorinr Thank you again, and I feel rly dumb right now!
CamperBot
@camperbot
Aug 05 2016 16:13 UTC
jfsene sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: jfsene already gave sorinr points
Sorin Ruse
@sorinr
Aug 05 2016 16:19 UTC
@JFSene you can make it
Dany Din
@danydin
Aug 05 2016 16:20 UTC
@sorinr can i private message you abotu a project i would like to start
and need help
Sorin Ruse
@sorinr
Aug 05 2016 16:20 UTC
@danydin yep
Joe
@JFSene
Aug 05 2016 16:43 UTC
Anyone knows a good and free stock photo to get bg images?
vínαч puppαl
@vinaypuppal
Aug 05 2016 16:53 UTC
@JFSene you can use https://unsplash.com/ for free stock images
Joe
@JFSene
Aug 05 2016 16:55 UTC
@vinaypuppal Thank you!
CamperBot
@camperbot
Aug 05 2016 16:55 UTC
jfsene sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 437 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
gitgenie
@gitgenie
Aug 05 2016 17:12 UTC
HI guys need help with regEX for this challenge "
Validate US Telephone Numbers". Can someOne please help
Joe
@JFSene
Aug 05 2016 17:22 UTC
background-image: url("https://hd.unsplash.com/photo-1452457779869-0a9ebbbdee99"); < why is this code not working?
Darth Skywalker
@adityaparab
Aug 05 2016 17:24 UTC

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:

http://codepen.io/AdityaParab/full/PzyZvO/

labeebahmad414
@labeebahmad414
Aug 05 2016 17:53 UTC

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.

Josh
@jjoshpoland
Aug 05 2016 17:53 UTC
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
Sorin Ruse
@sorinr
Aug 05 2016 17:55 UTC
@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
Islam Ibakaev
@dagman
Aug 05 2016 17:58 UTC
hey guys check out my random quote generator rebuided with react.js
greg
@wearenotgroot
Aug 05 2016 18:00 UTC
@dagman not sure if the background image fits the design though
Islam Ibakaev
@dagman
Aug 05 2016 18:01 UTC
@wearenotgroot what about code quality?
labeebahmad414
@labeebahmad414
Aug 05 2016 18:01 UTC
@jjoshpoland thanks
CamperBot
@camperbot
Aug 05 2016 18:01 UTC
labeebahmad414 sends brownie points to @jjoshpoland :sparkles: :thumbsup: :sparkles:
:cookie: 266 | @jjoshpoland |http://www.freecodecamp.com/jjoshpoland
labeebahmad414
@labeebahmad414
Aug 05 2016 18:01 UTC
@sorinr thanks
CamperBot
@camperbot
Aug 05 2016 18:01 UTC
labeebahmad414 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 615 | @sorinr |http://www.freecodecamp.com/sorinr
the doer
@ewathedoer
Aug 05 2016 18:05 UTC
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.
Aaron Hauth
@AaroniusH
Aug 05 2016 18:45 UTC

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?

elizabeth awino
@beth6
Aug 05 2016 18:55 UTC
Hey gays
Darth Skywalker
@adityaparab
Aug 05 2016 18:56 UTC
gays? :O
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:04 UTC
document.ready(function(){

$('#add').on("click",function(a){

  var text =  document.getElementById('#work');
  var teeth = document.createTextNode("Text Entered!");
  text.appendChild(teeth);


});
Why is my button not working?
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:05 UTC
@MohammadHasham do u see any errors in chrome console??
Aaron Hauth
@AaroniusH
Aug 05 2016 19:06 UTC
(press f12 and try clicking the button again)
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:07 UTC
@vinaypuppal checking that
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:08 UTC
@MohammadHasham and u dont need #work just use this var text = document.getElementById('work');
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:09 UTC
@vinaypuppal but i have used an id work #work
Aaron Hauth
@AaroniusH
Aug 05 2016 19:09 UTC
does createTextNode actually return anything?
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:09 UTC
@MohammadHasham oh okay do you see any errors in console?
Tam Nguyen
@bankplank
Aug 05 2016 19:10 UTC
This message was deleted
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:11 UTC
@vinaypuppal it is saying that
document is not defined
i have used that:
$(document ).ready(function() {
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:11 UTC
@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
Aaron Hauth
@AaroniusH
Aug 05 2016 19:12 UTC
@vinaypuppal ugh, that might be most straight-forward way to go about it
Aaron Hauth
@AaroniusH
Aug 05 2016 19:13 UTC
@bankplank , silly question: are you running the web page on an http url, or https url?
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:13 UTC
@MohammadHasham document.getElementById('work'); use this its working
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:14 UTC
@vinaypuppal Thanks alot
CamperBot
@camperbot
Aug 05 2016 19:14 UTC
mohammadhasham sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 438 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
Aaron Hauth
@AaroniusH
Aug 05 2016 19:14 UTC
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
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:15 UTC
@AaroniusH exactly :smile:
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:15 UTC
My bad! you are right
thanks guys
i actually want to make a to-do list
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:18 UTC
@MohammadHasham okay u included Jquery why to use vanilla javascript u can use Jquery like this $('#work').append('sometext')
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:21 UTC
@vinaypuppal is it completely different from jquery
js i mean
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:24 UTC
@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
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:28 UTC
@vinaypuppal
http://codepen.io/Mohammad_Hasham/pen/VjEBqN?editors=1010
can you please review my pen why it is not working
dhuddleston
@dhuddleston
Aug 05 2016 19:30 UTC
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
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:31 UTC
@MohammadHasham document.getElementById('txtarea') returns <textarea rows="2" cols="50" id="txtarea"> </textarea> so u cant access .val() on it
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:31 UTC
var data = $("#txtarea").val(); now i am using this
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:31 UTC
and .val() is available in JQuery not in pure javascript @MohammadHasham
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:32 UTC
so what if i use .val()
@vinaypuppal
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:32 UTC
@MohammadHasham let me check
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:32 UTC
okay :smile:
@vinaypuppal
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:33 UTC
@MohammadHasham so u need to create text node and then append or using Jquery just do this
$('#work').append(data);
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:35 UTC
yes that is working
but why was that not working
Marius Garbea
@MariusGarbea
Aug 05 2016 19:36 UTC
@dhuddleston remove padding-top: 30px from #app
Aaron Hauth
@AaroniusH
Aug 05 2016 19:36 UTC
@dhuddleston I was able to get it closer by removing the padding-top property in the #app css
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:36 UTC
@MohammadHasham
var text =  document.getElementById('work');
var teeth = document.createTextNode(data);
text.appendChild(teeth);
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:36 UTC
yes that worked but how can i enter data to the next <li> in the table
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:37 UTC
this will work becoz appendChild takes text node
@MohammadHasham did u mean a new row in table
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:38 UTC
yes
is there any way
@vinaypuppal
Aaron Hauth
@AaroniusH
Aug 05 2016 19:39 UTC
@dhuddleston not sure how to get it any higher :\
Could something with the bootstrap css be making that additional padding?
unless just removing that padding in the css was enough :P
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:41 UTC
@vinaypuppal how can i enter the next row
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:41 UTC
yes u need to create <tr> and <td> in javascript and append it to <tbody>
Marius Garbea
@MariusGarbea
Aug 05 2016 19:41 UTC
@AaroniusH @dhuddleston also add margin: 0 to #logo
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:42 UTC
@MohammadHasham like this
<tbody id='things'>

    </tbody>
var html = '<tr><td>'+data+'</tr></td>';
    $("#things").append(html);
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:42 UTC
@vinaypuppal Thanks
CamperBot
@camperbot
Aug 05 2016 19:42 UTC
mohammadhasham sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:warning: mohammadhasham already gave vinaypuppal points
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:48 UTC
@vinaypuppal is that okay to shift to a new row
$(text).append(teeth+'\n');
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:50 UTC
@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
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:50 UTC
@vinaypuppal Yes actually that is not working i tried the above solution
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:51 UTC
@MohammadHasham which one ??
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:51 UTC

@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
@vinaypuppal
vínαч puppαl
@vinaypuppal
Aug 05 2016 19:56 UTC
@MohammadHasham i see your old code only, see this pen i forked http://codepen.io/vinaypuppal/pen/LkgJOY?editors=1010
Muhammad Hasham
@MohammadHasham
Aug 05 2016 19:58 UTC
@vinaypuppal Thanks
CamperBot
@camperbot
Aug 05 2016 19:58 UTC
mohammadhasham sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:warning: mohammadhasham already gave vinaypuppal points
John Espinoza
@johnlovespi
Aug 05 2016 19:58 UTC
any one kno ruby
its a simple question
Muhammad Hasham
@MohammadHasham
Aug 05 2016 20:00 UTC
@johnlovespi Sorry! no idea
John Espinoza
@johnlovespi
Aug 05 2016 20:01 UTC
thanks
Blake Geraci
@bgeraci714
Aug 05 2016 20:20 UTC
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
dhuddleston
@dhuddleston
Aug 05 2016 20:25 UTC
@MariusGarbea @AaroniusH Thanks!
CamperBot
@camperbot
Aug 05 2016 20:25 UTC
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
vínαч puppαl
@vinaypuppal
Aug 05 2016 20:26 UTC
@bgeraci714
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
Muhammad Hasham
@MohammadHasham
Aug 05 2016 20:34 UTC
@vinaypuppal are u ther/
vínαч puppαl
@vinaypuppal
Aug 05 2016 20:34 UTC
@MohammadHasham yes
Blake Geraci
@bgeraci714
Aug 05 2016 20:35 UTC
wow, thank you very much @vinaypuppal !
CamperBot
@camperbot
Aug 05 2016 20:35 UTC
bgeraci714 sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 439 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
Muhammad Hasham
@MohammadHasham
Aug 05 2016 20:35 UTC
i am trying to strike an element when clicked but van you check that why isn;t it working
@vinaypuppal
vínαч puppαl
@vinaypuppal
Aug 05 2016 20:38 UTC
@MohammadHasham you attached click handler on #things not on individual todo items
Muhammad Hasham
@MohammadHasham
Aug 05 2016 20:39 UTC
but do i have to change the id every time when a new row is made or one id would be okay
@vinaypuppal
vínαч puppαl
@vinaypuppal
Aug 05 2016 20:41 UTC
@MohammadHasham no your doing all wrong, did u complete FCC JQuery Waypoint challenges.
Muhammad Hasham
@MohammadHasham
Aug 05 2016 20:42 UTC
no i am at intermediate ones
@vinaypuppal
so should i stop that for now
vínαч puppαl
@vinaypuppal
Aug 05 2016 20:43 UTC
@MohammadHasham once go through them again,then come back and do this project that way it will help to understand what your doing wrong
Drew Dusang
@dmdusang
Aug 05 2016 20:58 UTC
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
Danny Rubio
@drbe4t
Aug 05 2016 21:22 UTC
Hey I need some help with bootstrap. Is there anyone her that can help me out?
Drew Dusang
@dmdusang
Aug 05 2016 21:24 UTC
I can try @drbe4t though I'm still learning
Danny Rubio
@drbe4t
Aug 05 2016 21:24 UTC
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.
CamperBot
@camperbot
Aug 05 2016 21:25 UTC
drbe4t sends brownie points to @dmdusang :sparkles: :thumbsup: :sparkles:
:cookie: 120 | @dmdusang |http://www.freecodecamp.com/dmdusang
Drew Dusang
@dmdusang
Aug 05 2016 21:26 UTC
sure, @drbe4t do you have the code on a codepen or anywhere I could take a look?
Danny Rubio
@drbe4t
Aug 05 2016 21:26 UTC
possibly give me a second .
Danny Rubio
@drbe4t
Aug 05 2016 21:35 UTC
@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
Muhammad Hasham
@MohammadHasham
Aug 05 2016 21:37 UTC
need help
Drew Dusang
@dmdusang
Aug 05 2016 21:37 UTC
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
Danny Rubio
@drbe4t
Aug 05 2016 21:38 UTC
Ah okay so I think I have them from the bootstrap starter kit thing let me see if i can find them.
Muhammad Hasham
@MohammadHasham
Aug 05 2016 21:38 UTC
can anyone tell me that why is every text entered is striked please
http://codepen.io/Mohammad_Hasham/pen/VjEBqN?editors=1010
@drbe4t
@dmdusang
Danny Rubio
@drbe4t
Aug 05 2016 21:39 UTC
@MohammadHasham it’s running for me okay.
Muhammad Hasham
@MohammadHasham
Aug 05 2016 21:40 UTC
but when you will enter text and click on it it would be striked
Danny Rubio
@drbe4t
Aug 05 2016 21:40 UTC
@dmdusang i found a carousel.js file but I’m not sure where i need to put it nor how to link to it.
Muhammad Hasham
@MohammadHasham
Aug 05 2016 21:40 UTC
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
Danny Rubio
@drbe4t
Aug 05 2016 21:42 UTC
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.
Drew Dusang
@dmdusang
Aug 05 2016 21:43 UTC
@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
Muhammad Hasham
@MohammadHasham
Aug 05 2016 21:44 UTC
@dmdusang can u help me with my pen
Drew Dusang
@dmdusang
Aug 05 2016 21:46 UTC
@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>');
  }
Tyler Moeller
@TylerMoeller
Aug 05 2016 21:46 UTC

@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

Danny Rubio
@drbe4t
Aug 05 2016 21:47 UTC
yeah ^
Drew Dusang
@dmdusang
Aug 05 2016 21:47 UTC
double yea^
Muhammad Hasham
@MohammadHasham
Aug 05 2016 21:48 UTC
@TylerMoeller Thanks
CamperBot
@camperbot
Aug 05 2016 21:48 UTC
mohammadhasham sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 717 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Danny Rubio
@drbe4t
Aug 05 2016 21:48 UTC
@TylerMoeller FTW!
Muhammad Hasham
@MohammadHasham
Aug 05 2016 21:48 UTC
then what should i wrap
Tyler Moeller
@TylerMoeller
Aug 05 2016 21:48 UTC
lol @drbe4t
@MohammadHasham wrap the individual <td> elements in #wer
Danny Rubio
@drbe4t
Aug 05 2016 21:50 UTC
wouldn’t it be better to be a class rather than an ID?
Muhammad Hasham
@MohammadHasham
Aug 05 2016 21:51 UTC

@TylerMoeller but i am wrapping td not tr

<tbody id = "things">
       <tr>
        <td id = "wer">
        </td>
      </tr>

    </tbody>

isnt that fine?

Danny Rubio
@drbe4t
Aug 05 2016 21:52 UTC
have you tried it that way?
Tyler Moeller
@TylerMoeller
Aug 05 2016 21:52 UTC
@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.
Muhammad Hasham
@MohammadHasham
Aug 05 2016 21:52 UTC
@TylerMoeller can you fork my pen
Tyler Moeller
@TylerMoeller
Aug 05 2016 21:53 UTC
@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 :)
Muhammad Hasham
@MohammadHasham
Aug 05 2016 21:53 UTC
i am doing as you said i guess
you are right
<tr>
<strike>
<td id = "wer">Test3</td>
</strike>
</tr>
i am doing like that i guess now
Danny Rubio
@drbe4t
Aug 05 2016 21:54 UTC
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?
Muhammad Hasham
@MohammadHasham
Aug 05 2016 21:55 UTC
inside the body @drbe4t
incase of codepen you dont need one
Danny Rubio
@drbe4t
Aug 05 2016 21:55 UTC
Thank man. right
I put it at the bottom of the body right?
Muhammad Hasham
@MohammadHasham
Aug 05 2016 21:56 UTC
yes that would be okay
<script></script> make sure you end up with closing tags
@drbe4t
Danny Rubio
@drbe4t
Aug 05 2016 22:00 UTC
GUYS I GOT IT!!!
WOOO HOOO
DZRana
@DZRana
Aug 05 2016 22:01 UTC
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>
Danny Rubio
@drbe4t
Aug 05 2016 22:01 UTC
are you using the javascript?
DZRana
@DZRana
Aug 05 2016 22:03 UTC
@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
Danny Rubio
@drbe4t
Aug 05 2016 22:05 UTC
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.
DZRana
@DZRana
Aug 05 2016 22:06 UTC
@drbe4t np. thnx for taking a look
CamperBot
@camperbot
Aug 05 2016 22:06 UTC
dzrana sends brownie points to @drbe4t :sparkles: :thumbsup: :sparkles:
:cookie: 164 | @drbe4t |http://www.freecodecamp.com/drbe4t
Drew Dusang
@dmdusang
Aug 05 2016 22:10 UTC
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
DZRana
@DZRana
Aug 05 2016 22:12 UTC
try
<nav class="navbar navbar-default navbar-static-top">
oh i misread sry. disregard that lol
Drew Dusang
@dmdusang
Aug 05 2016 22:14 UTC
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
Drew Dusang
@dmdusang
Aug 05 2016 22:39 UTC
anyone else have any ideas?
Danny Rubio
@drbe4t
Aug 05 2016 23:00 UTC
Hmmm let me see if I can take a look
Danny Rubio
@drbe4t
Aug 05 2016 23:06 UTC
So you are having issues getting it conected to the image of the flying pig?
Drew Dusang
@dmdusang
Aug 05 2016 23:08 UTC
yea
@DZRana more specifically
I'm trying to connect it to the div/container the picture is in