These are chat archives for FreeCodeCamp/Help

12th
Mar 2016
Stephenna Jemae
@Stephenna
Mar 12 2016 00:00
Okay! Thanks!!!
Jordan Meyer
@Jordanmeyer89
Mar 12 2016 00:02
np
Dunebug
@dunethomas
Mar 12 2016 00:06
@EsmerlinMoya - are you still having problems with the RegEx exercise?
var expression = /./gi; // Change this Line is what you want to edit
Stephenna Jemae
@Stephenna
Mar 12 2016 00:07
Don't hate me! I'm not the sharpest tool in the shed. <div class= .gray-background { background-color: gray; }> What am I doing wrong??
Esmerlin Rosario
@EsmerlinMoya
Mar 12 2016 00:07
@dunethomas Yeah mister :( im stuck and dont know how to do it
Dunebug
@dunethomas
Mar 12 2016 00:07
@EsmerlinMoya - okay. So, you just have to change what is between the 2 slashes: /./
get rid of the dot, and put something else in there
Let me look at the exercise
Esmerlin Rosario
@EsmerlinMoya
Mar 12 2016 00:08
@dunethomas nop i just paste the problem here , i was thinking about how to solve it but i have no idea
Jared Pranke
@EtherWolf
Mar 12 2016 00:08
@Stephenna The .gray-background {background-color: gray;} bit goes at the the top of your document, between the <style> </style> tags
Dunebug
@dunethomas
Mar 12 2016 00:08
What are you trying to search for in the exercise?
Stephenna Jemae
@Stephenna
Mar 12 2016 00:08
Okay, Ill try it again!
Esmerlin Rosario
@EsmerlinMoya
Mar 12 2016 00:09
@dunethomas Your regular expression should find two occurrences of the word and.
Use regular expressions to find the word and in testString.
Dunebug
@dunethomas
Mar 12 2016 00:09
@EsmerlinMoya - one moment... I'll pull up the exercise. I don't know what word you're trying to find in the sentence
quannypete
@quannypete
Mar 12 2016 00:10
how would I add the id attribute of cat-photo-form. I'm having trouble with this
Jared Pranke
@EtherWolf
Mar 12 2016 00:10
This message was deleted
Dunebug
@dunethomas
Mar 12 2016 00:11
@EsmerlinMoya - okay. So, you're looking for the word "and". In a normal string of text, you'd put the text between two quotes, like "this." But in a regular expression, you put it between the two slashes, like /this/
Stephenna Jemae
@Stephenna
Mar 12 2016 00:11
I swear its not working!
Jared Pranke
@EtherWolf
Mar 12 2016 00:11
<style>
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, Monospace;
  }

  p {
    font-size: 16px;
    font-family: Monospace;
  }

  .thick-green-border {
    border-color: green;
    border-width: 10px;
    border-style: solid;
    border-radius: 50%;
  }

  .smaller-image {
    width: 100px;
  }

  .gray-background {
    background-color: gray;
  }

   #cat-photo-form {
    background-color: green;
  }
</style>
Here is an example of a style declaration within your html document
Esmerlin Rosario
@EsmerlinMoya
Mar 12 2016 00:12
@dunethomas Yeah , how i implement this on the exercise
Jared Pranke
@EtherWolf
Mar 12 2016 00:12
@Stephenna Think of the html elements as your nouns, the style declarations as your adjectives.
Stephenna Jemae
@Stephenna
Mar 12 2016 00:13
Im assigning the class to the Div element. I've tried that and inside of the div itself.
Dunebug
@dunethomas
Mar 12 2016 00:13
@EsmerlinMoya - put the word 'and' between the slashes where the dot is. So, like this:
var expression = /and/gi;
Jared Pranke
@EtherWolf
Mar 12 2016 00:14
@Stephenna When you give a class to an element (E.G <div class="gray-background">, you later have to select that class in your style sheet. From there you will give it a property such as background-color: gray;
Esmerlin Rosario
@EsmerlinMoya
Mar 12 2016 00:15
@dunethomas Oh man :D Thanks you so much
CamperBot
@camperbot
Mar 12 2016 00:15
esmerlinmoya sends brownie points to @dunethomas :sparkles: :thumbsup: :sparkles:
:star: 104 | @dunethomas | http://www.freecodecamp.com/dunethomas
Dunebug
@dunethomas
Mar 12 2016 00:15
@Stephenna - Your definition of the style "gray-background" is correct. Leave that as it is. Now, in the Div element, you need to set it's class equal to "gray-background"
Stephenna Jemae
@Stephenna
Mar 12 2016 00:15
Omg thanks! I got it @EtherWolf
CamperBot
@camperbot
Mar 12 2016 00:15
stephenna sends brownie points to @etherwolf :sparkles: :thumbsup: :sparkles:
:star: 300 | @etherwolf | http://www.freecodecamp.com/etherwolf
Jared Pranke
@EtherWolf
Mar 12 2016 00:15
@Stephenna :+1: :fire:
Dunebug
@dunethomas
Mar 12 2016 00:15
@EsmerlinMoya - np!
Jordan Meyer
@Jordanmeyer89
Mar 12 2016 00:16
lol
Stephenna Jemae
@Stephenna
Mar 12 2016 00:17
Thanks also!! @dunethomas
CamperBot
@camperbot
Mar 12 2016 00:17
stephenna sends brownie points to @dunethomas :sparkles: :thumbsup: :sparkles:
:star: 105 | @dunethomas | http://www.freecodecamp.com/dunethomas
Jared Pranke
@EtherWolf
Mar 12 2016 00:19
@quannypete Did you solve your problem yet?
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 00:30
Hey, everyone! I'm kinda new here... And I'm having some trouble with th challenge.
Steve Carroll
@SteveCarroll
Mar 12 2016 00:30
@CourtneyCoetser Which one?
Dunebug
@dunethomas
Mar 12 2016 00:30
@CourtneyCoetser which challenge?
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 00:30
The "Target the same element with multiple jQuery Selectors" challenge.
Dunebug
@dunethomas
Mar 12 2016 00:31
Ah. What is working, what's not?
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 00:32
How can I show you the code?
Dunebug
@dunethomas
Mar 12 2016 00:32
@CourtneyCoetser - so, there's 3 different ways you've learned to access/refer to an element...
copy it from the code window
then in this window, you can paste it in
to format it properly...
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 00:33
Yes, and everything looks fine but it's not showing up as completed.
Thanks.
Dunebug
@dunethomas
Mar 12 2016 00:33
go ahead and copy paste it here
` (shift+enter for line break)
var code = "formatted";
`
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 00:33

1

<script>
2
$(document).ready(function() {
3
$("button").addClass(animated)
4
$(".btn").addClass(shake)
5
});
6
</script>
7

8
<!-- Only change code above this line. -->
9

10

<div class="container-fluid">
11
<h3 class="text-primary text-center">jQuery Playground</h3>
12
<div class="row">
13
<div class="col-xs-6">
14
<h4>#left-well</h4>
15
<div class="well" id="left-well">
16
<button class="btn btn-default target" id="target1">#target1</button>
17
<button class="btn btn-default target" id="target2">#target2</button>
18
<button class="btn btn-default target" id="target3">#target3</button>
19
</div>
20
</div>
21
<div class="col-xs-6">
22
<h4>#right-well</h4>
23
<div class="well" id="right-well">
24
<button class="btn btn-default target" id="target4">#target4</button>
25
<button class="btn btn-default target" id="target5">#target5</button>
26
<button class="btn btn-default target" id="target6">#target6</button>
27
</div>
28
</div>
29
</div>
30
</div>
31

Nope
Dunebug
@dunethomas
Mar 12 2016 00:34
@CourtneyCoetser - okay. I see.
You need to use the addClass function 3 times
once for each method of accessing the targets
you have 2:
$("button").addClass(animated)
$(".btn").addClass(shake)
So you need to do the 3rd selection...
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 00:36
I know I have to have three but when I test the code it doesn't ahow the second as correct.
Dunebug
@dunethomas
Mar 12 2016 00:36
You want to indicate the "#target1" element
Steve Carroll
@SteveCarroll
Mar 12 2016 00:37
@CourtneyCoetser suyntax
Dunebug
@dunethomas
Mar 12 2016 00:37
Hmmm. Lemme see...
@CourtneyCoetser - you're missing your quotation marks around the "animated" and "shake"
Logan Copper
@TheManWhoSawGreatness
Mar 12 2016 00:38
How do I, "Replace the value of your a element's href attribute with a #, also known as a hash symbol, to turn it into a dead link." ?
Dunebug
@dunethomas
Mar 12 2016 00:39
@TheManWhoSawGreatness href="#"
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 00:39
Thanks, @dunethomas I'll correct it.
CamperBot
@camperbot
Mar 12 2016 00:39
courtneycoetser sends brownie points to @dunethomas :sparkles: :thumbsup: :sparkles:
:star: 110 | @dunethomas | http://www.freecodecamp.com/dunethomas
Logan Copper
@TheManWhoSawGreatness
Mar 12 2016 00:40
Thanks dunethomas.
Dunebug
@dunethomas
Mar 12 2016 00:43
Y
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 00:53
<script>
$(document).ready(function() {
$("button").addClass ("Animated")
$(".btn").addClass("Shake")
$("#target1").addClass ("animated shake btn-primary")
});
</script>
Only add one class with each of your three selectors?
Dunebug
@dunethomas
Mar 12 2016 00:54
@CourtneyCoetser - lemme look at it...
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 00:54
Thanks.
Dunebug
@dunethomas
Mar 12 2016 00:56
as a note... be very careful with changing the case of words... "Animated" might work, but you should keep lowercase names all lowercase. Also... remember to put your semicolons on the end of lines... most of the time you're okay if you don't... but sometimes, it matters, and it is really hard to figure out the problem then.
@CourtneyCoetser - this runs fine on mine. Does it fail when you click "Run tests"
?
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 00:58
The only one that fails is "Only add one class with each of your three selectors."
Dunebug
@dunethomas
Mar 12 2016 00:59
@CourtneyCoetser - Aha... I see what you've done here...
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 00:59
Yeah?
Dunebug
@dunethomas
Mar 12 2016 01:00
So, you've added the "animated" and "shake" classes to your #target1 element already in the first 2 lines
your #target1 element IS a "button" and it also already has a ".btn" class value
So in those first two lines, you add "animated" and "shake" to the #target1 element (and a few other elments)
In that 3rd line, you only need to write:
$("#target1").addClass("btn-primary")
NOT
$("#target1").addClass("animate shake btn-primary")
I THINK... HOLD ON
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 01:02
Oh, I see now! Thanks again, @dunethomas
CamperBot
@camperbot
Mar 12 2016 01:02
courtneycoetser sends brownie points to @dunethomas :sparkles: :thumbsup: :sparkles:
:warning: courtneycoetser already gave dunethomas points
Dunebug
@dunethomas
Mar 12 2016 01:02
Is that working for you now?
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 01:04
Testing it now.
Dunebug
@dunethomas
Mar 12 2016 01:05
@CourtneyCoetser - Upon closer inspection, I don't think that should make a difference. I think this test is a tad buggy. However, it is possible the real problem is that you left off your semicolons --> ;
Steve Carroll
@SteveCarroll
Mar 12 2016 01:06
@dunethomas I left one off earlier, to see if it caused a problem, it didn't with one element.
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 01:06
I'll correct those in a sec, you're right it didn't make a difference.
Steve Carroll
@SteveCarroll
Mar 12 2016 01:07
Personally, I don't think that's a good idea (that it passed without it).
Dunebug
@dunethomas
Mar 12 2016 01:08
@SteveCarroll - I would've thought the same, but I just tried this test a couple of times. Two versions of the code, both worked, but upon copy and paste, it didn't work. I added semicolons back on, tried again, and it worked. That is just odd.
Steve Carroll
@SteveCarroll
Mar 12 2016 01:08
Sometimes the chars that come off your local keyboard can be 'different' ;)
Dunebug
@dunethomas
Mar 12 2016 01:09
Yeah. Plus, I'm a little odd, too. So it could just be the code editor trying to match me. ;-)
Steve Carroll
@SteveCarroll
Mar 12 2016 01:10
I've been driven nuts by that stuff
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 01:11
Corrected the semicolons and still nothing.
Bad idea to skip and revisit later?
Dunebug
@dunethomas
Mar 12 2016 01:12
@CourtneyCoetser - I'm wondering if you might be better closing the browser and re-launching. It gets buggy every now and then.
I think you're fine. Your answer is correct.
Steve Carroll
@SteveCarroll
Mar 12 2016 01:13
@CourtneyCoetser copy your code and save it locally
REfresh the page and try again
Dunebug
@dunethomas
Mar 12 2016 01:13
If the only thing you change is in between the script tags, then just copy that part
<script>
  $(document).ready(function() {
    $("button").addClass("animated");
    $(".btn").addClass("shake");
    $("#target1").addClass("btn-primary");
  });
</script>
This works perfect, and your code, in the end, was identical.
Steve Carroll
@SteveCarroll
Mar 12 2016 01:14
@dunethomas THe stuff does get buggy now and then
Dunebug
@dunethomas
Mar 12 2016 01:15
@SteveCarroll Yeah. It can break a person if they don't know what to expect.
Steve Carroll
@SteveCarroll
Mar 12 2016 01:15
Especially people who are new to this, which many are.
Dunebug
@dunethomas
Mar 12 2016 01:15
EXACTLY.
Still, not a bad platform.
Steve Carroll
@SteveCarroll
Mar 12 2016 01:16
The keyboard encodings, though, that's just treachery :)
Cassius
@CassiusCodes
Mar 12 2016 01:16
Give your div element the class gray-background.
Your div element should have a gray background.
Steve Carroll
@SteveCarroll
Mar 12 2016 01:16
Oh, its a great platform!
Dunebug
@dunethomas
Mar 12 2016 01:16
Diabolical!
Cassius
@CassiusCodes
Mar 12 2016 01:16

<div>
35
<p>Things cats love:</p>
36
<ul>
37
<li>cat nip</li>
38
<li>laser pointers</li>
39
<li>lasagna</li>
40
</ul>
41
<p>Top 3 things cats hate:</p>
42
<ol>
43
<li>flea treatment</li>
44
<li>thunder</li>
45
<li>other cats</li>
46
</ol>
47
</div>
48

49

<form action="/submit-cat-photo">
50
<label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
51
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
52
<label><input type="checkbox" name="personality" checked> Loving</label>
53
<label><input type="checkbox" name="personality"> Lazy</label>
54
<label><input type="checkbox" name="personality"> Energetic</label>
55
<input type="text" placeholder="cat photo URL" required>
56
<button type="submit">Submit</button>
57
</form>
58

Courtney Coetser
@CourtneyCoetser
Mar 12 2016 01:17
Just opened and closed my browser and it worked. 😑
Dunebug
@dunethomas
Mar 12 2016 01:17
@SteveCarroll - yeah. I'm only on day 2. Doing a refresh... looks like a really great way to learn.
Cassius
@CassiusCodes
Mar 12 2016 01:18
How do I do it?
pls help
Dunebug
@dunethomas
Mar 12 2016 01:18
@CourtneyCoetser YAY!!!
Steve Carroll
@SteveCarroll
Mar 12 2016 01:18
@CourtneyCoetser Funny how it works :)
Dunebug
@dunethomas
Mar 12 2016 01:18
@CassiusCodes one moment
Steve Carroll
@SteveCarroll
Mar 12 2016 01:18
You could probably have just refrehsed the page, though
Dunebug
@dunethomas
Mar 12 2016 01:19

@CassiusCodes - like this

<div class="gray-background">

Courtney Coetser
@CourtneyCoetser
Mar 12 2016 01:19
@SteveCarroll I did that before asking and
Cassius
@CassiusCodes
Mar 12 2016 01:19
@dunethomas where do i place it ?
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 01:19
It didn't work.
Steve Carroll
@SteveCarroll
Mar 12 2016 01:19
weird
Dunebug
@dunethomas
Mar 12 2016 01:20
@CourtneyCoetser @SteveCarroll - THAT is what I'm talking about... works, then doesn't, then works again later
Steve Carroll
@SteveCarroll
Mar 12 2016 01:20
Usually, for css and html you can just hit the reset button
Javascript, especially in a local console... good luck!
Stuff can get STICKY!
Dunebug
@dunethomas
Mar 12 2016 01:21
@CassiusCodes - You see the <div> tag at the very top of what you cut and pasted? It goes in there:
class="gray-background
Matthew
@aspiringguru
Mar 12 2016 01:22

on the 'Label Bootstrap Wells' page.
added h4 tag in the prompted position that matches the problem description as below.
doesn't work, ideas?

<div class="col-xs-6">
<h4 id="#left-well"></h4>
<div class="well" id="left-well">

Cassius
@CassiusCodes
Mar 12 2016 01:23
@dunethomas didnt work but ill keep trying.Thanks so much
CamperBot
@camperbot
Mar 12 2016 01:23
cassiuscodes sends brownie points to @dunethomas :sparkles: :thumbsup: :sparkles:
:star: 114 | @dunethomas | http://www.freecodecamp.com/dunethomas
Steve Carroll
@SteveCarroll
Mar 12 2016 01:23
@aspiringguru <h4 id="#left-well"></h4>??
hash tag
Dunebug
@dunethomas
Mar 12 2016 01:25
@CassiusCodes - what is the assignment you're working on so I can take a look?
Steve Carroll
@SteveCarroll
Mar 12 2016 01:27
@dunethomas @CassiusCodes What browser are you gusy using?
Matthew
@aspiringguru
Mar 12 2016 01:27
@SteveCarroll @CassiusCodes oh bah... just realised the text of the h4 tag was supposed to be #left-well, not the id or class.
my bad
thanks for the offer tho!
Steve Carroll
@SteveCarroll
Mar 12 2016 01:27
@aspiringguru Its fixed, then?
Dunebug
@dunethomas
Mar 12 2016 01:27
@CassiusCodes - there are 2 parts to the solution. The first part is to set the style definition for the gray background in the <style> area. The second part is the set the class in the div tag.
@SteveCarroll - chrome
you?
Steve Carroll
@SteveCarroll
Mar 12 2016 01:28
Same
I use Canary outside of FCC
Dunebug
@dunethomas
Mar 12 2016 01:29
I'm pretty stoked with Chrome for the DevTools
never tried Canary
Steve Carroll
@SteveCarroll
Mar 12 2016 01:29
Yeah
Canary = bleeding edge Chrome
Dunebug
@dunethomas
Mar 12 2016 01:29
Well, well, well... looks like I might have to play with that one. :)
Steve Carroll
@SteveCarroll
Mar 12 2016 01:30
All kinds of new features that, you know, break stuff :)
Dunebug
@dunethomas
Mar 12 2016 01:30
Wheee! ;-)
Steve Carroll
@SteveCarroll
Mar 12 2016 01:30
For those of us that haven't gotten enough of that...
Dunebug
@dunethomas
Mar 12 2016 01:30
Breaking stuff is half the point of becoming a developer, right?
Steve Carroll
@SteveCarroll
Mar 12 2016 01:30
Seems so.
Cassius
@CassiusCodes
Mar 12 2016 01:30

You can set an element's background color with the background-color property.

For example, if you wanted an element's background color to be green, you'd put this within your style element:

.green-background {
background-color: green;
}
Create a class called gray-background with the background-color of gray. Assign this class to your div element.

Run tests (ctrl + enter)
Reset Help Bug
Give your div element the class gray-background.
Your div element should have a gray background.

<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}

.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 50%;
}

.smaller-image {
width: 100px;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" alt="A cute orange cat lying on its back" src="https://bit.ly/fcc-relaxing-cat"></a>

<div>
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
</div>

<form action="/submit-cat-photo">
<label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality" checked> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Energetic</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>

help pls @dunethomas
CamperBot
@camperbot
Mar 12 2016 01:31
no wiki entry for: pls @dunethomas
Steve Carroll
@SteveCarroll
Mar 12 2016 01:31
<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}

.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 50%;
}

.smaller-image {
width: 100px;
}
</style>
<h2 class="red-text">CatPhotoApp</h2>
<p>Click here for <a href="#">cat photos</a>.</p>
<a href="#"><img class="smaller-image thick-green-border" alt="A cute orange cat lying on its back" src="https://bit.ly/fcc-relaxing-cat"></a>
<div>
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
</div>
<form action="/submit-cat-photo">
<label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality" checked> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Energetic</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>
Dunebug
@dunethomas
Mar 12 2016 01:32
@CassiusCodes - you need to define your css style in this area:
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}

.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 50%;
}

.smaller-image {
width: 100px;
}
</style>
imani
@bigB500
Mar 12 2016 01:32
Hey @CassiusCodes i am having the same problem on my end
Cassius
@CassiusCodes
Mar 12 2016 01:32
oh ok @dunethomas
@bigB500 lets figure this thing out lol
imani
@bigB500
Mar 12 2016 01:33
even with doing that it still doesnt work
Steve Carroll
@SteveCarroll
Mar 12 2016 01:33
@CassiusCodes But open another beer first :)
imani
@bigB500
Mar 12 2016 01:33
cheers! @CassiusCodes @SteveCarroll
Cassius
@CassiusCodes
Mar 12 2016 01:33
lol med head @SteveCarroll
Dunebug
@dunethomas
Mar 12 2016 01:34
@bigB500 @CassiusCodes - if you were going to make a class called "green-backgrounds" you would add this code into that aread between the <style> tags
.green-background { background-color: green; }
Cassius
@CassiusCodes
Mar 12 2016 01:34
no hops
Steve Carroll
@SteveCarroll
Mar 12 2016 01:34
And no style tags
Cassius
@CassiusCodes
Mar 12 2016 01:34
lol
Dunebug
@dunethomas
Mar 12 2016 01:34
guiness includes style tags.
Cassius
@CassiusCodes
Mar 12 2016 01:34
guiness it is then
Dunebug
@dunethomas
Mar 12 2016 01:35
ha!
Steve Carroll
@SteveCarroll
Mar 12 2016 01:35
I dunno... I think Guiness is inline styling
imani
@bigB500
Mar 12 2016 01:36

p {
font-size: 16px;
font-family: Monospace;
}

.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 50%;
}

.smaller-image {
width: 100px;
}
.gray-background {
background-color: gray;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" alt="A cute orange cat lying on its back" src="https://bit.ly/fcc-relaxing-cat"></a>

<div class="gray-background">
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
</div>

Daniel Tait
@4xDMG
Mar 12 2016 01:36
Hey guys. Can anyone help me with the API call for the wikipedia viewer app please?
Steve Carroll
@SteveCarroll
Mar 12 2016 01:36
<div style=“drunk:yes”>Point me to the turlet</div>
@4xDMG Probably get better help in the javascript room
Dunebug
@dunethomas
Mar 12 2016 01:38
LOL
Daniel Tait
@4xDMG
Mar 12 2016 01:38
@SteveCarroll Thanks! Didn't even know that it existed
CamperBot
@camperbot
Mar 12 2016 01:38
4xdmg sends brownie points to @stevecarroll :sparkles: :thumbsup: :sparkles:
Cassius
@CassiusCodes
Mar 12 2016 01:38
got it @bigB500
CamperBot
@camperbot
Mar 12 2016 01:38
:star: 293 | @stevecarroll | http://www.freecodecamp.com/stevecarroll
Steve Carroll
@SteveCarroll
Mar 12 2016 01:38
@4xDMG Lord help you if you had to rely on this room
LOL!
Daniel Tait
@4xDMG
Mar 12 2016 01:39
@SteveCarroll Lol ;)
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 01:40
What do brownie points actually do?
Steve Carroll
@SteveCarroll
Mar 12 2016 01:40
@CourtneyCoetser NO one really knows...
Seriously, it's a reputation thing
imani
@bigB500
Mar 12 2016 01:40
@CassiusCodes mine still is glitching then it seems :<
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 01:40
@SteveCarroll Lol.... 😂
imani
@bigB500
Mar 12 2016 01:41

<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}

.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 50%;
}

.smaller-image {
width: 100px;
}
.grey-background {
background-color: grey;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" alt="A cute orange cat lying on its back" src="https://bit.ly/fcc-relaxing-cat"></a>

<div class="grey-background">
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
</div>

<form action="/submit-cat-photo">
<label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality" checked> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Energetic</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>

the most annoying thing is that the picture app shows up as changing to grey
Steve Carroll
@SteveCarroll
Mar 12 2016 01:43
@bigB500 Youts is still busted?
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 01:44
Are there any cons to using FCC on a phone when on the move instead of a laptop? Or is it fine?
Steve Carroll
@SteveCarroll
Mar 12 2016 01:44
@CourtneyCoetser They don't have a police force (yet) so, yeah...
The javascript won
won't be fun on a phone
Cassius
@CassiusCodes
Mar 12 2016 01:45
@bigB500 Give your form element the id of cat-photo-form.
??
Hve you done so?
Thomas Luong
@luongthomas
Mar 12 2016 01:48
@CourtneyCoetser It looks fine on an iPhone and its still doable. Its just a tad small
imani
@bigB500
Mar 12 2016 01:50
I have had glitches on both! @CassiusCodes
Leah O'Rourke
@lorourke14
Mar 12 2016 01:53
Anybody on level 75?
Courtney Coetser
@CourtneyCoetser
Mar 12 2016 01:59
@lorourke14 Think I've passed it.
Dustin
@glenohumeral13
Mar 12 2016 02:04
hey guys, can someone walk me through what's wrong with my code for the palindrome challenge? ```
function palindrome(str) {
  // Good luck!
  var revStr = str.replace("[^A-Za-z]+","").toLowerCase().split("").reverse().join("");
  return (revStr === str);
}

palindrome("eye");
someone told me that i'm not actually assigning anything to revStr, but i dont know any more than that
imani
@bigB500
Mar 12 2016 02:07
hey @CassiusCodes did you get the id attibute of cat-photo-form yet?
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:10
@glenohumeral13 your code seems to work fine.. what is wrong?
@alexanderkopke this is a link to the problems that occur
Raúl Vázquez
@raulvazquez
Mar 12 2016 02:11
hi, i don't know that i have to do in the step called "Target the Parent of an Element Using jQuery"
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:12
@glenohumeral13 ah, it seems it only works on single words but not sentences
Dustin
@glenohumeral13
Mar 12 2016 02:13
@alexanderkopke yeah
DJ
@qualitymanifest
Mar 12 2016 02:14
@glenohumeral13 your .replace is wrong. to use regex you would do replace(/[^A-Za-z]+/,"") (you're missing the / 's) and you shouldn't replace numbers. also you want a global flag for your regex, without it, it only replaces the first incidence of a match
you're never changing str either - so comparing a cleansed reversed string to the original string (still with punctuation, spaces, etc) isn't going to work
Dustin
@glenohumeral13
Mar 12 2016 02:14
@qualitymanifest what do the slashes do?
@qualitymanifest what do you mean?
DJ
@qualitymanifest
Mar 12 2016 02:15
@glenohumeral13 regular expressions go inside of them. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions
i mean you're making revStr and getting rid of all non-alphabet characters (well, you will be once you fix the regex), but then you're comparing it to str, which hasn't been modified at all and may contain non-alphabet characters.
Dustin
@glenohumeral13
Mar 12 2016 02:18
@qualitymanifest ahh. but then what else would i compare revStr to to check a palindrome?
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:18
@glenohumeral13 ah one thing you need to do is use the regex on str too.. remove spaces, punctuation and such...
Camille
@CamilleLore
Mar 12 2016 02:20
Helllp please! I need help with a form on this page: http://www.freecodecamp.com/challenges/create-a-form-element#?solution=%3Clink%20href%3D%22http%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DLobster%22%20rel%3D%22stylesheet%22%20type%3D%22text%2Fcss%22%3E%0A%3Cstyle%3E%0A%20%20.red-text%20{%0A%20%20%20%20color%3A%20red%3B%0A%20%20}%0A%0A%20%20h2%20{%0A%20%20%20%20font-family%3A%20Lobster%2C%20Monospace%3B%0A%20%20}%0A%0A%20%20p%20{%0A%20%20%20%20font-size%3A%2016px%3B%0A%20%20%20%20font-family%3A%20Monospace%3B%0A%20%20}%0A%0A%20%20.thick-green-border%20{%0A%20%20%20%20border-color%3A%20green%3B%0A%20%20%20%20border-width%3A%2010px%3B%0A%20%20%20%20border-style%3A%20solid%3B%0A%20%20%20%20border-radius%3A%2050%25%3B%0A%20%20}%0A%0A%20%20.smaller-image%20{%0A%20%20%20%20width%3A%20100px%3B%0A%20%20}%0A%3C%2Fstyle%3E%0A%0A%3Ch2%20class%3D%22red-text%22%3ECatPhotoApp%3C%2Fh2%3E%0A%0A%3Cp%3EClick%20here%20for%20%3Ca%20href%3D%22%23%22%3Ecat%20photos%3C%2Fa%3E.%3C%2Fp%3E%0A%0A%3Ca%20href%3D%22%23%22%3E%3Cimg%20class%3D%22smaller-image%20thick-green-border%22%20alt%3D%22A%20cute%20orange%20cat%20lying%20on%20its%20back%22%20src%3D%22https%3A%2F%2Fbit.ly%2Ffcc-relaxing-cat%22%3E%3C%2Fa%3E%0A%0A%3Cp%3EThings%20cats%20love%3A%3C%2Fp%3E%0A%3Cul%3E%0A%20%20%3Cli%3Ecat%20nip%3C%2Fli%3E%0A%20%20%3Cli%3Elaser%20pointers%3C%2Fli%3E%0A%20%20%3Cli%3Elasagna%3C%2Fli%3E%0A%3C%2Ful%3E%0A%3Cp%3ETop%203%20things%20cats%20hate%3A%3C%2Fp%3E%0A%3Col%3E%0A%20%20%3Cli%3Eflea%20treatment%3C%2Fli%3E%0A%20%20%3Cli%3Ethunder%3C%2Fli%3E%0A%20%20%3Cli%3Eother%20cats%3C%2Fli%3E%0A%3C%2Fol%3E%0A%3Cform%3E%0A%20%20%3Cinput%20type%3D%22text%22%20placeholder%3D%22cat%20photo%20URL%22%3E%0A%20%20%3Cform%20action%3D%22%2Fsubmit-cat-photo%22%3E%0A%3C%2Fform%3E%0A
Oh my sorry!!
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:21
@glenohumeral13 your regex already seems to do that.. so just do str = str. replace(your regex)... then you don't have to use your regex on revStr because you already removed the things you don't need
Camille
@CamilleLore
Mar 12 2016 02:21
<form>
<input type="text" placeholder="cat photo URL">
<form action="/submit-cat-photo">
</form>
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:21
@CamilleLore you have two forms
Camille
@CamilleLore
Mar 12 2016 02:22
I do?
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:22
remove the one in the middle and put action="/etc in the first one
yeah right after your input there is a form tag
Dustin
@glenohumeral13
Mar 12 2016 02:23
@alexanderkopke im not following
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:24
@glenohumeral13 when you compare sentences str will still have spaces, punctuation etc so it will always return false
Camille
@CamilleLore
Mar 12 2016 02:24
@alexanderkopke Thank you. I did that and now I am getting one error at: Make sure your form has an action attribute which is set to /submit-cat-photo
CamperBot
@camperbot
Mar 12 2016 02:24
camillelore sends brownie points to @alexanderkopke :sparkles: :thumbsup: :sparkles:
Dustin
@glenohumeral13
Mar 12 2016 02:24
@alexanderkopke i get that, but i am not seeing the alternative
CamperBot
@camperbot
Mar 12 2016 02:24
:star: 499 | @alexanderkopke | http://www.freecodecamp.com/alexanderkopke
Camille
@CamilleLore
Mar 12 2016 02:25
I now have: <form>
<input type="text" placeholder="cat photo URL">
<action="/submit-cat-photo">
</form>
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:25
<form action="/submit-cat-photo">
  <input type="text" placeholder="cat photo URL">
  </form>
Camille
@CamilleLore
Mar 12 2016 02:25
Oh!!
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:26
the form takes the action property
Camille
@CamilleLore
Mar 12 2016 02:26
Thank you so much @alexanderkopke Really appreciate it!
CamperBot
@camperbot
Mar 12 2016 02:26
camillelore sends brownie points to @alexanderkopke :sparkles: :thumbsup: :sparkles:
:warning: camillelore already gave alexanderkopke points
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:26
np :)
Camille
@CamilleLore
Mar 12 2016 02:27
:)
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:33
@glenohumeral13 take a look at this http://jsbin.com/bovuzodoqe/edit?js,console run the code by pressing the run button to the right. You can see the output of str and revStr.. one with spaces, etc and one without
James S.
@Mrblue27
Mar 12 2016 02:35
need some assistance with smaller-image. where am I suppose to place it to get app to work correctly.
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:36
@glenohumeral13 then look at this one: http://jsbin.com/bovuzodoqe/edit?js,console here I have use the regex on the str before it is reversed
Josh
@MarketingCoder
Mar 12 2016 02:36
hi
James S.
@Mrblue27
Mar 12 2016 02:36
hi
Josh
@MarketingCoder
Mar 12 2016 02:36
bye
Dustin
@glenohumeral13
Mar 12 2016 02:36
@alexanderkopke so i would need to compare revStr to str.replace(/[^A-Za-z]/g,"").toLowerCase().split("").join("") ?
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:37
@Mrblue27 you need to add the smaller-image class to the <img element.. like so: <img class="smaller-image"
@glenohumeral13 your compare is fine as it is, in my opinion
Dustin
@glenohumeral13
Mar 12 2016 02:38
@alexanderkopke but it doesnt work
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:39
@glenohumeral13 because regex hasn't been used on str.. both str and strRev need to have spaces, punctuation, etc removed
James S.
@Mrblue27
Mar 12 2016 02:39
@alexanderkopke thanks now about the making it 100 pixels
CamperBot
@camperbot
Mar 12 2016 02:39
mrblue27 sends brownie points to @alexanderkopke :sparkles: :thumbsup: :sparkles:
:star: 500 | @alexanderkopke | http://www.freecodecamp.com/alexanderkopke
Dustin
@glenohumeral13
Mar 12 2016 02:39
@alexanderkopke so i should make a second variable to do that then?
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:41
@Mrblue27 I think you already wrote width:100px; .. one moment let me post the code so you can compare
<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, Monospace;
  }

  p {
    font-size: 16px;
    font-family: Monospace;
  }

  .smaller-image {
    width: 100px;
  }

</style>

<h2 class="red-text">CatPhotoApp</h2>

<img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat">

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
@glenohumeral13 you only need str and strRev as you already have
Dustin
@glenohumeral13
Mar 12 2016 02:42
@alexanderkopke i got it, thanks!
CamperBot
@camperbot
Mar 12 2016 02:42
glenohumeral13 sends brownie points to @alexanderkopke :sparkles: :thumbsup: :sparkles:
:star: 501 | @alexanderkopke | http://www.freecodecamp.com/alexanderkopke
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:42
@glenohumeral13 you can do: str = str.replace(/[\W_]/g,"").toLowerCase();
and then var revStr = str.toLowerCase().split("").reverse().join("");
Dustin
@glenohumeral13
Mar 12 2016 02:43
@alexanderkopke yeah, i did that in my newest one
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:43
excellent!
probably toLowerCase() isn't needed in the second one because str already has been lowercased
Srinivasan
@kksrini89
Mar 12 2016 02:44
can anyone help me on finding a authentication technique for angularjs app like auth0, oauth?
I am a newbie for authentication...
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:44
me too :(
Brendan Goldsmith
@brendangoldz
Mar 12 2016 02:44
Help: I am on the jQuery section and its asking me to create a script element. I created it and included the document on ready function..
CamperBot
@camperbot
Mar 12 2016 02:44
no wiki entry for: i am on the jquery section and its asking me to create a script element i created it and included the document on ready function
James S.
@Mrblue27
Mar 12 2016 02:44
@alexanderkopke thanks man. I was missing the img class. Hey how do I send you some brownie points
CamperBot
@camperbot
Mar 12 2016 02:44
:warning: mrblue27 already gave alexanderkopke points
mrblue27 sends brownie points to @alexanderkopke :sparkles: :thumbsup: :sparkles:
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:45
@Mrblue27 by clicking name and saying thanks :)
CamperBot
@camperbot
Mar 12 2016 02:45
alexanderkopke sends brownie points to @mrblue27 :sparkles: :thumbsup: :sparkles:
:star: 23 | @mrblue27 | http://www.freecodecamp.com/mrblue27
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:45
@goldsmithbrenadn can you post the code?
Brendan Goldsmith
@brendangoldz
Mar 12 2016 02:46
i spelt function wrong hahahaha
Srinivasan
@kksrini89
Mar 12 2016 02:46
I am looking free of charge for authentication functionality...
anyone suggest me???
which one to go..?\
Brendan Goldsmith
@brendangoldz
Mar 12 2016 02:46
thank you though @alexanderkopke
CamperBot
@camperbot
Mar 12 2016 02:46
goldsmithbrenadn sends brownie points to @alexanderkopke :sparkles: :thumbsup: :sparkles:
:star: 502 | @alexanderkopke | http://www.freecodecamp.com/alexanderkopke
Alexander Køpke
@alexanderkopke
Mar 12 2016 02:47
:)
well, bye all and good luck, you princes of algorithms, you kings of JavaScript! :smile:
Camille
@CamilleLore
Mar 12 2016 02:54
Bye and thanks again!
Michael Liffland
@mikeliff
Mar 12 2016 03:03
I am confused about calling classes on the <div> elements
David Young
@dayvidwhy
Mar 12 2016 03:03
@kksrini89 rails has some pretty good easy to use stuff
@kksrini89 or you could just use cookies
Srinivasan
@kksrini89
Mar 12 2016 03:04
But I am doing with angularjs
@deedubwhy
David Young
@dayvidwhy
Mar 12 2016 03:04
have you looked at google?
Srinivasan
@kksrini89
Mar 12 2016 03:06
but your link is first time I have seen
David Young
@dayvidwhy
Mar 12 2016 03:08
that seems fine too, i think youll need to find an angular wizard for more help
James S.
@Mrblue27
Mar 12 2016 03:08
when I am entering the color around the border do I need to add a <img class="class1 class2">
David Young
@dayvidwhy
Mar 12 2016 03:08
@Mrblue27 if those classes apply a colored border to their container then yeah
James S.
@Mrblue27
Mar 12 2016 03:10
@deedubwhy do you have an example of what the code would be? is it <img class=" thick green border">?
David Young
@dayvidwhy
Mar 12 2016 03:10
if you wanted to apply a thick green border?
Srinivasan
@kksrini89
Mar 12 2016 03:10
@deedubwhy angular wizard is meant for "Multi form"?
James S.
@Mrblue27
Mar 12 2016 03:11
@deedubwhy let me post it so you can see what I am trying to do.
David Young
@dayvidwhy
Mar 12 2016 03:11
<style>
.thick-green-border {
border-color: green;
} </stye>
<img href=“" class=“thick-green-border”/>
@kksrini89 by wizard i meant someone that knows more than me about it
@Mrblue27 so give it 2 classes
James S.
@Mrblue27
Mar 12 2016 03:17
@deedubwhy Thanks I kept my original format and used you <img minus the href="" , just followed it up with your class and it worked .Thanks again.
CamperBot
@camperbot
Mar 12 2016 03:17
mrblue27 sends brownie points to @deedubwhy :sparkles: :thumbsup: :sparkles:
:star: 279 | @deedubwhy | http://www.freecodecamp.com/deedubwhy
Victory
@victttoryrose
Mar 12 2016 03:17
I need help on creating Bootstrap wells.
Jordan Bourne
@JordanBourne
Mar 12 2016 03:17
@kksrini89 I use passport.js
Victory
@victttoryrose
Mar 12 2016 03:17
I am not sure how I add the div element with the class well inside the other two div elements.
Srinivasan
@kksrini89
Mar 12 2016 03:17
@JordanBourne Opensource or paid one?
Jordan Bourne
@JordanBourne
Mar 12 2016 03:18
It's open source
Srinivasan
@kksrini89
Mar 12 2016 03:18
then I will explore it...
Victory
@victttoryrose
Mar 12 2016 03:19
nvm.
Srinivasan
@kksrini89
Mar 12 2016 03:19
@JordanBourne I am newbie on this for authentication side
David Young
@dayvidwhy
Mar 12 2016 03:19
@victttoryrose you sort of just said how
Srinivasan
@kksrini89
Mar 12 2016 03:19
@deedubwhy fine.
Adin
@AdinEi
Mar 12 2016 03:22

I'm on "Add Borders Around your Elements" and have written the following code:

.thick-green-border {
border-width: 10px;
border-color: green;
border-style: solid;
}
</style>

<img class="smaller-image" class="thick-green-border" src="https://bit.ly/fcc-relaxing-cat">

BUT it doesn't run. Any suggestions?

Jared Pranke
@EtherWolf
Mar 12 2016 03:22
do you have another <style> tag above the code you just posted?
Adin
@AdinEi
Mar 12 2016 03:23
Yes.
Jared Pranke
@EtherWolf
Mar 12 2016 03:23
you have two class attributes
typically multiple classes can be added as such <img class="smaller-image thick-green-border">
you don't need to have two seperate class
Adin
@AdinEi
Mar 12 2016 03:24
OK! I'll give it a go. Thx.
Jared Pranke
@EtherWolf
Mar 12 2016 03:24
what lesson are you on
Adin
@AdinEi
Mar 12 2016 03:25
Add Borders Around your Elements
Hmm. It still doesn't work.
Jared Pranke
@EtherWolf
Mar 12 2016 03:26
sorry i'm typoing like crazy
you can post your full code if you like
I'll look it over
Jordan Bourne
@JordanBourne
Mar 12 2016 03:28
Is there a link somewhere to people's various solutions to each of the bonfires?
Adin
@AdinEi
Mar 12 2016 03:28
@EtherWolf Thanks. I'm new at this. So, can I just cut and paste?
CamperBot
@camperbot
Mar 12 2016 03:28
adinei sends brownie points to @etherwolf :sparkles: :thumbsup: :sparkles:
:star: 301 | @etherwolf | http://www.freecodecamp.com/etherwolf
Jared Pranke
@EtherWolf
Mar 12 2016 03:28
wiki code formatting
CamperBot
@camperbot
Mar 12 2016 03:28

:point_right: code formatting [wiki]

Multi line Code

```js ⇦ Type 3 backticks and then press [shift + enter ⏎] (type js or html or css)

<paste your code here>,
then press [shift + enter ⏎]

``` ⇦ Type 3 backticks, then press [enter ⏎]

Single line Code

This an inline `<paste code here>` code formatting with a single backtick(`) at start and end around the code.

See also: ☛ How to type Backticks | ☯ Compose Mode | ❄ Gitter Formatting Basics

:pencil: read more about code formatting on the FCC Wiki

Jared Pranke
@EtherWolf
Mar 12 2016 03:30
@AdinEi to simplify 1. Type ``` 2.Press enter 3. COpy and paste your code 4. press shift+enter or ctrl+enter and i'd imagine cmd + enter if you are a mac user
Adin
@AdinEi
Mar 12 2016 03:31
<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, Monospace;
  }

  p {
    font-size: 16px;
    font-family: Monospace;
  }

  .smaller-image {
    width: 100px;
  }

  .thick-green-border {
     border-width: 10px;
     border-color: green;
     border-style: solid;
  }
</style>

<h2 class="red-text">CatPhotoApp</h2>

<img class="smaller-image" class="thick-green-border" src="https://bit.ly/fcc-relaxing-cat">

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
Jared Pranke
@EtherWolf
Mar 12 2016 03:32
ok so, in order for this to validate in the code editor, you are going to want to combine those two class attributes into one.
Adin
@AdinEi
Mar 12 2016 03:32
What do I need to eliminate, then?
Jared Pranke
@EtherWolf
Mar 12 2016 03:33
Your image tag should look like this <img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat">
Adin
@AdinEi
Mar 12 2016 03:34
AH! Yes. It runs. Thank you SO much, @EtherWolf!!! :-)
CamperBot
@camperbot
Mar 12 2016 03:34
adinei sends brownie points to @etherwolf :sparkles: :thumbsup: :sparkles:
:warning: adinei already gave etherwolf points
Jared Pranke
@EtherWolf
Mar 12 2016 03:34
@AdinEi No problem, just take it step by step, read through the instructions and this will become pretty intuitive in some time. :+1:
Adin
@AdinEi
Mar 12 2016 03:35
@EtherWolf — Thanks for the encouragement.
CamperBot
@camperbot
Mar 12 2016 03:35
adinei sends brownie points to @etherwolf :sparkles: :thumbsup: :sparkles:
:warning: adinei already gave etherwolf points
MuhammadRe
@MuhammadRe
Mar 12 2016 03:40
if we put margin for pic or boxed then how can we do it responsive
because i want this box or pic to be in the center of the web page.
jarci123
@jarci123
Mar 12 2016 03:40
how do i nest all of the HTML in a div element with the class "container-fluid"?
Manish Giri
@Manish-Giri
Mar 12 2016 03:41
@MuhammadRe
margin: 0 auto;
MuhammadRe
@MuhammadRe
Mar 12 2016 03:41
write in the top <div class="container">
Manish Giri
@Manish-Giri
Mar 12 2016 03:41
@jarci123
<div class=“container-fluid”>
<!— YOUR CURRENT HTML—>
</div>
jarci123
@jarci123
Mar 12 2016 03:42
@Manish-Giri thank you!
CamperBot
@camperbot
Mar 12 2016 03:42
jarci123 sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star: 744 | @manish-giri | http://www.freecodecamp.com/manish-giri
Manish Giri
@Manish-Giri
Mar 12 2016 03:42
@jarci123 anytime!
MuhammadRe
@MuhammadRe
Mar 12 2016 03:44
@Manish-Giri thanks
CamperBot
@camperbot
Mar 12 2016 03:44
muhammadre sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star: 745 | @manish-giri | http://www.freecodecamp.com/manish-giri
MuhammadRe
@MuhammadRe
Mar 12 2016 03:45
how we can do hover a black background to the buttons
http://codepen.io/MuhammadRe/pen/BKKQaz
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 03:46
how to Create an a element that links to http://freecatphotoapp.com and has "cat photos" as its anchor text.
this is what I wrote
<a href='http://freecatphotoapp.com'><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat"></a>
MuhammadRe
@MuhammadRe
Mar 12 2016 03:48
Cat photos btween <a> and <img>
where you want to put your anchor text
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 03:50
element should have the anchor text of "cat photos"
Jared Pranke
@EtherWolf
Mar 12 2016 03:52
what lesson are you on
MuhammadRe
@MuhammadRe
Mar 12 2016 03:52
<p>Cat photos <a href="http://freecodecamp.com"><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat"></a>
here it is
this means the link is with the photo not with the text
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 03:53
this is not working
either
Manish Giri
@Manish-Giri
Mar 12 2016 03:53
@MuhammadRe your code suggestion’s anchor text is incorrect
MuhammadRe
@MuhammadRe
Mar 12 2016 03:54
<p>Cat photos <a href="http://freecodecamp.com"><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat"></a></p>
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 03:54
I am not clear about the problem if it wants the picture to be linked or cat photos content
MuhammadRe
@MuhammadRe
Mar 12 2016 03:54
sorry u have to close p
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 03:54
I did that
MuhammadRe
@MuhammadRe
Mar 12 2016 03:54
i gave u the right code
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 03:54
but that did not work
let me try
David Young
@dayvidwhy
Mar 12 2016 03:54
@fullstackcoderjs it wants the text ‘cat photos’ to link to the website it gave you
Manish Giri
@Manish-Giri
Mar 12 2016 03:55
@fullstackcoderjs based on what you say the instructions are try this
<p><a href="http://freecodecamp.com”>Cat photos</a></p>
David Young
@dayvidwhy
Mar 12 2016 03:55
that text should already exit on the page
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 03:55
I see
MuhammadRe
@MuhammadRe
Mar 12 2016 03:56
@Manish-Giri could u help me in my pen above
Christopher Byrd
@chrabyrd
Mar 12 2016 03:57

Hello all.

I've got a CSS problem with Bootstrap's navpills. I've written some CSS to style two sets of nav-pills: one as a sidebar, and one as a toggle in my proficiency list. For some reason, the sidebar CSS works fine, but it doesn't work for the nav-pills in my proficiency list.

The code is here: <code>http://codepen.io/chrabyrd/pen/pyjJJx/</code>

I'd be really appreciative if anyone could take a look.

Manish Giri
@Manish-Giri
Mar 12 2016 03:57
@MuhammadRe what’s your question
Srinivasan
@kksrini89
Mar 12 2016 03:58
@JordanBourne Your suggestion is to use passport with angularjs
thanks
very nice
MuhammadRe
@MuhammadRe
Mar 12 2016 03:58
to make the background black when u hover it
Srinivasan
@kksrini89
Mar 12 2016 03:58
@JordanBourne thanks
CamperBot
@camperbot
Mar 12 2016 03:58
kksrini89 sends brownie points to @jordanbourne :sparkles: :thumbsup: :sparkles:
:star: 323 | @jordanbourne | http://www.freecodecamp.com/jordanbourne
Manish Giri
@Manish-Giri
Mar 12 2016 03:58
@MuhammadRe try
button:hover {
background-color:black;
}
MuhammadRe
@MuhammadRe
Mar 12 2016 04:03
@chrabyrd you have to do the same for last child of li
.nav-pills li.active a,
.nav-pills li.active a:hover,
.nav-pills li.active a:focus:last-child {
font-weight: bold;
background-color: rgba(245, 245, 245, .1);
}
Sharif Berkeley
@sberkeley
Mar 12 2016 04:04
Question off topic......what is this brownie point stuff?
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 04:05
Help please it does not seem to work. This is the question - Create an a element that links to http://freecatphotoapp.com and has "cat photos" as its anchor text.
CamperBot
@camperbot
Mar 12 2016 04:05
no wiki entry for: please it does not seem to work this is the question - create an a element that links to httpfreecatphotoappcom and has cat photos as its anchor text
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 04:05
here is the response that does not work <p> <a href="http://freecatphotoapp.com">"cat photos"</a> </p>
Xavier Sumba
@cuent
Mar 12 2016 04:07
Hello I'm doing algorithms section and having troubles with some numbers.
Christopher Byrd
@chrabyrd
Mar 12 2016 04:07
@MuhammadRe Thank you for helping me, but unfortunately it doesn't work. The code mostly works, but for some reason two nav-pills in the proficiencies list won't become bold when active.
CamperBot
@camperbot
Mar 12 2016 04:07
chrabyrd sends brownie points to @muhammadre :sparkles: :thumbsup: :sparkles:
:star: 136 | @muhammadre | http://www.freecodecamp.com/muhammadre
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 04:09
@EtherWolf the lesson is html5 Link to External Pages with Anchor Elements
Thomas Mullen
@t-mullen
Mar 12 2016 04:09
The wikimedia app seems to be returning empty responses after the first search... anybody know how to deal with this?
*api
Xavier Sumba
@cuent
Mar 12 2016 04:11

Hello I'm doing algorithms section and having troubles with some numbers in Roman Numeral Converter. This is my code:

function convert(num) {
  var romannum = "";
  var keys = [1,5,10,50,100,500,1000];
  var romanNumerals ={
    1:"I",
    5:"V",
    10:"X",
    50:"L",
    100:"C",
    500:"D",
    1000:"M"
  };

  for(var i=keys.length-1;i>=0;i--){
    if(num===0)
      break;
    var cont=0;
    var pow =Math.pow(10,(num+"").length-1);
    var auxNum =num*pow+pow;
    if(romanNumerals.hasOwnProperty(auxNum)){
      romannum+=romanNumerals[pow]+romanNumerals[auxNum];
      num-=(auxNum-pow);
    }else{
      while(num>=keys[i]){
        romannum+=romanNumerals[keys[i]];
        num-=keys[i];
        cont++;
      }
      if(cont===4){
        var length = ((keys[i]*4)+"").length-1;
        var baseNum = keys[i]*4/Math.pow(10,length);
        var powAux =Math.pow(10,((keys[i]*4)+"").length-1);
        var key = baseNum*powAux+pow;
        var auxRom = romanNumerals[powAux]+romanNumerals[key];

        romannum = romannum.substring(0,romannum.length-4)+auxRom;
      }
    }
  }
 return romannum;
}

I having troubles in numbers like 97. Its because the number is split before to evaluate the 90. Anyone can help me?

saakri
@saakri
Mar 12 2016 04:13
test
MuhammadRe
@MuhammadRe
Mar 12 2016 04:14

@fullstackcoderjs

<p>Here's a <a href="http://freecatphotoapp.com"> Cat photos</a> for you to follow.</p

fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 04:14
@MuhammadRe thanks. this worked <a href='http://freecatphotoapp.com'>cat photos <img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat"></a>
CamperBot
@camperbot
Mar 12 2016 04:14
fullstackcoderjs sends brownie points to @muhammadre :sparkles: :thumbsup: :sparkles:
:star: 137 | @muhammadre | http://www.freecodecamp.com/muhammadre
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 04:15
it does not make much sense though but worked and thanks for the help
MuhammadRe
@MuhammadRe
Mar 12 2016 04:15
i told u
but that is not what they want you to do in this challenge
just anchor text with a link not with link and pic
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 04:17
ok thanks @MuhammadRe
CamperBot
@camperbot
Mar 12 2016 04:17
fullstackcoderjs sends brownie points to @muhammadre :sparkles: :thumbsup: :sparkles:
:warning: fullstackcoderjs already gave muhammadre points
MuhammadRe
@MuhammadRe
Mar 12 2016 04:18
they want you to add link between text
can you tell me how you do it
Thomas Mullen
@t-mullen
Mar 12 2016 04:20
This message was deleted
MuhammadRe
@MuhammadRe
Mar 12 2016 04:21
@Manish-Giri you are still here
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 04:22
@MuhammadRe is this question for me?
kekojones12
@kekojones12
Mar 12 2016 04:22
I need some help. I can't size my image. I've tried everything!
Christopher Byrd
@chrabyrd
Mar 12 2016 04:23
This message was deleted
kekojones12
@kekojones12
Mar 12 2016 04:23
@chrabyrd what do you mean by google?
MuhammadRe
@MuhammadRe
Mar 12 2016 04:24
@fullstackcoderjs yes
@kekojones12 can u send the code
kekojones12
@kekojones12
Mar 12 2016 04:25

<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}

.smaller-image {
width: 100px;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<img src="https://bit.ly/fcc-relaxing-cat">

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 04:25
@MuhammadRe <p> Add a <a href="http://123.com">link</a><p>
only link will become hyperlink in this case
MuhammadRe
@MuhammadRe
Mar 12 2016 04:26
yea and u could add extra text after the link between </a> and </p>
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 04:26
@kekojones12 use border-width attribute in style
Benjamin Gonzalez
@xasuma
Mar 12 2016 04:26
the img-responsive class will attempt to keep an image the same ratio as it was made in all resolutions? or will it attempt just to make it fit the whole screen's width?
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 04:26
and set it to px
@MuhammadRe yes
kekojones12
@kekojones12
Mar 12 2016 04:27
@fullstackcoderjs I have no idea what that is
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 04:28
@kekojones12 sorry width attribute and not the border-width
ok let me send code
<style>.smaller-image {
width: 100px;
}
</style>
change the pixel
MuhammadRe
@MuhammadRe
Mar 12 2016 04:29
no ur code is correct
fullstackcoderjs
@fullstackcoderjs
Mar 12 2016 04:29
and then call this class in your element
image element
MuhammadRe
@MuhammadRe
Mar 12 2016 04:30
<style>
.smaller-image {
width: 100px;
}
</style>
Victory
@victttoryrose
Mar 12 2016 04:30
how do I close a script element using the document ready function? I am just not sure where I need to place });
MuhammadRe
@MuhammadRe
Mar 12 2016 04:31
@victttoryrose after the function

$(document).ready(function() {
$("button").addClass("animated bounce");
$(".well").addClass("animated shake");
$("#target3").addClass("animated fadeOut");

});
</script>

Victory
@victttoryrose
Mar 12 2016 04:31
oh okay! thank you :)
BecksChou
@BecksChou
Mar 12 2016 04:31
hi there, i have a question creating a form element to submit data.
MuhammadRe
@MuhammadRe
Mar 12 2016 04:32
@BecksChou what is it
BecksChou
@BecksChou
Mar 12 2016 04:34
How do I nest my text input element <input type="text" placeholder="cat photo URL"> within a form element. The example code shows <form action="/url-where-you-want-to-submit-form-data"></form>
MuhammadRe
@MuhammadRe
Mar 12 2016 04:34
<form action="/url-where-you-want-to-submit-form-data"></form>
and inside this form u put ur code
<form action="/url-where-you-want-to-submit-form-data">
<input type="text" placeholder="cat photo URL"></form>
BecksChou
@BecksChou
Mar 12 2016 04:39
@MuhammadRe thank you so much! i got a bit confused haha
CamperBot
@camperbot
Mar 12 2016 04:39
beckschou sends brownie points to @muhammadre :sparkles: :thumbsup: :sparkles:
:star: 138 | @muhammadre | http://www.freecodecamp.com/muhammadre
MuhammadRe
@MuhammadRe
Mar 12 2016 04:41
@BecksChou u r welcome
nice photo where is it mexico
Justine Rivera
@JuriRayne
Mar 12 2016 04:43
how do I use the remove function in jquery?
Steven Schulze
@codeturtle
Mar 12 2016 04:43
hello
MuhammadRe
@MuhammadRe
Mar 12 2016 04:45

@JuriRayne

<script>
$(document).ready(function() {
$("button").removeClass();
});

</script>
this for button
for class u do the following
Justine Rivera
@JuriRayne
Mar 12 2016 04:45
i have to remove an element. @MuhammadRe
MuhammadRe
@MuhammadRe
Mar 12 2016 04:47

@JuriRayne
$(document).ready(function() {
$("#target4").removeClass();

});
</script>

@JuriRayne sorry it is without class like this
$("#target4").remove();
Justine Rivera
@JuriRayne
Mar 12 2016 04:48
@MuhammadRe $("target4").removeClass("#target4"); like that?
MuhammadRe
@MuhammadRe
Mar 12 2016 04:48
$("#target4").remove();
like this
Justine Rivera
@JuriRayne
Mar 12 2016 04:49
nothing is happening :/
MuhammadRe
@MuhammadRe
Mar 12 2016 04:50
@JuriRayne
$("#target4").remove();
in this case u remove the button target4
aditigupta16
@aditigupta16
Mar 12 2016 04:51
I am doing the code and submitting the run tests but nothing is happening
Justine Rivera
@JuriRayne
Mar 12 2016 04:51
ah ok. thank you. i was missing a #
aditigupta16
@aditigupta16
Mar 12 2016 04:51
I am on the HTML tutorial
MuhammadRe
@MuhammadRe
Mar 12 2016 04:52
yes i wanted to tell u that cause i see it
could you refer to me with thanks :D
@aditigupta16 what is the prob.
aditigupta16
@aditigupta16
Mar 12 2016 04:53
nothing is happening, I am not able to submit anything , the result is not loading
my internet connection is fine
MuhammadRe
@MuhammadRe
Mar 12 2016 04:54
it means u have something wrong in the code
@aditigupta16 send me the challenge or the code u want to do
Justine Rivera
@JuriRayne
Mar 12 2016 04:54
@MuhammadRe thank you
CamperBot
@camperbot
Mar 12 2016 04:54
jurirayne sends brownie points to @muhammadre :sparkles: :thumbsup: :sparkles:
:star: 139 | @muhammadre | http://www.freecodecamp.com/muhammadre
MuhammadRe
@MuhammadRe
Mar 12 2016 04:54
:D :D :+1:
aditigupta16
@aditigupta16
Mar 12 2016 04:58
Add different margins to each side of an element
This is what I am stuck on

.green-box {
background-color: green;
margin-top: 40px;
margin-right: 20px;
margin-bottom: 20px;
margin-left: 40px;

}

doing this way
Harsh Khandelwal
@harsh2602
Mar 12 2016 05:01
Need help in "Target the same element with multiple jQuery Selectors"
how do I add only one class to multiple jquery selector
MuhammadRe
@MuhammadRe
Mar 12 2016 05:02
@aditigupta16 ur code is correct
try to refresh
aditigupta16
@aditigupta16
Mar 12 2016 05:03
I am doing that
since yesterday
but no help
Steve Carroll
@SteveCarroll
Mar 12 2016 05:05
$('element').addClass('yourClass');
@harsh2602 for you
MuhammadRe
@MuhammadRe
Mar 12 2016 05:06

@harsh2602

<script>
$(document).ready(function() {
$("button").addClass("animated");
$(".btn").addClass(" shake");
$("#target1").addClass("btn-primary");

});

Maulik Darji
@maulikdarji
Mar 12 2016 05:06
@aditigupta16 have you tried resetting your code?
MuhammadRe
@MuhammadRe
Mar 12 2016 05:06
</script>
Steve Carroll
@SteveCarroll
Mar 12 2016 05:06
@MuhammadRe Don;t give him the whole thing ;)
MuhammadRe
@MuhammadRe
Mar 12 2016 05:07
@SteveCarroll hahaha u r right but if it works then he will not ask
Steve Carroll
@SteveCarroll
Mar 12 2016 05:07
At least make him work a little for it...
And he won't think, either.
Harsh Khandelwal
@harsh2602
Mar 12 2016 05:07
oh so it was about inheriting class properties...thanks @SteveCarroll @MuhammadRe
CamperBot
@camperbot
Mar 12 2016 05:07
harsh2602 sends brownie points to @stevecarroll and @muhammadre :sparkles: :thumbsup: :sparkles:
:star: 295 | @stevecarroll | http://www.freecodecamp.com/stevecarroll
:star: 140 | @muhammadre | http://www.freecodecamp.com/muhammadre
Steve Carroll
@SteveCarroll
Mar 12 2016 05:08
@harsh2602 Inheriting is not a word I would use... that comes much later :)
aditigupta16
@aditigupta16
Mar 12 2016 05:08
@maulikdarji tried that too :(
MuhammadRe
@MuhammadRe
Mar 12 2016 05:08
@aditigupta16 could u restart ur pc
Maulik Darji
@maulikdarji
Mar 12 2016 05:08
@aditigupta16 Paste your whole code here
aditigupta16
@aditigupta16
Mar 12 2016 05:09
margin-top: 40px;
margin-right: 20px;
margin-bottom: 20px;
margin-left: 40px;
}
Maulik Darji
@maulikdarji
Mar 12 2016 05:09
wiki formatiing
CamperBot
@camperbot
Mar 12 2016 05:09
no wiki entry for: formatiing
Maulik Darji
@maulikdarji
Mar 12 2016 05:09
wiki format
CamperBot
@camperbot
Mar 12 2016 05:09

:point_right: code formatting [wiki]

Multi line Code

```js ⇦ Type 3 backticks and then press [shift + enter ⏎] (type js or html or css)

<paste your code here>,
then press [shift + enter ⏎]

``` ⇦ Type 3 backticks, then press [enter ⏎]

Single line Code

This an inline `<paste code here>` code formatting with a single backtick(`) at start and end around the code.

See also: ☛ How to type Backticks | ☯ Compose Mode | ❄ Gitter Formatting Basics

:pencil: read more about code formatting on the FCC Wiki

aditigupta16
@aditigupta16
Mar 12 2016 05:09

<style>
.injected-text {
margin-bottom: -25px;
text-align: center;
}

.box {
border-style: solid;
border-color: black;
border-width: 5px;
text-align: center;
}

.yellow-box {
background-color: yellow;
padding: 10px;
}

.red-box {
background-color: red;
margin-top: 40px;
margin-right: 20px;
margin-bottom: 20px;
margin-left: 40px;
}

.green-box {
background-color: green;
margin-top: 40px;
margin-right: 20px;
margin-bottom: 20px;
margin-left: 40px;
}
}
</style>

<h5 class="injected-text">margin</h5>

<div class="box yellow-box">
<h5 class="box red-box">padding</h5>
<h5 class="box green-box">padding</h5>
</div>

Maulik Darji
@maulikdarji
Mar 12 2016 05:10
@aditigupta16 You have an extra } before </style>
MuhammadRe
@MuhammadRe
Mar 12 2016 05:11
yes that's right
aditigupta16
@aditigupta16
Mar 12 2016 05:14
Thanks I corrected the error, but the problem is not that because previously it was not showing error log even, and now also nothing is happening
Maulik Darji
@maulikdarji
Mar 12 2016 05:16
@aditigupta16 now try reset :smile:
aditigupta16
@aditigupta16
Mar 12 2016 05:18
tried that :(
Maulik Darji
@maulikdarji
Mar 12 2016 05:20
@aditigupta16 which test is not passing?
Lohan666
@Lohan666
Mar 12 2016 05:20
hi need some help!
aditigupta16
@aditigupta16
Mar 12 2016 05:20
Nothing is loading, I press runtests and then thats it
nothing
Lohan666
@Lohan666
Mar 12 2016 05:21
"nest your form text input in a div"what does it means?
does it means add <div>to every form text input?
Maulik Darji
@maulikdarji
Mar 12 2016 05:22
@aditigupta16 Below your Run Tests button, which tests are marked Red Cross??
Manish Giri
@Manish-Giri
Mar 12 2016 05:24
@Lohan666
<div>
<input type=“text”>
</div>
Maulik Darji
@maulikdarji
Mar 12 2016 05:24
@Lohan666 Yes, it means add <div> to every form text input;
R.Scott Lane
@rslane32
Mar 12 2016 05:24
this jQuery stuff is amazing but it seems crazy to learn how to define css just to ignore it and say we will just assign classes with bootstrap and then forget it all and change everything with jQuery. it's like a darn free for all.
Manish Giri
@Manish-Giri
Mar 12 2016 05:25
@MuhammadRe yeah, what’s up
Lohan666
@Lohan666
Mar 12 2016 05:25
@maulikdarji @Manish-Giri ok let me try it
venkateswar
@Vikavenkat
Mar 12 2016 05:26
hii dudes i have one doubt
R.Scott Lane
@rslane32
Mar 12 2016 05:26
@Vikavenkat whats the doubt?
@Vikavenkat did yo mean "debt"? i have several debts
venkateswar
@Vikavenkat
Mar 12 2016 05:27
am stuck how to nest i element with our button element .?
aditigupta16
@aditigupta16
Mar 12 2016 05:28
below the run tests and all the buttons nothing is there @maulikdarji
venkateswar
@Vikavenkat
Mar 12 2016 05:28
Add Font Awesome Icons to our Buttons thizz exercise nly
@rslane32
R.Scott Lane
@rslane32
Mar 12 2016 05:29
@Vikavenkat I think nesting just means <button> <i> it goes in here </i></button> right?
Maulik Darji
@maulikdarji
Mar 12 2016 05:29
@aditigupta16 That may mean that tests are not loaded. Restart your browser, try clearing cache. Or try some different browser.
venkateswar
@Vikavenkat
Mar 12 2016 05:29
k dude i will try
aditigupta16
@aditigupta16
Mar 12 2016 05:30
okay let me try that
William Guiraud
@VancouverIsland
Mar 12 2016 05:34
One quick question for you guys about anchor elements. The following code <h2 class="red-text"><a href="http://freecatphotoapp.com">CatPhotos</a>App</h2>
gives me this error message Your a element should have the anchor text of "cat photos".
aditigupta16
@aditigupta16
Mar 12 2016 05:35
@maulikdarji nothing still
even the exercises I have submitted are not loading
William Guiraud
@VancouverIsland
Mar 12 2016 05:35
I've been trying for almost one hour now. Any comments? Thank you for your help.
R.Scott Lane
@rslane32
Mar 12 2016 05:36
@Vikavenkat I saw the excercise you are talking about just put the <i class="fa fa-info-circle"></i> inside the button element
Maulik Darji
@maulikdarji
Mar 12 2016 05:36
@VancouverIsland Anchor text is text between <a> and </a> tags. It should match with given text (i.e. "cat photos")
R.Scott Lane
@rslane32
Mar 12 2016 05:37
@Vikavenkat or whatever icon you wanted to use of course
Maulik Darji
@maulikdarji
Mar 12 2016 05:37
@aditigupta16 Maybe something's wrong with your pc, otherwise the code is correct.
aditigupta16
@aditigupta16
Mar 12 2016 05:39
@maulikdarji : thanks , i will look into whats happening
CamperBot
@camperbot
Mar 12 2016 05:39
aditigupta16 sends brownie points to @maulikdarji :sparkles: :thumbsup: :sparkles:
:star: 553 | @maulikdarji | http://www.freecodecamp.com/maulikdarji
William Guiraud
@VancouverIsland
Mar 12 2016 05:39
@maulikdarji Thanks for your answer. i'm using a mac.
CamperBot
@camperbot
Mar 12 2016 05:39
vancouverisland sends brownie points to @maulikdarji :sparkles: :thumbsup: :sparkles:
:star: 554 | @maulikdarji | http://www.freecodecamp.com/maulikdarji
Maulik Darji
@maulikdarji
Mar 12 2016 05:40
@VancouverIsland :smile:
13gangadhar
@13gangadhar
Mar 12 2016 05:43
Replace the value of your a element's href attribute with a #, also known as a hash symbol, to turn it into a dead link. wha is the meaning
Benjamin Gonzalez
@xasuma
Mar 12 2016 05:43
I am stuck.. I have 2 problems with my tribute page that I can't figure out: #1) I want to make my navitation "checkpoints" not look like a link. #2) I am trying to animate the text at the very end with jqury, but I can't. Help pls.
http://codepen.io/xasuma/pen/YqWBVo
Maulik Darji
@maulikdarji
Mar 12 2016 05:47
@13gangadhar With the use of "#" as href, the link will not point to any other document, making it a dead-link.
<a href="#">DeadLink</a>
DJ
@qualitymanifest
Mar 12 2016 05:48
@xasuma give a color: white;. (or whatever color you want)
Nigel
@nigeljoy
Mar 12 2016 05:49
@xasuma you mean you want to get rid of underline? use text-decoration:none in that elements css
Benjamin Gonzalez
@xasuma
Mar 12 2016 05:49
@qualitymanifest thank you that worked !
CamperBot
@camperbot
Mar 12 2016 05:49
xasuma sends brownie points to @qualitymanifest :sparkles: :thumbsup: :sparkles:
Bruce
@bleepr315
Mar 12 2016 05:49
hi
CamperBot
@camperbot
Mar 12 2016 05:49
:star: 1070 | @qualitymanifest | http://www.freecodecamp.com/qualitymanifest
Benjamin Gonzalez
@xasuma
Mar 12 2016 05:49
and the underline was on purpose ^^ @nigeljoy
DJ
@qualitymanifest
Mar 12 2016 05:49
@xasuma np. you'll have to do the same for a:hover otherwise it will turn blue again when you hover over it
Benjamin Gonzalez
@xasuma
Mar 12 2016 05:50
awesome, that worked as well :)
@qualitymanifest would you happen to know why my animation isn't working? I am trying to animate the very last "coded by ..."
tommy
@tommygebru
Mar 12 2016 05:52
completed the quote machine please share your thoughts :smile:
http://codepen.io/gebrutommy/pen/xVZOgg?editors=1100
Craig Banach
@CraigBanach
Mar 12 2016 05:52
@tommygebru Text is hard to read against the background. If you make your text have a black border I believe it makes it much more readable.
DJ
@qualitymanifest
Mar 12 2016 05:53
@xasuma click the gear icon next to "JS". you'll have to add jquery (and i think also jquery UI)
Craig Banach
@CraigBanach
Mar 12 2016 05:54
@tommygebru Your "new" button doesn't look like a button, it looks just like the text below it, perhaps give it more distinction that it is clickable.
@tommygebru Apart from that it looks good
DJ
@qualitymanifest
Mar 12 2016 05:55
@xasuma also i'm pretty sure that animation will happen as soon as the page is done loading, so you'd have to figure out a way to make it not happen until you scroll down to that part
tommy
@tommygebru
Mar 12 2016 05:56
@CraigBanach i changed the small paragraph so that the shadow is less far apart thanks!!
CamperBot
@camperbot
Mar 12 2016 05:56
tommygebru sends brownie points to @craigbanach :sparkles: :thumbsup: :sparkles:
:star: 375 | @craigbanach | http://www.freecodecamp.com/craigbanach
Benjamin Gonzalez
@xasuma
Mar 12 2016 05:56
I see, ok I'll try ;)
@qualitymanifest
Steve Carroll
@SteveCarroll
Mar 12 2016 05:57
@tommygebru Cool but the tweet button isn't working for me.
tommy
@tommygebru
Mar 12 2016 05:59
@SteveCarroll jeeeez i forgot about that thanks!!
CamperBot
@camperbot
Mar 12 2016 05:59
tommygebru sends brownie points to @stevecarroll :sparkles: :thumbsup: :sparkles:
:star: 300 | @stevecarroll | http://www.freecodecamp.com/stevecarroll
Manish Giri
@Manish-Giri
Mar 12 2016 06:00
@tommygebru it looks like your tweet button just brings up the twitter page, and of course, you need to use target=“_blank” to get it to work (open in new tab)
tommy
@tommygebru
Mar 12 2016 06:01
@Manish-Giri heyy! :wave: yeah I took a screen shot of the notes I will work on this in the morning :smile:
NormalWare
@Centuriom
Mar 12 2016 06:02
Hello guys, if i want to add class to only one div what should i change in this code ?
$('div').addClass('active');
I have more than one div on the HTML page
cannelflow
@cannelflow
Mar 12 2016 06:03
@Centuriom give it a unique class name
NormalWare
@Centuriom
Mar 12 2016 06:05
for example if i give the div this class name "first". What i need to change in the jQuery code.
$('div.first').addClass('active'); ?
DJ
@qualitymanifest
Mar 12 2016 06:05
@Centuriom $('.first').addClass('active'); would do
NormalWare
@Centuriom
Mar 12 2016 06:06
@qualitymanifest @cannelflow Thanks !!
CamperBot
@camperbot
Mar 12 2016 06:06
centuriom sends brownie points to @qualitymanifest and @cannelflow :sparkles: :thumbsup: :sparkles:
:star: 893 | @cannelflow | http://www.freecodecamp.com/cannelflow
:star: 1071 | @qualitymanifest | http://www.freecodecamp.com/qualitymanifest
DJ
@qualitymanifest
Mar 12 2016 06:06
cannelflow
@cannelflow
Mar 12 2016 06:08
@Centuriom :+1:
Aiden
@AidenKerr
Mar 12 2016 06:17
http://codepen.io/AidenKerr/pen/JXKqgQ How can I make the two divs take up the whole height of the page?
venkateswar
@Vikavenkat
Mar 12 2016 06:18
hi dudes split your bootstrap row how it do any one
?????
Aiden
@AidenKerr
Mar 12 2016 06:19
@Vikavenkat Do you mean with col-md-4 etc?
venkateswar
@Vikavenkat
Mar 12 2016 06:19
sry come again
Aiden
@AidenKerr
Mar 12 2016 06:20
@Vikavenkat Do you mean like splitting up a row into multiple columns?
venkateswar
@Vikavenkat
Mar 12 2016 06:20
ya exactly dude
Aiden
@AidenKerr
Mar 12 2016 06:21
Ok, FreeCodeCamp teaches that in the responsive web design section. I will link it
venkateswar
@Vikavenkat
Mar 12 2016 06:21

<div class="container-fluid">
<h3 class="text-primary text-center">jQuery Playground</h3>
<div class="row"><div class="col-xs-6 col-xs-6 ">
</div>
</div>

</div>

Michael Aubrey
@mca62511
Mar 12 2016 06:21
@AidenKerr height: 100vh;
@AidenKerr with vh meaning "view height"
Aiden
@AidenKerr
Mar 12 2016 06:21
@mca62511 Thank you
CamperBot
@camperbot
Mar 12 2016 06:21
aidenkerr sends brownie points to @mca62511 :sparkles: :thumbsup: :sparkles:
:star: 369 | @mca62511 | http://www.freecodecamp.com/mca62511
Aiden
@AidenKerr
Mar 12 2016 06:23
@Vikavenkat hold on one sec
Aiden
@AidenKerr
Mar 12 2016 06:31
@Vikavenkat Ahh I found your issue. First of all, be sure to import Bootstrap. If you don't know how to do that, ask me. Also, you have col-xs-6 written twice in one div. It should be one in each div. Again, I can explain why if you need it
each div as in each div in the row
DrewBowzer2016
@DrewBowzer2016
Mar 12 2016 06:32
how do you post codepen to this site like how i see others do
Aiden
@AidenKerr
Mar 12 2016 06:32
@DrewBowzer2016 Just post the URL of your pen. It will link automatically
Jason
@JasonDeving
Mar 12 2016 06:32
you just post the link and it will auto populate
DrewBowzer2016
@DrewBowzer2016
Mar 12 2016 06:33
got it thanks
venkateswar
@Vikavenkat
Mar 12 2016 06:33
will u pls code it ya...@Aidenkerr
Aiden
@AidenKerr
Mar 12 2016 06:33
ok @Vikavenkat give me a moment
venkateswar
@Vikavenkat
Mar 12 2016 06:33
hmm k dude take ur time..
Aiden
@AidenKerr
Mar 12 2016 06:36

@Vikavenkat <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"/>

<div class="container-fluid">
<div class="row"><div class="col-xs-6">
<h3 class="text-primary text-center">jQuery Playground</h3>
</div>
<div class=" col-xs-6">
Test
</div>
</div>
</div>

Gurwinder Singh
@contactogurwinder
Mar 12 2016 06:37
Hi
Aiden
@AidenKerr
Mar 12 2016 06:37
hi @contactogurwinder
Gurwinder Singh
@contactogurwinder
Mar 12 2016 06:37

Can anyone please tell me why this doesnt work
'''

<script>
$(document).ready(function() {
$(".well").addclass("animated shake");
});
</script>

<div class="container-fluid">
<h3 class="text-primary text-center">jQuery Playground</h3>
<div class="row">
<div class="col-xs-6">
<h4>#left-well</h4>
<div class="well" id="left-well">
<button class="btn btn-default target" id="target1">#target1</button>
<button class="btn btn-default target" id="target2">#target2</button>
<button class="btn btn-default target" id="target3">#target3</button>
</div>
</div>
<div class="col-xs-6">
<h4>#right-well</h4>
<div class="well" id="right-well">
<button class="btn btn-default target" id="target4">#target4</button>
<button class="btn btn-default target" id="target5">#target5</button>
<button class="btn btn-default target" id="target6">#target6</button>
</div>
</div>
</div>
</div>
'''

CamperBot
@camperbot
Mar 12 2016 06:37
:bulb: to format code use backticks! ``` more info
venkateswar
@Vikavenkat
Mar 12 2016 06:38
hi frnds all r dng which exercise..???
Gurwinder Singh
@contactogurwinder
Mar 12 2016 06:38
I am supposed to apply animated and shake class to all the elements of 'well' class
<script>
$(document).ready(function() {
$(".well").addclass("animated shake");
});
</script>
doesnt work
Steve Carroll
@SteveCarroll
Mar 12 2016 06:39
addClass
NormalWare
@Centuriom
Mar 12 2016 06:39
.addClass();
Steve's beard is pretty cool
Steve Carroll
@SteveCarroll
Mar 12 2016 06:40
It's grayer now ;)
Michael Aubrey
@mca62511
Mar 12 2016 06:54
@Vikavenkat I'm making the twitch project
and half watching tv, so slow work
venkateswar
@Vikavenkat
Mar 12 2016 06:56
hmm k ya u are from which country..?
Magic Mish
@magicmish
Mar 12 2016 06:57
Hello :) I'm having trouble working out where I have gone wrong here in regards to "Only add one class with each of your three selectors." Here is my code, any clues or advice much appreciated: <script>
$(document).ready(function() {
$("button").addClass("animated");
$(".btn").addClass("animated shake");
$("#target1").addClass("btn-primary");
});
</script>
Michael Aubrey
@mca62511
Mar 12 2016 06:58
@Vikavenkat Born in the States, been living in Japan three years now
xentricqt
@xentricqt
Mar 12 2016 06:59

i'm on return early pattern for functions (210) i can get it to return a number but it'll return Null for -2,2 or 2,-2 instead of undefind `// Setup
function abTest(a, b) {
// Only change code below this line

console.log (Math.round(Math.pow(Math.sqrt(b) + Math.sqrt(a), 2 )));

// Only change code above this line

return Math.round(Math.pow(Math.sqrt(a) + Math.sqrt(b), 2 ));
}

// Change values below to test your code
abTest(2,-2);`

venkateswar
@Vikavenkat
Mar 12 2016 06:59
hmm nice to meet u...@mcs62511
Michael Aubrey
@mca62511
Mar 12 2016 07:00
and you ^_^
Magic Mish
@magicmish
Mar 12 2016 07:00
aah - worked it out! thanks anyway.
supersj
@supersj
Mar 12 2016 07:00
@magicmish i have the same problem...
venkateswar
@Vikavenkat
Mar 12 2016 07:00
am from india
Michael Aubrey
@mca62511
Mar 12 2016 07:01
wait, what project is that?
Niko Salonen
@nikosalonen
Mar 12 2016 07:01
@magicmish check the second addClass
Michael Aubrey
@mca62511
Mar 12 2016 07:01
is that a new project or something for FCC?
@magicmish What project are you working on?
Niko Salonen
@nikosalonen
Mar 12 2016 07:02
that's one of the jquery basics
Michael Aubrey
@mca62511
Mar 12 2016 07:02
I don't remember ever making that
Any chance you can give me a link to the FCC page that instructs you to make that?
Niko Salonen
@nikosalonen
Mar 12 2016 07:05
@mca62511 it's "Target the same element with multiple jQuery Selectors"
easiest way to find is click map and type it in the search
Michael Aubrey
@mca62511
Mar 12 2016 07:06
yeah, that says nothing about building a city gallery
its all about selecting buttons
Austin West
@scienceoflife
Mar 12 2016 07:07
Wow, i never realized how much FCC teaches jquery reliance
venkateswar
@Vikavenkat
Mar 12 2016 07:07
hey u frm where ya nikosalonen
Niko Salonen
@nikosalonen
Mar 12 2016 07:08
@mca62511 oh I thought you meant what's the task he asked help with
@Vikavenkat i'm from finland
venkateswar
@Vikavenkat
Mar 12 2016 07:09
k dude nice to meet u
Michael Aubrey
@mca62511
Mar 12 2016 07:09
@nikosalonen Oh that's my bad, I got the usernames confused
Niko Salonen
@nikosalonen
Mar 12 2016 07:09
you too
Michael Aubrey
@mca62511
Mar 12 2016 07:10
someone posted this
http://www.freecodecamp.com/challenges/target-the-same-element-with-multiple-jquery-selectors
and I was wondering which FCC project that is
Niko Salonen
@nikosalonen
Mar 12 2016 07:10
@mca62511 ah okay :)
Shreyas
@softKarma
Mar 12 2016 07:17
I dont understand this sentence - " You must target the children of element with the target class." There is no target class in the whole document. I f
I wrote this code $(".well:nth-child(2)").addClass("animated bounce"); as per my understanding
Can anyone please explain me what has to done here?
Niko Salonen
@nikosalonen
Mar 12 2016 07:18
every button has class target in that exercise
Shreyas
@softKarma
Mar 12 2016 07:20
ohh shit how did I miss it.... so this should work right $(".target:nth-child(2)").addClass("animated bounce"); ?
ya it did
Niko Salonen
@nikosalonen
Mar 12 2016 07:20
:)
Shreyas
@softKarma
Mar 12 2016 07:20
thanks just warming up so :-p
Niko Salonen
@nikosalonen
Mar 12 2016 07:21
it happens :)
Shreyas
@softKarma
Mar 12 2016 07:22
yes :-D
Mentor
@bestorw01
Mar 12 2016 07:25
Hello guys i need your help on this JQuery Code
<script>
  $(document).ready(function() {
    $("button").addClass("animated bounce");
    $(".well").addClass("animated shake");
    $("#target3").addClass("animated fadeOut");
    $("#target2").removeClass("btn-default");
  });
</script>
i want to remove "btn-default" from all the buttons
Shreyas
@softKarma
Mar 12 2016 07:27
I thinking selecting the button and calling removeClass with this class name should work
Michael Aubrey
@mca62511
Mar 12 2016 07:32
from all the buttons?
$("button").removeClass(".btn-default");
This message was deleted
anthonygallina1
@anthonygallina1
Mar 12 2016 07:34
This message was deleted
Elsalan
@Elsalan
Mar 12 2016 07:36
Excuse me. I'd like to ask about the legend. I don't know how to put the legend out of the plot.
legend("topright", c("species A", "species B","species C"), col = c(4,2,1), lty = 1:2)
Dave Melia
@Dave-Melia
Mar 12 2016 08:03
@naidusuresh36 What are you stuck with?
Aleksander Gębicki
@Takumar
Mar 12 2016 08:03
@naidusuresh36 there is no such thing as <p2> element, change this to <p> paragraph tag.
Mentor
@bestorw01
Mar 12 2016 08:04
@mca62511 thanks but instead of using button i did use the target 1-6
CamperBot
@camperbot
Mar 12 2016 08:04
bestorw01 sends brownie points to @mca62511 :sparkles: :thumbsup: :sparkles:
Suresh Naidu
@naidusuresh36
Mar 12 2016 08:04
@Takumar okay so it is always <p> ?
CamperBot
@camperbot
Mar 12 2016 08:04
:star: 370 | @mca62511 | http://www.freecodecamp.com/mca62511
Aleksander Gębicki
@Takumar
Mar 12 2016 08:04
@naidusuresh36 yes, only headings have its numbers: <h1> to <h6>, paragraphs have to by styled to change size of their texts.
Dave Melia
@Dave-Melia
Mar 12 2016 08:04
@Takumar Where are you seeing p2? His link doesn't have p2 (for me)
Suresh Naidu
@naidusuresh36
Mar 12 2016 08:05
@Takumar oh okay , any other mistake ?
Aleksander Gębicki
@Takumar
Mar 12 2016 08:05
@Dave-Melia <p2>Purr jump eat the...
Dave Melia
@Dave-Melia
Mar 12 2016 08:05
@Takumar Strike that, Firefox blocked it as XSS
Aleksander Gębicki
@Takumar
Mar 12 2016 08:05
@naidusuresh36 no, after correcting this you will pass challenge.
abdullah sayeed
@03002734971
Mar 12 2016 08:06
how to create p element that has a text of hello paragraph?
Dave Melia
@Dave-Melia
Mar 12 2016 08:06
@naidusuresh36 everything looks good apart from the p2, put it back to just p and it'll pass
Suresh Naidu
@naidusuresh36
Mar 12 2016 08:06
@Takumar paragraph styling is to be done inside the style class right? @Dave-Melia let me try
@Takumar @Dave-Melia thank you guys :)
CamperBot
@camperbot
Mar 12 2016 08:06
naidusuresh36 sends brownie points to @takumar and @dave-melia :sparkles: :thumbsup: :sparkles:
:star: 2672 | @takumar | http://www.freecodecamp.com/takumar
:star: 289 | @dave-melia | http://www.freecodecamp.com/dave-melia
abdullah sayeed
@03002734971
Mar 12 2016 08:07
@naidusuresh36 how to create p element that has a text of hello paragraph?
Dave Melia
@Dave-Melia
Mar 12 2016 08:07
@03002734971 ```<p>hello paragraph</p>
Suresh Naidu
@naidusuresh36
Mar 12 2016 08:07
<p> hello paragrap </p>
Dave Melia
@Dave-Melia
Mar 12 2016 08:08
<p>hello paragraph</p>
abdullah sayeed
@03002734971
Mar 12 2016 08:08
thanks @Dave-Melia @naidusuresh36
CamperBot
@camperbot
Mar 12 2016 08:08
03002734971 sends brownie points to @dave-melia and @naidusuresh36 :sparkles: :thumbsup: :sparkles:
:star: 290 | @dave-melia | http://www.freecodecamp.com/dave-melia
:star: 19 | @naidusuresh36 | http://www.freecodecamp.com/naidusuresh36
Dave Melia
@Dave-Melia
Mar 12 2016 08:09
@BKinahan Thanks! Sorry, I've only just saw your response (the question about the contains method and you said you can just use indexOf)
CamperBot
@camperbot
Mar 12 2016 08:09
dave-melia sends brownie points to @bkinahan :sparkles: :thumbsup: :sparkles:
:star: 1039 | @bkinahan | http://www.freecodecamp.com/bkinahan
Dave Melia
@Dave-Melia
Mar 12 2016 08:10
Does anyone know of a good timer I can use to see how many hours I'm coding for a day?
Maulik Darji
@maulikdarji
Mar 12 2016 08:14
Niko Salonen
@nikosalonen
Mar 12 2016 08:14
@Dave-Melia https://wakatime.com/
Mentor
@bestorw01
Mar 12 2016 08:14
@Dave-Melia try www.e.ggtimer.com
Dave Melia
@Dave-Melia
Mar 12 2016 08:15
@maulikdarji @nikosalonen @bestorw01 wow all of these are great, thank you
CamperBot
@camperbot
Mar 12 2016 08:15
dave-melia sends brownie points to @maulikdarji and @nikosalonen and @bestorw01 :sparkles: :thumbsup: :sparkles:
:star: 555 | @maulikdarji | http://www.freecodecamp.com/maulikdarji
:star: 124 | @bestorw01 | http://www.freecodecamp.com/bestorw01
:star: 299 | @nikosalonen | http://www.freecodecamp.com/nikosalonen
Anuj Kumar
@anujk0292
Mar 12 2016 08:35
Wakatime is awesome
even the free version is good enough to give stats.
David Young
@dayvidwhy
Mar 12 2016 08:41
wakatime looks cool
Ashraful Islam
@iashraful
Mar 12 2016 08:42
what is wakatime?
Ashraful Islam
@iashraful
Mar 12 2016 08:42
looks very complex
I'm confused and frightened
David Young
@dayvidwhy
Mar 12 2016 08:42
looks like it just plugs into your ide
Ashraful Islam
@iashraful
Mar 12 2016 08:43
Lots of technical terms there => Metrics, insights, and time tracking automatically generated from your programming activity.
Dave Melia
@Dave-Melia
Mar 12 2016 08:43
I think i'm settling on RescueTime, I don't use an IDE exclusively, I use repl.it and FCC a lot, so I'd like it to track those, too
David Young
@dayvidwhy
Mar 12 2016 08:43
but what about vim
Ashraful Islam
@iashraful
Mar 12 2016 08:43
@Dave-Melia yes, rescue time is nice
Dave Melia
@Dave-Melia
Mar 12 2016 08:43
@iashraful They're not technical, they're just statistics
@deedubwhy there's a vim plugin ;)
David Young
@dayvidwhy
Mar 12 2016 08:45
weow
Suresh Naidu
@naidusuresh36
Mar 12 2016 08:50
I am struck again , need a little guidance
http://www.freecodecamp.com/challenges/nest-an-anchor-element-within-a-paragraph#?solution=%3Clink%20href%3D%22http%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DLobster%22%20rel%3D%22stylesheet%22%20type%3D%22text%2Fcss%22%3E%0A%3Cstyle%3E%0A%20%20.red-text%20%7B%0A%20%20%20%20color%3A%20red%3B%0A%20%20%7D%0A%0A%20%20h2%20%7B%0A%20%20%20%20font-family%3A%20Lobster%2C%20Monospace%3B%0A%20%20%7D%0A%0A%20%20p%20%7B%0A%20%20%20%20font-size%3A%2016px%3B%0A%20%20%20%20font-family%3A%20Monospace%3B%0A%20%20%7D%0A%0A%20%20.thick-green-border%20%7B%0A%20%20%20%20border-color%3A%20green%3B%0A%20%20%20%20border-width%3A%2010px%3B%0A%20%20%20%20border-style%3A%20solid%3B%0A%20%20%20%20border-radius%3A%2050%25%3B%0A%20%20%7D%0A%0A%20%20.smaller-image%20%7B%0A%20%20%20%20width%3A%20100px%3B%0A%20%20%7D%0A%3C%2Fstyle%3E%0A%0A%3Ch2%20class%3D%22red-text%22%3ECatPhotoApp%3C%2Fh2%3E%0A%0A%3Ca%20href%3D%22http%3A%2F%2Fwww.freecatphotoapp.com%22%3Ecat%20photos%3C%2Fa%3E%0A%0A%3Cimg%20class%3D%22smaller-image%20thick-green-border%22%20src%3D%22https%3A%2F%2Fbit.ly%2Ffcc-relaxing-cat%22%3E%0A%0A%3Cp%20class%3D%22red-text%22%3E%20%3Ca%20href%3D'http%3A%2F%2Fwww.freecatphotoapp.com'%3E%20view%20more%20%3C%2Fa%3E%20Kitty%20ipsum%20dolor%20sit%20amet%2C%20shed%20everywhere%20shed%20everywhere%20stretching%20attack%20your%20ankles%20chase%20the%20red%20dot%2C%20hairball%20run%20catnip%20eat%20the%20grass%20sniff.%3C%2Fp%3E%0A%3Cp%20class%3D%22red-text%22%3EPurr%20jump%20eat%20the%20grass%20rip%20the%20couch%20scratched%20sunbathe%2C%20shed%20everywhere%20rip%20the%20couch%20sleep%20in%20the%20sink%20fluffy%20fur%20catnip%20scratched.%3C%2Fp%3E%0A
Ashraful Islam
@iashraful
Mar 12 2016 08:54
@naidusuresh36 here is the correction for you
<h2 class="red-text">CatPhotoApp</h2>

<p> view more <a href="http://www.freecatphotoapp.com">cat photos</a></p><!-- oooo lovely correction here -->

<img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat">

<p class="red-text"> Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
Suresh Naidu
@naidusuresh36
Mar 12 2016 08:54
@iashraful thank you :)
CamperBot
@camperbot
Mar 12 2016 08:54
naidusuresh36 sends brownie points to @iashraful :sparkles: :thumbsup: :sparkles:
:star: 498 | @iashraful | http://www.freecodecamp.com/iashraful
Suresh Naidu
@naidusuresh36
Mar 12 2016 08:57
@iashraful why did you remove <a href="http://www.freecatphotoapp.com">cat photos</a> ?
i could not understand that part
Ashraful Islam
@iashraful
Mar 12 2016 08:58
you have to put the view more around your anchor, not the otherway around
the challenge said I need to make it view more cat photos under h2 tag
Suresh Naidu
@naidusuresh36
Mar 12 2016 08:58
@iashraful oh understood, thank you! :clap:
CamperBot
@camperbot
Mar 12 2016 08:58
naidusuresh36 sends brownie points to @iashraful :sparkles: :thumbsup: :sparkles:
:warning: naidusuresh36 already gave iashraful points
Ashraful Islam
@iashraful
Mar 12 2016 08:58
so I made changes to the one under h2 tag
Richard Andrews
@Whiplash5057
Mar 12 2016 08:59
function myReplace(str, before, after) {
  var arrInd = [];
  arrInd = str.split(" ");
  var index = arrInd.indexOf(before);

  if(arrInd[index][0] == arrInd[index][0].toUpperCase){

    arrInd[index] = after.charAt(0).toUpperCase + after.split(1); 
  }
  else{
    arrInd[index] = after;
  }

 var finalStr = arrInd.join(' ');
  return finalStr;


}

myReplace("He is Sleeping on the couch", "Sleeping", "sitting");
i have to replace before with the after but if the before has a capital first letter then the after also has to have a capital first letter
not working ...don't know why
Tmore23
@Tmore23
Mar 12 2016 09:09
I dont understand what the first lesson on the containers is asking me to do. can anyone help me?
jihad khorfan
@spyshow
Mar 12 2016 09:13

hi all i have a question i have this code

var myArray = [];

myArray = ['jihad khorfan','jkhorfan'];

function cutName(str){
  var arr = str.split(" ");
  return arr;
}

var myData = {} ;

myData = {fullName : cutName(myArray[0]) , skype : myArray[1] , github : "spyshow"};

but it give me this

Object {fullName: Array[2], skype: "jkhorfan", github: "spyshow"}

instead of

{fullName: ["jihad","khorfan"], skype: "jkhorfan", github: "spyshow"}
Ashraful Islam
@iashraful
Mar 12 2016 09:21
@spyshow but it gives me the correct output
blob
^ see
jihad khorfan
@spyshow
Mar 12 2016 09:22
that is strange it tried it in console and gave me that
i tried it in jsbin and give me correct answer
Ashraful Islam
@iashraful
Mar 12 2016 09:22
wait let me try in console
yes, console makes it smaller for easier display
Array[2] means an array with 2 elements in it
Limpuls
@Limpuls
Mar 12 2016 09:23
Hey, anyone knows how to make my h1 text bigger using Bootstrap? If I make it like 50px in css it becomes not responsive anymore...
jihad khorfan
@spyshow
Mar 12 2016 09:24
@iashraful thanks i didn't know that
CamperBot
@camperbot
Mar 12 2016 09:24
spyshow sends brownie points to @iashraful :sparkles: :thumbsup: :sparkles:
:star: 499 | @iashraful | http://www.freecodecamp.com/iashraful
Tmore23
@Tmore23
Mar 12 2016 09:26
@Limpuls Would you mind explaining to me what am i suppose to do on the first lesson in bootstrap?
Suresh Naidu
@naidusuresh36
Mar 12 2016 09:30
Hi can you help me with this?
http://www.freecodecamp.com/challenges/turn-an-image-into-a-link#?solution=%3Clink%20href%3D%22http%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DLobster%22%20rel%3D%22stylesheet%22%20type%3D%22text%2Fcss%22%3E%0A%3Cstyle%3E%0A%20%20.red-text%20%7B%0A%20%20%20%20color%3A%20red%3B%0A%20%20%7D%0A%0A%20%20h2%20%7B%0A%20%20%20%20font-family%3A%20Lobster%2C%20Monospace%3B%0A%20%20%7D%0A%0A%20%20p%20%7B%0A%20%20%20%20font-size%3A%2016px%3B%0A%20%20%20%20font-family%3A%20Monospace%3B%0A%20%20%7D%0A%0A%20%20.thick-green-border%20%7B%0A%20%20%20%20border-color%3A%20green%3B%0A%20%20%20%20border-width%3A%2010px%3B%0A%20%20%20%20border-style%3A%20solid%3B%0A%20%20%20%20border-radius%3A%2050%25%3B%0A%20%20%7D%0A%0A%20%20.smaller-image%20%7B%0A%20%20%20%20width%3A%20100px%3B%0A%20%20%7D%0A%3C%2Fstyle%3E%0A%0A%3Ch2%20class%3D%22red-text%22%3ECatPhotoApp%3C%2Fh2%3E%0A%0A%3Cp%3EClick%20here%20for%20%3Ca%20href%3D%22%23%22%3E%3Cimg%20src%3D%22http%3A%2F%2Fbit.ly%2Ffcc-running-cats%22%3Ecat%20photos%3C%2Fa%3E.%3C%2Fp%3E%0A%0A%3Cimg%20class%3D%22smaller-image%20thick-green-border%22%20src%3D%22https%3A%2F%2Fbit.ly%2Ffcc-relaxing-cat%22%3E%0A%0A%3Cp%20class%3D%22red-text%22%3EKitty%20ipsum%20dolor%20sit%20amet%2C%20shed%20everywhere%20shed%20everywhere%20stretching%20attack%20your%20ankles%20chase%20the%20red%20dot%2C%20hairball%20run%20catnip%20eat%20the%20grass%20sniff.%3C%2Fp%3E%0A%3Cp%20class%3D%22red-text%22%3EPurr%20jump%20eat%20the%20grass%20rip%20the%20couch%20scratched%20sunbathe%2C%20shed%20everywhere%20rip%20the%20couch%20sleep%20in%20the%20sink%20fluffy%20fur%20catnip%20scratched.%3C%2Fp%3E%0A
Limpuls
@Limpuls
Mar 12 2016 09:30
@Tmore23 You need to nest your html code in container-fluid div.
Tmore23
@Tmore23
Mar 12 2016 09:45
@Limpuls like all of it from top to bottom?
Limpuls
@Limpuls
Mar 12 2016 09:47
@Tmore23 Right after your </style> closing tag, so yeah.
Srinivasan
@kksrini89
Mar 12 2016 09:51
anyone worked on Kendo UI?
I am getting struggle in kendo chart
anyone help me on this?
El Jei Tulio Del Rio
@ElJei03
Mar 12 2016 09:57
Hello
myrepo1010
@myrepo1010
Mar 12 2016 09:59
Hello, does anybody know how to work with D3 x-axis? I'm trying to complete the Bar Chart Data Visualization, but I cannot find the way to make the ticks of the x-axis perfectly aligned with the blue rects representing the data (see 2015)
Mentor
@bestorw01
Mar 12 2016 10:34
This message was deleted
<script>
  $(document).ready(function() {
    $("#target1").css("color", "red");
    $("#target1").prop("disabled", true);
    $("#target4").remove();
    $("#target2").appendTo("#right-well");
    $("#target5").clone().appendTo("#left-well");
    $("#left-well").parent("#target1").css("background-color", "red");
  });
</script>
am stuck guys i need help please
Sriram Pasagadi
@pasagadisriram
Mar 12 2016 10:41
@bestorw01 provide challenge link and explain about your problem
Mentor
@bestorw01
Mar 12 2016 10:43
http://www.freecodecamp.com/challenges/target-the-parent-of-an-element-using-jquery#?solution=fccss%0A%20%20%24(document).ready(function()%20%7B%0A%20%20%20%20%24(%22%23target1%22).css(%22color%22%2C%20%22red%22)%3B%0A%20%20%20%20%24(%22%23target1%22).prop(%22disabled%22%2C%20true)%3B%0A%20%20%20%20%24(%22%23target4%22).remove()%3B%0A%20%20%20%20%24(%22%23target2%22).appendTo(%22%23right-well%22)%3B%0A%20%20%20%20%24(%22%23target5%22).clone().appendTo(%22%23left-well%22)%3B%0A%20%20%20%20%24(%22%23left-well%22).parent(%22%23target1%22).css(%22background-color%22%2C%20%22red%22)%3B%0A%20%20%7D)%3B%0Afcces%0A%0A%3C!--%20Only%20change%20code%20above%20this%20line.%20--%3E%0A%0A%3Cbody%3E%0A%20%20%3Cdiv%20class%3D%22container-fluid%22%3E%0A%20%20%20%20%3Ch3%20class%3D%22text-primary%20text-center%22%3EjQuery%20Playground%3C%2Fh3%3E%0A%20%20%20%20%3Cdiv%20class%3D%22row%22%3E%0A%20%20%20%20%20%20%3Cdiv%20class%3D%22col-xs-6%22%3E%0A%20%20%20%20%20%20%20%20%3Ch4%3E%23left-well%3C%2Fh4%3E%0A%20%20%20%20%20%20%20%20%3Cdiv%20class%3D%22well%22%20id%3D%22left-well%22%3E%0A%20%20%20%20%20%20%20%20%20%20%3Cbutton%20class%3D%22btn%20btn-default%20target%22%20id%3D%22target1%22%3E%23target1%3C%2Fbutton%3E%0A%20%20%20%20%20%20%20%20%20%20%3Cbutton%20class%3D%22btn%20btn-default%20target%22%20id%3D%22target2%22%3E%23target2%3C%2Fbutton%3E%0A%20%20%20%20%20%20%20%20%20%20%3Cbutton%20class%3D%22btn%20btn-default%20target%22%20id%3D%22target3%22%3E%23target3%3C%2Fbutton%3E%0A%20%20%20%20%20%20%20%20%3C%2Fdiv%3E%0A%20%20%20%20%20%20%3C%2Fdiv%3E%0A%20%20%20%20%20%20%3Cdiv%20class%3D%22col-xs-6%22%3E%0A%20%20%20%20%20%20%20%20%3Ch4%3E%23right-well%3C%2Fh4%3E%0A%20%20%20%20%20%20%20%20%3Cdiv%20class%3D%22well%22%20id%3D%22right-well%22%3E%0A%20%20%20%20%20%20%20%20%20%20%3Cbutton%20class%3D%22btn%20btn-default%20target%22%20id%3D%22target4%22%3E%23target4%3C%2Fbutton%3E%0A%20%20%20%20%20%20%20%20%20%20%3Cbutton%20class%3D%22btn%20btn-default%20target%22%20id%3D%22target5%22%3E%23target5%3C%2Fbutton%3E%0A%20%20%20%20%20%20%20%20%20%20%3Cbutton%20class%3D%22btn%20btn-default%20target%22%20id%3D%22target6%22%3E%23target6%3C%2Fbutton%3E%0A%20%20%20%20%20%20%20%20%3C%2Fdiv%3E%0A%20%20%20%20%20%20%3C%2Fdiv%3E%0A%20%20%20%20%3C%2Fdiv%3E%0A%20%20%3C%2Fdiv%3E%0A%3C%2Fbody%3E%0A
@pasagadisriram Target the Parent of an Element Using jQuery
Sriram Pasagadi
@pasagadisriram
Mar 12 2016 10:49
@bestorw01 check your last line of script..I think parent function should not have any input..
@bestorw01 In the example they are chaging parent of left-well.. likewise you need to apply same for parent of target1
@bestorw01 $("#target1").parent().css("background-color", "red")
Mentor
@bestorw01
Mar 12 2016 11:03
@pasagadisriram Thanks it worked
CamperBot
@camperbot
Mar 12 2016 11:03
bestorw01 sends brownie points to @pasagadisriram :sparkles: :thumbsup: :sparkles:
:star: 132 | @pasagadisriram | http://www.freecodecamp.com/pasagadisriram
Raúl Vázquez
@raulvazquez
Mar 12 2016 11:08
I don't know that I have to do in the step "Target the Parent of an Element Using jQuery"
somebody can help me?
cannelflow
@cannelflow
Mar 12 2016 11:10

@raulvazquez Every HTML element has a parent element from which it inherits properties.

For example, your jQuery Playground h3 element has the parent element of <div class="container-fluid">, which itself has the parent body.

jQuery has a function called parent() that allows you to access the parent of whichever element you've selected.

Here's an example of how you would use the parent() function if you wanted to give the parent element of the left-well element a background color of blue:

$("#left-well").parent().css("background-color", "blue")

Raúl Vázquez
@raulvazquez
Mar 12 2016 11:12
@cannelflow I know read, but I don't understand, because I put this in the code but don't check
$("#left-well").parent().css("background-color", "red");
Sriram Pasagadi
@pasagadisriram
Mar 12 2016 11:13
@raulvazquez this is for example they given..it changes parent of left-well ..but not parent of target1
cannelflow
@cannelflow
Mar 12 2016 11:14
@raulvazquez instruction is Give the parent of the #target1 element a background-color of red. #target1 not #left-well
Raúl Vázquez
@raulvazquez
Mar 12 2016 11:15
@cannelflow thanks!
CamperBot
@camperbot
Mar 12 2016 11:15
raulvazquez sends brownie points to @cannelflow :sparkles: :thumbsup: :sparkles:
:star: 896 | @cannelflow | http://www.freecodecamp.com/cannelflow
Raúl Vázquez
@raulvazquez
Mar 12 2016 11:15
@pasagadisriram thanks!
CamperBot
@camperbot
Mar 12 2016 11:15
raulvazquez sends brownie points to @pasagadisriram :sparkles: :thumbsup: :sparkles:
:star: 133 | @pasagadisriram | http://www.freecodecamp.com/pasagadisriram
Michael Nazari
@mikenaza
Mar 12 2016 11:25
Can anyone direct me to a article that describes recursion simply?
Eugene Bredyuk
@eugene-bredyuk
Mar 12 2016 11:27
@mikenaza what about - https://en.wikipedia.org/wiki/Recursion ?
Michael Nazari
@mikenaza
Mar 12 2016 11:28
Yea wiki is a good place to start, but I'm looking for an article writteen
Coy Sanders
@coymeetsworld
Mar 12 2016 11:28
what are you having trouble with specifically @mikenaza ? maybe that would help
Michael Nazari
@mikenaza
Mar 12 2016 11:28
written in a more simple manner
possible using metaphor
Coy Sanders
@coymeetsworld
Mar 12 2016 11:28
recursion in functions is basically a function that calls itself
maybe look up a factorial example, thats the easiest one i can think of
Michael Nazari
@mikenaza
Mar 12 2016 11:29
Actually I think I understand it well, I'm just wondering if anyone has a source that really made it clear to them
Yea I've seen the factorial example which is good
I'm just trying to get a solid understanding
It seems recursion could be used in place of a for loop? Like for counting up or down?
Alexander Køpke
@alexanderkopke
Mar 12 2016 11:32
unsigned int factorial(unsigned int n) {
    if (n == 0) {
        return 1;
    } else {
        return n * factorial(n - 1);
    }
}
Coy Sanders
@coymeetsworld
Mar 12 2016 11:32
not really, recursion and iteration are two separate things
recursion can be used to simplify some things you would normally do w/ iterating (i.e. less code)
Ashraful Islam
@iashraful
Mar 12 2016 11:34
beware the stackoverflow :D
recursion can go all weird on you if you miss terminate condition :D
Coy Sanders
@coymeetsworld
Mar 12 2016 11:35
yeah recursion will have higher overhead too normally since you're making more function calls
but you can simplify the code and in some cases it may be more ideal to run
Ashraful Islam
@iashraful
Mar 12 2016 11:37
^
Michael Nazari
@mikenaza
Mar 12 2016 11:38
Ahh okay, I thought maybe less code meant less memory load
Ashraful Islam
@iashraful
Mar 12 2016 11:43
@mikenaza dont' go for premature optimization
thats a learning killer :D
and birthplace of bad buggy codes
Michael Nazari
@mikenaza
Mar 12 2016 11:43
Yea I just need to focus on accomplishing the task
function factorialize(num) {
  var factorized = 1;
  for (var i = 1; i <= num; i++) {
    factorized *= i; 
  }
  return factorized;
}

factorialize(5);
That's how I originally solved factoralize
Coy Sanders
@coymeetsworld
Mar 12 2016 11:47
yeah that's fine @mikenaza
Ashraful Islam
@iashraful
Mar 12 2016 11:47
good code
Coy Sanders
@coymeetsworld
Mar 12 2016 11:48
but the idea is for something like this the additional overhead of calling the function within the function is insignificant
so if you could simplify the code by a few lines that would be preferable
thats a more advanced topic, something honestly i haven't thought about in a long time lol
but in most cases i think performance wise is fairly trivial w/ how fast computers are
Michael Aubrey
@mca62511
Mar 12 2016 11:51

http://codepen.io/mca62511/pen/4a3938884a5497924b76f97cd5eec1f0

Any one have any idea why nothing is happening when I click on the clear buttons?

$(".clear").click(function() {
    console.log("test");
  });
<span class='clear'><i class='material-icons'>clear</i></span>
Ashraful Islam
@iashraful
Mar 12 2016 12:01
@mca62511 it works for me
Michael Aubrey
@mca62511
Mar 12 2016 12:02
really? when you click it, it logs "test" in the console?
it does nothing for me
Ashraful Islam
@iashraful
Mar 12 2016 12:02
yes it does log 'test' in console
Coy Sanders
@coymeetsworld
Mar 12 2016 12:03
i dont see that
Ashraful Islam
@iashraful
Mar 12 2016 12:03
here you go
blob
I get this
Coy Sanders
@coymeetsworld
Mar 12 2016 12:03
what are you clicking on? the x?
Michael Aubrey
@mca62511
Mar 12 2016 12:04
the X
Coy Sanders
@coymeetsworld
Mar 12 2016 12:04
no i was talking to @iashraful
Michael Aubrey
@mca62511
Mar 12 2016 12:04
oh
Coy Sanders
@coymeetsworld
Mar 12 2016 12:04
yeah thats your example but waht about mcas?
i click on the x and i don't get that console msg
Ashraful Islam
@iashraful
Mar 12 2016 12:05
ah, it doesn't work for me either
let me do some magic first
nope, nothing happening
I think it could be DOM problem
Coy Sanders
@coymeetsworld
Mar 12 2016 12:08
probably, i don't know what to target though
i am just starting twitch though
Michael Aubrey
@mca62511
Mar 12 2016 12:08
is it because it was created with jquery? Should that really matter?
Ashraful Islam
@iashraful
Mar 12 2016 12:10
@mca62511 I ran a js analysis and it's all red
for starter don't use == always === or !==
and its not working but no of errors reduced
nah, not working
@mca62511 I generated 10 li using jquery and appended 'em to a ul
Ashraful Islam
@iashraful
Mar 12 2016 12:15
then assigned click event to all li to log 'hello' on console
its working
not sure why your one isn't working
:worried:
Coy Sanders
@coymeetsworld
Mar 12 2016 12:17
dont think its a jquery thing
Ashraful Islam
@iashraful
Mar 12 2016 12:18
yes, may be somewhere something is broken
Michael Aubrey
@mca62511
Mar 12 2016 12:18
I just ran it through JSLint and it said an error "undeclared console" on line 104 where I call it for the clear button
which is weird
i think
actually i don't understand JSLint too well
Ah, JSLint just says that because in production you don't want to be sending things to the console
so nevermind
Somehow the selector just isn't working
Ashraful Islam
@iashraful
Mar 12 2016 12:22
but console should work anyhow
the selector is actually working
when I select material-icons class, it gives me lots of test logs when I press any button with icons, like search, add another streamer etc
Michael Aubrey
@mca62511
Mar 12 2016 12:24
  $(".clear").css({
    "background": "red"
  })
This doesn't change the color of the spans red
Coy Sanders
@coymeetsworld
Mar 12 2016 12:26
theres some syntax problems there
should be background-color assuming you want to change the background color and not the text
should probably be a semicolon at the end of the line too
Ashraful Islam
@iashraful
Mar 12 2016 12:28
this is strange
when I fire $('.clear') in console, it returns nothing
so technically jquery is not finding anything with a class clear
Michael Aubrey
@mca62511
Mar 12 2016 12:29
@coymeetsworld adding a semicolon breaks it. It is an object in javascript, so it is expressed,
{ "property-name": "value", "property-name2": "value" }
@coymeetsworld And there's nothing wrong with using background. It is a perfectly acceptable shortcut for all the background properties
@iashraful After googling some, it looks like there's different rules for selecting dynamically created elements
Ashraful Islam
@iashraful
Mar 12 2016 12:31
oh?
please link me to this article, always excited to learn new things
but for me , this worked
Coy Sanders
@coymeetsworld
Mar 12 2016 12:32
i meant at the end of the jQuery statement @mca62511
$(".clear").css({ 
  "background": "red"
});
Michael Aubrey
@mca62511
Mar 12 2016 12:32
ah
then yeah
Ashraful Islam
@iashraful
Mar 12 2016 12:32
here check this https://jsfiddle.net/d88w1otw/
I generated some li and then they work nicely
Michael Aubrey
@mca62511
Mar 12 2016 12:32
Hmm
Coy Sanders
@coymeetsworld
Mar 12 2016 12:33
but yeah i think you're right about the background selector
i just typically use background-color when specifying a color
Michael Aubrey
@mca62511
Mar 12 2016 12:39
this works
  $('.content').on('click', '.clear', function(){
    console.log("test");
  });
Ashraful Islam
@iashraful
Mar 12 2016 12:39
yes
I noticed
nice I learned something new today :D
thanks @mca62511
CamperBot
@camperbot
Mar 12 2016 12:40
iashraful sends brownie points to @mca62511 :sparkles: :thumbsup: :sparkles:
:star: 372 | @mca62511 | http://www.freecodecamp.com/mca62511
Michael Aubrey
@mca62511
Mar 12 2016 12:40
lol
@iashraful Thank you too
CamperBot
@camperbot
Mar 12 2016 12:40
mca62511 sends brownie points to @iashraful :sparkles: :thumbsup: :sparkles:
:star: 500 | @iashraful | http://www.freecodecamp.com/iashraful
Michael Aubrey
@mca62511
Mar 12 2016 12:40
and @coymeetsworld thank you to you too
CamperBot
@camperbot
Mar 12 2016 12:40
mca62511 sends brownie points to @coymeetsworld :sparkles: :thumbsup: :sparkles:
:star: 337 | @coymeetsworld | http://www.freecodecamp.com/coymeetsworld
Coy Sanders
@coymeetsworld
Mar 12 2016 12:41
interesting
gj finding it @mca62511
not sure why that works but i guess ill find out soon enough :)
Michael Aubrey
@mca62511
Mar 12 2016 12:49
ugh, i think I'm going to have to come up with a more thorough solution, as i want to do a lot more things with these elements
I want to get the text inside the ".name" span within the same parent as the ".click" span
but something like, $(this).siblings(".name").text() isn't working
Ro991
@Ro991
Mar 12 2016 13:06
I can't embed an image on my html page, is this correct?
<img scr="http://s.hswstatic.com/gif/whiskers-sam.jpg">
ajaybti
@ajaybti
Mar 12 2016 13:07
how i can use multiple class in img element ?
Michael Aubrey
@mca62511
Mar 12 2016 13:11
<img class="class-one class-two" >
should be src
Haroon Ghawsi
@HaroonGhawsi
Mar 12 2016 13:12

Hi, I am trying to get the JSON data from http://quotes.rest/qod.json but I am not able to get it. This is my code
$(document).ready(function(){
$("#change").on("click", function(){
//alert("clicked");
$.getJSON("http://quotes.rest/qod.json", function(json){

      $("#input").html(json);
    });
});

});

$(document).ready(function(){
    $("#change").on("click", function(){
        //alert("clicked");
        $.getJSON("http://quotes.rest/qod.json", function(json){

          $("#input").html(json);
        });
    });
});
Rowan
@Rowan102
Mar 12 2016 13:25
hello guys, I don't remember how do I add a CSS class in <style>
Michael Aubrey
@mca62511
Mar 12 2016 13:25
YAY! It is working. It isn't ideal but it is working
   $('.content').on('click', '.clear', function(){
        myUsers.splice(myUsers.indexOf($(this).siblings("a").text().toLowerCase()),1);
    populateList();
  });
Tej Pratap
@tejscript
Mar 12 2016 13:26
@Rowan102 <style>
.classname {
properties ;
}</style>
ajaybti
@ajaybti
Mar 12 2016 13:31
@mca62511 thanx
CamperBot
@camperbot
Mar 12 2016 13:31
ajaybti sends brownie points to @mca62511 :sparkles: :thumbsup: :sparkles:
:star: 373 | @mca62511 | http://www.freecodecamp.com/mca62511
Alexander Køpke
@alexanderkopke
Mar 12 2016 13:38
althou classname is not a very good class name.. they should be more descriptive, imo
rmkoske
@rmkoske
Mar 12 2016 13:38
Hi! Does anyone know if it is possible to fork your own work in Codepen? I clicked the button, but it doesn't look like anything happened.
Alexander Køpke
@alexanderkopke
Mar 12 2016 13:38
@rmkoske yes you should be able to
@rmkoske I just tried it with one of my projects and it works. You should be able to do it as well
rmkoske
@rmkoske
Mar 12 2016 13:40
I must be not seeing something then. The page reloads when I click, but I can't see anything that distinguishes it from the old version, nor anything that is like "and here's how to get back to the old branch".
How can you tell that it happened @alexanderkopke ?
Alexander Køpke
@alexanderkopke
Mar 12 2016 13:42
@rmkoske look up in the left corner there is a file code eJgLWn or something similar.. if you fork that code changes.. but you can also click your name and see all your projects and it should be listed
rmkoske
@rmkoske
Mar 12 2016 13:43
I saw that the code changed, but when I look at my projects I think I'm only seeing one version of the one I'm forking.
Alexander Køpke
@alexanderkopke
Mar 12 2016 13:43
@rmkoske a fork will copy the current project so you can't see any difference in the fork itself
mudi thareja
@tharejamudit
Mar 12 2016 13:43
stuck here
Return Early Pattern for Functions
pls help?
Alexander Køpke
@alexanderkopke
Mar 12 2016 13:43
@tharejamudit post your code
rmkoske
@rmkoske
Mar 12 2016 13:43
@alexanderkopke - I did make a change and save it, so theoretically one fork is different from the other, but I only see one in my profile.
Alexander Køpke
@alexanderkopke
Mar 12 2016 13:44
@rmkoske ok I see two wrong way corrigans
rmkoske
@rmkoske
Mar 12 2016 13:45
That's the one. So then the question is why I don't see both.
Oh, wait - I thought the big version was a showcase and then everything else was listed small underneath, so it repeated itself. But if that's not how it works, then I see two also. Yeesh, if it had been a snake, it would have bit me.
I figured I was overlooking an obvious thing.
cannelflow
@cannelflow
Mar 12 2016 13:47
@tharejamudit tried something
?
rmkoske
@rmkoske
Mar 12 2016 13:47
@alexanderkopke Thanks! It would have taken me forever to work out without you.
CamperBot
@camperbot
Mar 12 2016 13:47
rmkoske sends brownie points to @alexanderkopke :sparkles: :thumbsup: :sparkles:
:star: 503 | @alexanderkopke | http://www.freecodecamp.com/alexanderkopke
mudi thareja
@tharejamudit
Mar 12 2016 13:47

// Setup
function abTest(a, b) {
// Only change code below this line
if (a<0 || b<0){
return "undefined";
}

// Only change code above this line

return Math.round(Math.pow(Math.sqrt(a) + Math.sqrt(b), 2));
}

// Change values below to test your code
abTest(2,2);

Alexander Køpke
@alexanderkopke
Mar 12 2016 13:47
@rmkoske no worries. :)
mudi thareja
@tharejamudit
Mar 12 2016 13:48
``
cannelflow
@cannelflow
Mar 12 2016 13:48
@tharejamudit return undefined not"undefined"
Christopher Byrd
@chrabyrd
Mar 12 2016 13:49

Hello all!

Does anyone know how to have a bootstrap panel start "active?"

I'm working on my profile page, and under the proficiencies tab there's an accordion panel. If you click either panel, the text will bold, but no matter what I try I doesn't start bold.

http://codepen.io/chrabyrd/details/pyjJJx/

I'd really appreciate if anyone could take a look. Thank you!

mudi thareja
@tharejamudit
Mar 12 2016 13:49
thx @cannelflow got it
CamperBot
@camperbot
Mar 12 2016 13:49
tharejamudit sends brownie points to @cannelflow :sparkles: :thumbsup: :sparkles:
:star: 897 | @cannelflow | http://www.freecodecamp.com/cannelflow
ChandraVaibhavSoni
@ChandraVaibhavSoni
Mar 12 2016 14:10
hi all
Federico Dente
@fez994
Mar 12 2016 14:11
@fez994
Hi guys, i'm working on my portfolio, can someone tell me how to create the "split" effect that you can see here? (http://blackrockdigital.github.io/startbootstrap-grayscale/)
I've setted the full page image, created the navbar but i can't figure out how to "split" the page in differente parts, i've tried using divs but it didn't work
David Young
@dayvidwhy
Mar 12 2016 14:14
what classes did you give those divs?
the page you linked seems to use content-section?
then those links have the #page-scroll just sending it down to a section tagged with some id
Federico Dente
@fez994
Mar 12 2016 14:16
@deedubwhy http://imgur.com/cmd10KR That's my code by far (Plus the css)
TedCode0
@TedCode0
Mar 12 2016 14:16
hey guys, can you check out my code please:) replies are appreciated http://codepen.io/TedCode0/pen/ONRPWa
David Young
@dayvidwhy
Mar 12 2016 14:17
do you have a codepen
TedCode0
@TedCode0
Mar 12 2016 14:17
open the url in another tab if you cant run it
David Young
@dayvidwhy
Mar 12 2016 14:17
@fez994 that image isnt anything do you have a codepen
rmkoske
@rmkoske
Mar 12 2016 14:18
@TedCode0 - that is pretty awesome!
Federico Dente
@fez994
Mar 12 2016 14:18

I don't have the code pen here is the html
<!DOCTYPE html>

<head>

<title> Dente Federico | Portfolio </title>
<link rel="stylesheet" type="text/css" href="style.css" </head>

<body>

<div id="page">
<div id="header-page">
<div class="container">

<!-- Navbar -->
<div id="nav">
<ul>
<li>Home</li>
<li>Projects</li>
<li>Contacts</li>
</ul>


</div>
</div>
</div>

<div id="banner">
<h2> Dente Federico | Portfolio </h2>
<h3>Scroll Down for more </h3>
</div>

</div>

rmkoske
@rmkoske
Mar 12 2016 14:18
I don't know JS yet, so I can only comment as a user - "Cool!" Hee.
shubham7858
@shubham7858
Mar 12 2016 14:18
how to Add a div element with the class well inside each of your div elements with the class "col-xs-6"???
Federico Dente
@fez994
Mar 12 2016 14:19
@deedubwhy
David Young
@dayvidwhy
Mar 12 2016 14:19
@fez994 so you want it to scroll in sections
@fez994 you realise thats bootstrap doing that right
Federico Dente
@fez994
Mar 12 2016 14:19
@deedubwhy Exactly, but i've loaded a full page image background
Any tutorial that i can follow?
TedCode0
@TedCode0
Mar 12 2016 14:20
@rmkoske thanks!! leave a like (heart) on codepen please, i want other people to see it too :D
CamperBot
@camperbot
Mar 12 2016 14:20
tedcode0 sends brownie points to @rmkoske :sparkles: :thumbsup: :sparkles:
:star: 136 | @rmkoske | http://www.freecodecamp.com/rmkoske
David Young
@dayvidwhy
Mar 12 2016 14:20
@fez994 if you inspect that page you linked with the grayscale theme it shows the stylesheets you need to include
didnt you already have to do the bootstrap part of fcc
Trilok reddy
@Trilokreddy007
Mar 12 2016 14:23
can anyone tell me how to Nest all of your radio buttons inside one div with the class row.
in challenge 83?
David Young
@dayvidwhy
Mar 12 2016 14:23
Wrap those divs, place them inside, one whole div
Federico Dente
@fez994
Mar 12 2016 14:24
@deedubwhy Yeah i've done that, but still i don't know how to do it
I've installed bootstrap on the website, but still this is the result: http://i.imgur.com/TMHP74y.jpg i want the "about me" section moved down
David Young
@dayvidwhy
Mar 12 2016 14:26
the page-scroll class?
as far as pushing it down you can give it some margins or just add some empty rows above it
Federico Dente
@fez994
Mar 12 2016 14:28
@deedubwhy What kind of margins should i give it? I just want to push the About me section down
HTML:
<div class="row">
<h2> About me </h2>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam consequat neque sit amet semper sodales. Etiam aliquet rhoncus ligula ac varius. Vestibulum vitae dictum lectus, nec luctus nunc. Proin at enim tempus, tincidunt justo eu, pretium dolor. Donec aliquam ut sem at vestibulum. Praesent placerat mauris eget urna egestas, at auctor velit gravida. Sed tempus vel purus sed hendrerit. Aenean sollicitudin ipsum ac condimentum dignissim.</p>

</div>
David Young
@dayvidwhy
Mar 12 2016 14:29
you've been shown how to push things around, just test and see what you need. i like using the chrome tools to adjust css in real time
Trilok reddy
@Trilokreddy007
Mar 12 2016 14:30
@deedubwhy can be more brief
can u be more brief ?
David Young
@dayvidwhy
Mar 12 2016 14:31
You've made some divs already with open and close tags. Just put the open tag before your buttons, then the close tag after them
Federico Dente
@fez994
Mar 12 2016 14:35
Can you link a tutorial on how to just push that About me section down?
Gagandeep Singh
@Guggu
Mar 12 2016 14:40
@fez994 u can use exclusive div element with your about paragraph, so that will treat like a footer one
Haroon Ghawsi
@HaroonGhawsi
Mar 12 2016 14:41
Hi guys, Can anyone help me, How to get the JSON data for Random Quote API. My code is below, I am not able to get the data from the API
$(document).ready(function(){
    $("#change").on("click", function(){
        //alert("clicked");
        var data = $.getJSON("http://quotes.rest/qod.json", function(json){

          document.getElementById("input").innerHTML = data;
        });
    });
});
This is my HTML code.
<body>
        <form class="form">
            <div id="input"></div>
            <div id="prop">
            <img id="tw" src="images/tw.png" />
            <input id="change" type="submit" value="Change" align="middle"/>
                </div>
        </form>
    </body>
Thomas Honeyman
@thomashoneyman
Mar 12 2016 14:44
@HaroonGhawsi Try adding ?callback=
to the URL
Haroon Ghawsi
@HaroonGhawsi
Mar 12 2016 14:45
ok
Thomas Honeyman
@thomashoneyman
Mar 12 2016 14:47
Because you’re accessing a resource off your domain, you’ve got to be using JSONP; to use JSONP, you include callback in the API URL
Does that work for you?
Oops sorry — should be ?callback=?
ajaybti
@ajaybti
Mar 12 2016 14:50
This message was deleted
<p>Click here for <a # ="http://www.freecatphotoapp.com">cat photos</a>.</p> can any one tell me where is my mistake in this html code as it is not running...here i replaced href with # symbol.
Tej Pratap
@tejscript
Mar 12 2016 14:53
@ajaybti <p>Click here for <a href="#">cat photos</a>.</p>
Alon Bukai
@Alonski
Mar 12 2016 14:56
Hey, I was wondering how I would go about learning to pull info from a webpage. I specifially want to pull info from a dropdown list.
ajaybti
@ajaybti
Mar 12 2016 14:59
@tejscript thnx tejscript
CamperBot
@camperbot
Mar 12 2016 14:59
ajaybti sends brownie points to @tejscript :sparkles: :thumbsup: :sparkles:
:star: 84 | @tejscript | http://www.freecodecamp.com/tejscript
Karan Joisher
@karanjoisher
Mar 12 2016 15:22
net.createServer(socket){}
here socket is a client socket or server socket?
kanak ranjan
@kanak69
Mar 12 2016 15:23
@karanjoisher its a server socket
Karan Joisher
@karanjoisher
Mar 12 2016 15:24
@kanak69 so wt abt the client socket?
we need it to send data right?
kanak ranjan
@kanak69
Mar 12 2016 15:26
Inside create server function we are passing parameter that is socket and as we are passing it. We need to pass server socket than only we can establish relation
Nigel
@nigeljoy
Mar 12 2016 15:30
Do you guys know any free tool to showcase rendered web page design?
mjqblade
@mjqblade
Mar 12 2016 15:35
hey guys
<div class="container-fluid">
  <h3 class="text-primary text-center">jQuery Playground</h3>
  <div class="row">
    <div class="col-xs-6">

    </div>
    <div class="col-xs-6">

    </div>
  </div>
</div>
it says Add a div element with the class well inside each of your div elements with the class "col-xs-6" sny hrlp
any help plz
shubham7858
@shubham7858
Mar 12 2016 15:36
how to Use the jQuery addClass() function to give the classes animated and bounce to your button elements.??
mjqblade
@mjqblade
Mar 12 2016 15:36
what
rmkoske
@rmkoske
Mar 12 2016 15:36
@mjqblade Inside the existing elements that have the class col-xs-6, you're adding more divs with the class &quo