These are chat archives for FreeCodeCamp/HelpFrontEnd

29th
Jan 2017
ZenZate
@ZenZate
Jan 29 2017 00:01
Thanks @alan-redding
CamperBot
@camperbot
Jan 29 2017 00:01
zenzate sends brownie points to @alan-redding :sparkles: :thumbsup: :sparkles:
:cookie: 253 | @alan-redding |http://www.freecodecamp.com/alan-redding
alan-redding
@alan-redding
Jan 29 2017 00:01
No problem, good luck with the challenge!
Tyler Moeller
@TylerMoeller
Jan 29 2017 00:03
@idallenbach You can use a margin to move your list further to the right, but you may want to use CSS Media Queries to help as the screen changes size. With bootstrap, you can use the grid system and use a column offset: http://getbootstrap.com/css/#grid-offsetting
Ian Dallenbach
@idallenbach
Jan 29 2017 00:06
thanks @TylerMoeller
CamperBot
@camperbot
Jan 29 2017 00:06
idallenbach sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1425 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Alicina Memar
@chocolatechimpcookie
Jan 29 2017 00:40
Hey folks got a question
Heres my codepen
I was using the browsers location with open weather
someone here told me I should try ipinfo.io instead for the location
I'm still having issues
Hello911
@Hello911
Jan 29 2017 00:44
var string=[["t","w","o"],["t","e","a"]];
console.log(string.length());
Computer says there is no such function as string.length(); why?
Moisés Man
@moigithub
Jan 29 2017 00:45
cuz length is a property not a function ...
remove the () @Hello911
Tyler Moeller
@TylerMoeller
Jan 29 2017 00:47
@chocolatechimpcookie If you call APIs over HTTP, your codepen's address also needs to begin with http. Open your codepen with this URL instead: http://codepen.io/chocolatechimpcookie/pen/dNZvNP
Alicina Memar
@chocolatechimpcookie
Jan 29 2017 00:47
its ALIVE
Hello911
@Hello911
Jan 29 2017 00:47
@moigithub What does that mean?Sorry I am just dumb
Alicina Memar
@chocolatechimpcookie
Jan 29 2017 00:47
thanks @TylerMoeller
CamperBot
@camperbot
Jan 29 2017 00:47
chocolatechimpcookie sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1426 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Alicina Memar
@chocolatechimpcookie
Jan 29 2017 00:48
You're not dumb hello
is that javascript?
you don't need the () after length
Hello911
@Hello911
Jan 29 2017 00:49
I GOT IT thanks
@moigithub
Alicina Memar
@chocolatechimpcookie
Jan 29 2017 00:49
Hello911
@Hello911
Jan 29 2017 00:49
That was a dumb question.
Alicina Memar
@chocolatechimpcookie
Jan 29 2017 00:50
I can see how someone can make that mistake
Hello911
@Hello911
Jan 29 2017 00:52
THanks @chocolatechimpcookie
CamperBot
@camperbot
Jan 29 2017 00:52
hello911 sends brownie points to @chocolatechimpcookie :sparkles: :thumbsup: :sparkles:
:cookie: 269 | @chocolatechimpcookie |http://www.freecodecamp.com/chocolatechimpcookie
Hello911
@Hello911
Jan 29 2017 00:52
forgot to tag you
Alicina Memar
@chocolatechimpcookie
Jan 29 2017 00:54
:)
Amit Patel
@AmitP88
Jan 29 2017 01:20

hey guys, I'm trying to setup my containers to create a dynamic menu for a restaurant website and I need a little help.
here are my container variables
menuContainer.png

what i'm trying to do in the picture is place the 3 variables indicated in red in the HTMLdishInfoContainer variable where %data% is. my question is, how do I replace the %data% in the HTMLdishInfoContainer variable with multple variables?

Tom
@moT01
Jan 29 2017 01:23
@AmitP88 could you make a single variable with all the data in it?
var x = <h1>data</h1><h2>data</h2>...
Amit Patel
@AmitP88
Jan 29 2017 01:24
@moT01 facepalm ugh, i'm so stupid lol
Tom
@moT01
Jan 29 2017 01:24
then put that in the .menu-info
ill take that as a yes
Amit Patel
@AmitP88
Jan 29 2017 01:25
@moT01 i'll give it a shot
@moT01 well actually i'll be using this JSON to supply the data: var menu = {
"dishes" : [
{
"name": "Beef Sticks",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/beef-sticks.jpg"],
"altText": "beef-sticks"
},
{
"name": "Stuffed Chicken",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/stuffed-chicken.jpg"],
"altText": "stuffed-chicken"
},
{
"name": "Lot Cha",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/lot-cha.jpg"],
"altText": "lot-cha"
},
{
"name": "Fried Chicken",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/fried-chicken.jpg"],
"altText": "fried-chicken"
},
{
"name": "Chicken Patty",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/chicken-patty.jpg"],
"altText": "chicken-patty"
},
{
"name": "Papaya Salad",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/papaya-salad.jpg"],
"altText": "papaya-salad"
},
{
"name": "Chow Mein",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/chow-mein.jpg"],
"altText": "chow-mein"
},
{
"name": "Eggrolls",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/eggrolls.jpg"],
"altText": "eggrolls"
},
{
"name": "Beef Pahlok",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/Beef-Pahlok.jpg"],
"altText": "Beef-Pahlok"
},
{
"name": "Fried Rice",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/fried-rice.jpg"],
"altText": "Fried-Rice"
},
{
"name": "Pho",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/pho.jpg"],
"altText": "pho"
},
{
"name": "Spring Rolls",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/spring-rolls.jpg"],
"altText": "spring-rolls"
},
{
"name": "Chicken/Beef Larb",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/chicken-beef-larb.jpg"],
"altText": "chicken-beef-larb"
},
{
"name": "khmer shaved ice",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/khmer-shaved-ice.jpg"],
"altText": "khmer-shaved-ice"
},
{
"name": "Shaved Ice Sundae",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/shaved-ice.jpg"],
"altText": "shaved-ice"
},
{
"name": "Boba",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/boba.jpg"],
"altText": "boba"
},
{
"name": "Thai Tea",
"price": "$5",
"description": "Description of what's in the dish and how it's cooked.",
"image": ["images/dishes/drinks.jpg"],
"altText": "drinks"
}
]
}
so I dont know if nesting the variables will work
Tom
@moT01
Jan 29 2017 01:26
thats some nice ms paint work, by the way
Amit Patel
@AmitP88
Jan 29 2017 01:27
@moT01 lol thx
CamperBot
@camperbot
Jan 29 2017 01:27
amitp88 sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 480 | @mot01 |http://www.freecodecamp.com/mot01
Tom
@moT01
Jan 29 2017 01:28
what about just putting all three variables in there
Amit Patel
@AmitP88
Jan 29 2017 01:29
@moT01 what do you mean?
btw this is what the finished menu will look like:
menuFinished.png
Tom
@moT01
Jan 29 2017 01:31
dishinfocontainer = '<div class="menu-info">" + variable, variable, variable + "</div>';
something like that, ...not sure if you need the commas
Amit Patel
@AmitP88
Jan 29 2017 01:33
@moT01 ah I see what you mean
i'll try it
so something like this right?
newmenuContainer.png
Tom
@moT01
Jan 29 2017 01:37
yea, something like that. not sure how you would want to separate them, i suppose the + should work i think
Amit Patel
@AmitP88
Jan 29 2017 01:37
@moT01 yeah I think so, i'm hoping that will work
Hello911
@Hello911
Jan 29 2017 01:39

function titleCase(str) {

  var string=str.split(" ");

  for(var i=0;i<string.length;i++){
   string[i].toLowerCase();

}

  return string;
}

titleCase("I'M A liTtle tEa pot");
Why is the function returning a array of words, unchanged from the string? How should I make the toLowerCase() method work?
The problem seems to be with the for loop.
Tom
@moT01
Jan 29 2017 01:40
i think you could do var string = str.toLowerCase();
Hello911
@Hello911
Jan 29 2017 01:41
I GOt it now thanks @moT01
CamperBot
@camperbot
Jan 29 2017 01:41
hello911 sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 481 | @mot01 |http://www.freecodecamp.com/mot01
Icah Banton
@remdata
Jan 29 2017 01:56
Hello. I need a little help with the Wikipedia viewer challenge. When you click on the search icon, how do you get a search form to display/run? This is what I have so far. Please let me know if I am heading the right direction? http://codepen.io/ibanton/pen/GrOBzR
Tom
@moT01
Jan 29 2017 02:00
@remdata need to do something with your form to get the input, ...set the input to a variable, plug that variable into your wikipedia url for your ajax call, ...then you will get the info with the users query
@remdata i would put all that css, for your transition thing into a different/unique css class and then add that class when its clicked
Lorrie Pearson
@Lorrie01
Jan 29 2017 02:04
@remdata you don't have any search term functions in your JS
Icah Banton
@remdata
Jan 29 2017 02:06
@moT01 . That helps to clarify things. I was not sure how to proceed. thanks.
CamperBot
@camperbot
Jan 29 2017 02:06
remdata sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 482 | @mot01 |http://www.freecodecamp.com/mot01
Tom
@moT01
Jan 29 2017 02:09
@remdata k good, im not sure when im giving advice if im helping or confusing, ...or even giving good advice some times
Lorrie Pearson
@Lorrie01
Jan 29 2017 02:10
@moT01 that was a great explanation to help @remdata it was easy to understand.
Tom
@moT01
Jan 29 2017 02:15
good
bitcoinabdi
@bitcoinabdi
Jan 29 2017 02:28
Afternoon guyz
please provide feed back
this is my project hanks
am not able to get a smooth scroll into the sections
Lorrie Pearson
@Lorrie01
Jan 29 2017 02:40
@bitcoinabdi looks like you need to adjust the spacing in your div's
rami90
@rami90
Jan 29 2017 02:42
Hi all, can anyone tell me why this web page is not mobile friendly http://www.rami.ae
On desktop its working well with full size
But on phone its smaller
Lorrie Pearson
@Lorrie01
Jan 29 2017 02:43
@bitcoinabdi do you know how to use flex-box?https://css-tricks.com/snippets/css/a-guide-to-flexbox/
@rami90 did you design it for your phone first, then adjust with media queries in css?
rami90
@rami90
Jan 29 2017 02:45
@Lorrie01 ok I will take a look on that, thanx alot
CamperBot
@camperbot
Jan 29 2017 02:45
rami90 sends brownie points to @lorrie01 :sparkles: :thumbsup: :sparkles:
:cookie: 309 | @lorrie01 |http://www.freecodecamp.com/lorrie01
Lorrie Pearson
@Lorrie01
Jan 29 2017 02:47
you're welcom @rami90
bitcoinabdi
@bitcoinabdi
Jan 29 2017 02:49
@Lorrie01 thanks for the feedback really appreciate it.
CamperBot
@camperbot
Jan 29 2017 02:49
bitcoinabdi sends brownie points to @lorrie01 :sparkles: :thumbsup: :sparkles:
:cookie: 310 | @lorrie01 |http://www.freecodecamp.com/lorrie01
bitcoinabdi
@bitcoinabdi
Jan 29 2017 02:50
@Lorrie01 how do i adjust the spacing please explain
input height and width of each div ?
Steven Failla
@Stevo99
Jan 29 2017 02:55
Can someone please look at this and explain to me why my background images arent the right size. i was having an issue with spacing/formatting my doc. just trying to figure out http://codepen.io/Stevo914/pen/egexZq?editors=1100#0
Lorrie Pearson
@Lorrie01
Jan 29 2017 02:57
@bitcoinabdi you can give each div a specific margin or padding and that can allow you to keep them from being on top of each other. this can also help https://css-tricks.com/almanac/properties/z/z-index/
Ayobami
@purpose50
Jan 29 2017 02:58

Hi guys i have been stuck with this please help, what is wrong with my code..the last test is not passing
Sum all the prime numbers up to and including the provided number.

A prime number is defined as a number greater than one and having only two divisors, one and itself. For example, 2 is a prime number because it's only divisible by one and two.

The provided number may not be a prime.

sumPrimes(10) should return a number.
sumPrimes(10) should return 17.
sumPrimes(977) should return 73156.

function sumPrimes(num) {
  var prime = [];
  for(i = 2; i <= num; i++) {
    if(i == 2 || i == 3 || i == 5 || i == 7) {
      prime.push(i);
    }else {
        if(i % 2 === 0 || i % 3 === 0 || i % 4 === 0 || i % 5 === 0 || i % 7 === 0) {
          continue;
        }else {
          prime.push(i);
        }

    }//end else
  }//end for
  num = prime.reduce(function(prev, curr) {
    return prev + curr;
  }, 0); 

  return num;
}

sumPrimes(977);
Tom
@moT01
Jan 29 2017 02:59
@Stevo99 what is the "right" size?
Lorrie Pearson
@Lorrie01
Jan 29 2017 03:00
@Stevo99 you have all of your background images set to cover, they seem to be overlapping try this resource https://css-tricks.com/almanac/properties/b/background-image/
Tom
@moT01
Jan 29 2017 03:01
@purpose50 i think you are going about it the wrong way
you are testing if it is divisible by 3 4 5...
prime means only divisible by 1 and itself
Ayobami
@purpose50
Jan 29 2017 03:03
@moT01 okay, what do you suggest
Tom
@moT01
Jan 29 2017 03:04
well, im not sure
you could test each number between 2 and 1 less than the number and see if any of them come to 0
This message was deleted
Steven Failla
@Stevo99
Jan 29 2017 03:06
@Lorrie01 thanks lorie let me look over the info. i used margin and padding to adjust before but it still caused irregular spacing so I tried to strip it down to something plain and simple
CamperBot
@camperbot
Jan 29 2017 03:06
stevo99 sends brownie points to @lorrie01 :sparkles: :thumbsup: :sparkles:
:cookie: 311 | @lorrie01 |http://www.freecodecamp.com/lorrie01
Tom
@moT01
Jan 29 2017 03:08
@purpose50 does that make any sense?
Steven Failla
@Stevo99
Jan 29 2017 03:09
@moT01 I mean the correct size so it looks like the image that i found on the web. it seems way too close
Chiu Yong
@chiuyong
Jan 29 2017 03:16
hello
can someone help me?
Lorrie Pearson
@Lorrie01
Jan 29 2017 03:17
what do you need @chiuyong
Tom
@moT01
Jan 29 2017 03:17
@chiuyong whats up
@Stevo99 close? zoomed in?
Chiu Yong
@chiuyong
Jan 29 2017 03:23
@Lorrie01 @moT01 Please, how can I fix the login at the right of the navbar and leave the other links before login near the center of the navbar, without breaking the link/login in the collapse .
? *
Rennie Bevineau
@Renniesb
Jan 29 2017 03:30
It is about polymer
Ken Haduch
@khaduch
Jan 29 2017 03:56
@Renniesb - I don't know anything about polymer, but it looks like someone in the stackoverflow item posted an answer...
KerryW1
@KerryW1
Jan 29 2017 04:19
Hey all, I'm on the "Build a Personal Portfolio" challenge and am stumped on how to create a collapse-able menu bar as the example shows?
This is what I have so far: <header class="navbar navbar-default navbar-fixed-top" id="banner">
<div class="container"><a class="scrollable" href="#top"><img src="http://picresize.com/images/rsz_588d693126700.png" alt="Aspiring Developer" title="Aspiring Developer"/></a>
<button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target="#navbar" aria-expanded="false"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></cpan></button>
<nav class="collapse navbar-collapse" id="navbar" role="navigation">
<ul class="nav navbar-nav navbar-right">
<li><a class="scrollable" href="#top">About</a></li>
<li><a class="scrollable" href="#portfolio">Portfolio</a></li>
<li><a class="scrollable" href="#contact">Contact</a></li>
</ul>
</nav>
</div>
</header>
Tony
@FreakishLancer
Jan 29 2017 05:13

A little simple, but here is my Random Quote Machine if anybody wants to comment on it! Audio does not work on Safari though because of the .ogg audio from the Wikia.

http://codepen.io/Freaklancer/pen/VPrgVy

Chris Wingler
@chriswingler
Jan 29 2017 05:22
my twitchtv code right now
if (a bunch of crap === true) {
do a bunch of crap
} else {
do lots of this other crap
}
playingwithinfinity
@playingwithinfinity
Jan 29 2017 05:24
Hey guys! I'm trying to build a calculator, but I'm having trouble with button positioning? Is there anything I can learn to help me position them correctly?
http://codepen.io/jimpix/pen/zNNBZr
Albert Ventura
@venturads
Jan 29 2017 05:34

@KerryW1 body {
padding-top:70px;
}

.navbar-header {
float: none;
}
.navbar-toggle {
display: block;
}
.navbar-collapse.collapse {
display: none!important;
}
.navbar-nav {
float: none!important;
}
.navbar-nav>li {
float: none;
}
.navbar-collapse.collapse.in{
display:block !important;
}

playingwithinfinity
@playingwithinfinity
Jan 29 2017 06:10
Why don't my table elements have spaces between them unlike MDN's tutorial?https://developer.mozilla.org/en/docs/Web/HTML/Element/table
http://codepen.io/jimpix/pen/zNNBZr
Christian
@Neralizer
Jan 29 2017 06:11
Hey y'all, pretty stuck on the Twitter API project. Does anyone know what website I can go to in order to access the API?
I'm seeing this (https://dev.twitter.com/oauth/overview) but am unsure as to which API access I need
psyche, think I found my loophole. thanks anyway
playingwithinfinity
@playingwithinfinity
Jan 29 2017 06:13
Why don't my table elements have spaces between them unlike MDN's tutorial?https://developer.mozilla.org/en/docs/Web/HTML/Element/table
http://codepen.io/jimpix/pen/zNNBZr
Sorin Ruse
@sorinr
Jan 29 2017 06:53
@playingwithinfinity you may add this in css:
table td{
  padding: 10px;
}
philiplee15
@philiplee15
Jan 29 2017 06:56
can someone help me change purple column colors to matching jumbotron? http://codepen.io/awksfox/pen/dNVrwB?editors=1100
its silver here but on my codepen it looks purple
Sorin Ruse
@sorinr
Jan 29 2017 06:58
@philiplee15 you need #eee background-color for that

@philiplee15 something like:

div.col-xs-12{
  background-color: #eee;
}

if that you want

James Moore
@James-N-M
Jan 29 2017 07:09
hey guys, I was just wondering if anyone knew any good resources to get like good at css. I know basic css, but ive seen people on codepen litterally draw things with css, shapes, etc. Does anyone have resources to acquire this skill level of css
Chris Wingler
@chriswingler
Jan 29 2017 07:15
how do i access the returned data outside the function?
  function apiLookup(term, name) {
    $.getJSON(api + apiTerms[term] + '/' + name + '?callback=?', function(data) {
      return data;
    })
  }
Gulsvi
@gulsvi
Jan 29 2017 07:16
@playingwithinfinity Your table looks different because you are using bootstrap.css. If you remove bootstrap.css, it will look like the table on MDN's tutorial.
@chriswingler you have to pass data to another function because getJSON is asynchronous
Chris Wingler
@chriswingler
Jan 29 2017 07:17
@SkyCoder01 thanks
CamperBot
@camperbot
Jan 29 2017 07:17
:cookie: 66 | @skycoder01 |http://www.freecodecamp.com/skycoder01
chriswingler sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
Gulsvi
@gulsvi
Jan 29 2017 07:19
I gave the wrong link - updated it above. That one has a better answer. Just figured this out today when doing the weather challenge...
Chris Wingler
@chriswingler
Jan 29 2017 07:21
ahh cool thanks again @SkyCoder01
CamperBot
@camperbot
Jan 29 2017 07:21
chriswingler sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:warning: chriswingler already gave skycoder01 points
h1tag
@h1tag
Jan 29 2017 08:01
Hey, the Wiki Viewer project, any tips to improve the style? : https://codepen.io/FortMax/pen/bgYJwqs
katiek78
@katiek78
Jan 29 2017 08:41
Hi, can anyone tell me how to remove vertical gaps between the page sections as in the Portfolio page project example?
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 09:02
vertical gaps?
playingwithinfinity
@playingwithinfinity
Jan 29 2017 09:12
Why does my Bootstrap table look so crappy? How can I improve it? https://codepen.io/jimpix/pen/zNNBZr
ZenZate
@ZenZate
Jan 29 2017 09:24
Make individual buttons look nice with CSS
playingwithinfinity
@playingwithinfinity
Jan 29 2017 09:48
How can I position my calculator buttons better? https://codepen.io/jimpix/pen/zNNBZr
alexg1990
@alexg1990
Jan 29 2017 09:49
can someone tell me, why the text is not changed based on the properties of my object? I already tried it with a string, so the on-click action should work in general. http://codepen.io/alexg1990/pen/YNELNX
playingwithinfinity
@playingwithinfinity
Jan 29 2017 09:52
@alexg1990 It seems to work
alexg1990
@alexg1990
Jan 29 2017 09:54
@playingwithinfinity strange, in the preview at codepen it doesn't work at all, here it's always changing to the 2nd quote, although I used Math.random.
@playingwithinfinity and the shown text is wrong. It displays "Here is quote number2" although I have no equal string, only "Quote 2". I am so confused right now
Pratik Ratnaparkhi
@pratikr1593
Jan 29 2017 10:11
you guys, I already have my own portfolio website created http://www.pratikratnaparkhi.com, do I really need to spend time building another one for free code camp?
Jared de Guzman
@JDVariadic
Jan 29 2017 10:42

Hi Guys! Can anyone check my code here?
https://codepen.io/JDVariadic/pen/wWNqQW

I've managed to get the geolocation code to work yesterday; however, it doesn't seem to work now and there is nothing appearing at the center box.

philiplee15
@philiplee15
Jan 29 2017 10:48
did anyone ski[p the portfolio project and go straight to JS first?
buiphuking
@buiphuking
Jan 29 2017 10:50
@philiplee15 i did
playingwithinfinity
@playingwithinfinity
Jan 29 2017 10:51
@pratikr1593 Just link it. And then you're done.
@philiplee15 So did I.
Ivan Ngundela
@ingundela
Jan 29 2017 11:09
Hello everyone.. I'm building a webpage and want to have in it a dropdown manu but it's not working.. i need to have under Solucoes a list of content... this is may code:
<nav class="navigation">
        <ul>
          <li>
              <a href="a">Solucoes</a>
              <div class="nav-content">
                <div class="nav-sub">
                  <ul>
                    <li><a href="#">Internet Dedicada Corporativa</a></li> 
                    <li><a href="#">Transmissao de Dados</a></li> 
                    <li><a href="#">IP-MPLS</a></li> 
                    <li><a href="#">M2M</a></li>
                    <li><a href="#">Alojamento</a></li>  
                </ul>
              </div>
            </div>

          <li>
              <a href="a">Voz</a>

          </li>

          <li>
              <a href="a">Internet</a>

          </li>

          <li>
              <a href="a">Ready Business</a>

          </li>

        </ul>
        </nav>
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 11:11
@ingundela You cannot create a drop-down with just HTML. You need CSS code as well
Ivan Ngundela
@ingundela
Jan 29 2017 11:16
@NitinNair89 ok... but isn't at least appear in my browser under Solucoes what I have just coded?
@NitinNair89 so that I can style it?
@NitinNair89 the note that I already have the nav class= "navigation" list in my browser
@NitinNair89 now just want to add the drop down list of content
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 11:20
Are you using Bootstrap
?
@ingundela
voxgranular
@voxgranular
Jan 29 2017 11:22
@playingwithinfinity the horizontal space between the buttons is too big IMO. A really simple way to do something about that is setting a max-width for your body or table element using css.
That will put your table on the left side of the page though. If you want to center it, you can use a small trick by setting margin: 0px auto (that means top and bottom margin for the element is 0px, and left and right should be set automatically by the browser, which means it will get centered in this case).
Ivan Ngundela
@ingundela
Jan 29 2017 11:26
@NitinNair89 I'm getting confused now... I only need to add content under the existing list in the browser... I don't understand when you asking if I'm using bootstrap (need to read more on this)
@NitinNair89 my list is just not appearing on the page...
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 11:28
@ingundela Do you have a codepen link?
Ivan Ngundela
@ingundela
Jan 29 2017 11:32
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 11:33
the link is incorrect
paste the whole URL
@NitinNair89 I see now the code I typed in now appearing in the right side of the page and not under Solucoesl as I want to
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 11:35
your CSS needs a lot of fixing
@ingundela Please go through all the steps here - http://www.w3schools.com/css/css_navbar.asp
Ivan Ngundela
@ingundela
Jan 29 2017 11:43
@NitinNair89 thanks... I'll go through it and see I can fix this...
CamperBot
@camperbot
Jan 29 2017 11:43
ingundela sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 386 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
Ivan Ngundela
@ingundela
Jan 29 2017 11:43
@NitinNair89 it's not easy at all
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 11:44
Yes i know @ingundela That's why do it step-by-step. Create a new one rather than editing the one you already have
Ivan Ngundela
@ingundela
Jan 29 2017 11:46
@NitinNair89 Ok..
Eric Chung
@chungeric
Jan 29 2017 12:13
body {
  font-family: 'Roboto Slab', serif;
  font-size: 30px;
  background: linear-gradient(lightcoral, whitesmoke);
}
Grrr, why is this doing nothing to my background?
devpaaji
@devpaaji
Jan 29 2017 12:17
@NitinNair89

https://plnkr.co/edit/O1KOUfiGGuYCCbdBqRAW?p=preview

i am having issues with placing this image in the html
especially in the local path
it disturbs all the layout
divs are skewed

or slanted as you say
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 12:29
Hi @devpaaji I am checking. Sorry my system got hanged
devpaaji
@devpaaji
Jan 29 2017 12:30
no issues
thats fine
@NitinNair89
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 12:31
@chungeric Add compatibility for all browsers for your background and try
@devpaaji Your transform: skewY( 7deg); is skewing the div
.carousel:after{
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    background: inherit;
    z-index: 0;
    transform-origin: right bottom;
    transform: skewY( 7deg);
}
devpaaji
@devpaaji
Jan 29 2017 12:33
yes
i want the image to appear under
carousel div class
<div class="carousel">
  <div class="image-carousel">
      <img src="assets/img/graph.png" />
  </div> 
</div>
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 12:34
add <img> tag under <div class="carousel"></div>
yeah
Can you add external images in pluner?
*plunker
yes see I did
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 12:35
I can't see.. save it and give the link. The preview works only for you
devpaaji
@devpaaji
Jan 29 2017 12:37
<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
  </head>
<div class="header-image">

</div>

<div class="carousel">
   <div class="image">
  <img src="https://photos-1.dropbox.com/t/2/AACeWkvAnAKick9mL19BFfAqhN0awzonUtSnUzd6Fff49Q/12/11126057/jpeg/32x32/3/1485698400/0/2/carousel_slide1.jpg/EO2spQgYnsMFIAIoAg/XY07dYeH5Js9GsFciYCZ-FlNQSG04KeD27pwMzkb9MY?dl=0&size=1280x960&size_mode=3" /> </div>
</div>

<div class="title">

</div>


</html>
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 12:38
so what's the error in this
?
The skew appears due to the CSS mentioned above. Remove that to remove the skew
devpaaji
@devpaaji
Jan 29 2017 12:39
is there any way i can share via email
so that i can explain
the error
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 12:39
You can PM me here
cambscoder
@cambscoder
Jan 29 2017 12:55
I'm stuck on this API call, why does it not work? If I type in the URL in the address bar it gets me the result I expect. Yet, I never seem to reach success.
$(document).ready(function() {
  $.ajax({
    url: "http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139&appid=8e83f5c253e4e52246b437596d46c1e8",
    success: function(data){
      alert("Test!");
    }    
  });
});
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 12:56
check your console for errors
cambscoder
@cambscoder
Jan 29 2017 12:56
@NitinNair89 Ok will do, thanks for the tip
CamperBot
@camperbot
Jan 29 2017 12:56
cambscoder sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 387 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 12:58
probably a cross-origins issue
cambscoder
@cambscoder
Jan 29 2017 12:58
Right, I get this error message:
Mixed Content: The page at 'https://codepen.io/cambscoder/pen/VPrqrL' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139&appid=8e83f5c253e4e52246b437596d46c1e8'. This request has been blocked; the content must be served over HTTPS.
send @ jquery.min.js:4
ajax @ jquery.min.js:4
(anonymous) @ VM806 pen.js:2
j @ jquery.min.js:2
k @ jquery.min.js:2
jquery.min.js:4 XMLHttpRequest cannot load http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139&appid=8e83f5c253e4e52246b437596d46c1e8. Failed to start loading.
Weird because yesterday it worked. Maybe I was logged into http://codepen.io
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 12:59
add https in your API URL
yeah
cambscoder
@cambscoder
Jan 29 2017 12:59
Yess, then it works!
ah no, the API has only http
so now I must use some cross-domain trick right?
How do I do that? @NitinNair89
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 13:02
try this - https://crossorigin.me/ @cambscoder
cambscoder
@cambscoder
Jan 29 2017 13:03
right, that's what i had in mind but couldn't remember it's name of @NitinNair89
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 13:04
:D
cambscoder
@cambscoder
Jan 29 2017 13:05
hmm, i seem to need to do some more things, i get the error Origin: header is required
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 13:06
ahh ok
Ghulam Shabir
@ghulamshabir
Jan 29 2017 13:14
hello dear campers, please tell me how can I use a condition to check if thumbnail exists in the json object then I can append an <img> tag if it does not exist then just don't want to use <img>. here is my code. I am using template strings
$('#wiki').append(
           `<a href=${url+pages[i].pageid} class="article" target="_blank">
              <div>
${pages.thumbnail ? <img class="align-right" src=${pages.thumbnail.source} /
Ghulam Shabir
@ghulamshabir
Jan 29 2017 13:21
nvm Diego Mayer @Chrono79 solved my problem
cambscoder
@cambscoder
Jan 29 2017 13:26
@NitinNair89 I couldn't resolve it sadly. So I just went back to loggin into Codepen through http
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 13:26
@cambscoder Still the same error?
Eric Chung
@chungeric
Jan 29 2017 13:27
I'm doing the wikipedia viewer, and i've got a query but the title property isn't returning actual titles. It's giving me for example, 'Q19832958'
Anyone been here?
Ghulam Shabir
@ghulamshabir
Jan 29 2017 13:28
@chungeric what url are you using ?
Eric Chung
@chungeric
Jan 29 2017 13:35
@ghulamshabir alright.. but i'm just trying to get the title working right now. did you click my link? what do the titles say for you?
Ghulam Shabir
@ghulamshabir
Jan 29 2017 13:35
@chungeric yeah title was the same what you said
Eric Chung
@chungeric
Jan 29 2017 13:38
Oh interesting
@ghulamshabir Okay thanks, i'll try to figure it out
CamperBot
@camperbot
Jan 29 2017 13:38
chungeric sends brownie points to @ghulamshabir :sparkles: :thumbsup: :sparkles:
:star2: 1767 | @ghulamshabir |http://www.freecodecamp.com/ghulamshabir
Ghulam Shabir
@ghulamshabir
Jan 29 2017 13:38
@chungeric :+1:
Eric Chung
@chungeric
Jan 29 2017 13:50
@ghulamshabir Figured out the problem... I was using wikidata.org/w/api.php
🙄
Ghulam Shabir
@ghulamshabir
Jan 29 2017 13:51
@chungeric haha I could not see that
alonl6
@alonl6
Jan 29 2017 13:56
Hello. About the tribute page.. I must to use bootstrap? I find its a lot easy for me to do it with vanilla CSS with such simple html page
Ken Haduch
@khaduch
Jan 29 2017 13:58
@alonl6 - you can use any library or simply use HTML and CSS directly.
alonl6
@alonl6
Jan 29 2017 14:01
Thank you
c0d0er
@c0d0er
Jan 29 2017 14:15
does anybody know any good free web hosting service?
S Ramakrishnan
@sramakrishnan247
Jan 29 2017 14:29
Hey guys! please follow me on github https://github.com/sramakrishnan247 . I recently completed the first two api projects
Janina Pohorecki
@janepohorecka
Jan 29 2017 14:30
I have a question for those familiar with developing web forms. Is it proper to use services like Formspree for a clients website or does it have to be built out of PHP and MySQL?
What are the best practices?
Michael Bomholt
@bomholtm
Jan 29 2017 14:38
does anyone had a problem with bootstrap fullscreen modals adding padding-right: 15px on open? (just on linux though)
Muhammad Hasham
@MohammadHasham
Jan 29 2017 14:41
how to make a website on my local pc go live?
what steps are necessary?
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 14:42
do it on codepen or github pages
else buy a domain and host it
Faddah Wolf
@faddah
Jan 29 2017 14:48
just wanted to stick my head in and say a 'Hello World!' to all, from portland, oregon, u.s.a.
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 14:50
Hello!
Faddah Wolf
@faddah
Jan 29 2017 15:02
Hi @NitinNair89 .
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 15:02
:)
Nawkin
@Nawkin
Jan 29 2017 15:06
yo can sb help me out with the navbar? dont know how to fix it https://codepen.io/Nawkin/pen/MJOPzw
can anyone tell me why my typed.js is not working?
Jacob Leatherwood
@dadleatherwood
Jan 29 2017 15:11
I started over on my portfolio page. I want my content to stay within my container no matter what the screen size is. Can someone tell me what's wrong? http://codepen.io/dadleatherwood/pen/QdOzzr
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 15:12
@Nawkin Navbar looks fine. What's the issue?
Nawkin
@Nawkin
Jan 29 2017 15:13
@NitinNair89 when i click on it, it doesnt go where i want it to. it cuts out stuff, because i used margin on the body i think
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 15:15
@dadleatherwood You are using too much margin styles which is breaking the grid you have. Please remove all unwanted margins
Faddah Wolf
@faddah
Jan 29 2017 15:15
@nawkin - because you don't have links <a href="...">...</a> or sub-menus to your li's for it to go anywhere.
voxgranular
@voxgranular
Jan 29 2017 15:16
@dadleatherwood for your h1, you've set margin-left: -200px for instance, try and remove that as @NitinNair89 suggests
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 15:16
@Nawkin It goes to the section when clicked. Just add margin-top to the sections
Faddah Wolf
@faddah
Jan 29 2017 15:16
@Nawkin you have to be the one to tell it where to go, using link tags.
Jacob Leatherwood
@dadleatherwood
Jan 29 2017 15:17
Thank you @Nawkin
CamperBot
@camperbot
Jan 29 2017 15:17
dadleatherwood sends brownie points to @nawkin :sparkles: :thumbsup: :sparkles:
:cookie: 120 | @nawkin |http://www.freecodecamp.com/nawkin
Jacob Leatherwood
@dadleatherwood
Jan 29 2017 15:17
Thank you @voxgranular
CamperBot
@camperbot
Jan 29 2017 15:17
dadleatherwood sends brownie points to @voxgranular :sparkles: :thumbsup: :sparkles:
:cookie: 210 | @voxgranular |http://www.freecodecamp.com/voxgranular
Bigyan Karki
@bigyankarki
Jan 29 2017 15:17
can anyone please go through this?
Nawkin
@Nawkin
Jan 29 2017 15:23
@faddah I do have them in line 4-6 but it cuts out stuff
Faddah Wolf
@faddah
Jan 29 2017 15:26
@bigyan karki - it is not working because typed.js is jQuery plug-in and you're not including a CDN to jQuery in your codepen JavaScript settings, or as a <script src="..."></script> in your HTML. the jQuery script reference should come before typed.js & your bootstrap.js
@Nawkin let me look again.
Bigyan Karki
@bigyankarki
Jan 29 2017 15:28
@faddah i did as you said..still not working
@faddah now its working
@faddah thank you so much :)
CamperBot
@camperbot
Jan 29 2017 15:30
bigyankarki sends brownie points to @faddah :sparkles: :thumbsup: :sparkles:
:cookie: 118 | @faddah |http://www.freecodecamp.com/faddah
Bigyan Karki
@bigyankarki
Jan 29 2017 15:31
@faddah does that mean any jquery cdn should come before any other js library and files?
Faddah Wolf
@faddah
Jan 29 2017 15:32
@bigyan karki yes, jQuery first.
@Nawkin - still looking at your code...
Nawkin
@Nawkin
Jan 29 2017 15:33
ok
Bigyan Karki
@bigyankarki
Jan 29 2017 15:33
:)
Darren Ho
@darrenho97
Jan 29 2017 15:39
hi, regarding the random quote machine, how do i fix the problem where i click the tweet button, it pops up but doesnt contain the quote?
Bigyan Karki
@bigyankarki
Jan 29 2017 15:40
www.twitter.com/status=? + your quote
that should give you some idea @darrenho97
Michael Bomholt
@bomholtm
Jan 29 2017 15:41
i have a one page website with a navigation that scrolls to different sections of that page. the last section is short and has the footer below. if the footer is too short the scroll stops above the section it should scroll to. is there a way to make the footer take up all space left so the scroll works on every screen resolution? (the section varies in height ... so calc 100vh - section height isn't possible)
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 15:42
@darrenho97 or alternatively when you "share" something on twitter, what does the URL say? Visit any blog or video on Youtube and check the twitter share button link. :)
@bomholt Does your nav scroll to the footer as well?
I mean any links that scrolls the user to the footer?
Michael Bomholt
@bomholtm
Jan 29 2017 15:43
@NitinNair89 no just the sections between header and footer
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 15:43
any way, I think it should be fine, users won't scroll deliberately to check the footer of the page. It should appear when the last section is viewed
Michael Bomholt
@bomholtm
Jan 29 2017 15:44
the problem is with the last section
the last section is shorter then 100% height on most resolutions
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 15:44
you are using 100vh for the height right?
Michael Bomholt
@bomholtm
Jan 29 2017 15:45
no i dont use 100vh
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 15:45
why?
Michael Bomholt
@bomholtm
Jan 29 2017 15:45
100vh for the last section or for the footer?
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 15:45
it takes up full viewport height
for sections
not footer
Michael Bomholt
@bomholtm
Jan 29 2017 15:45
because the section can't be that high because of its content
is it okay to pm you?
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 15:47
yea sure
Faddah Wolf
@faddah
Jan 29 2017 15:47
@Nawkin - one thing, and this is just a don't put <link stylesheet="..." /> in the <body> of your HTML, they should be between <head> tags above the <body>. still looking at why your anchor tags from the navbar aren't working...
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 15:47
let that section take up 80% and footer 20%
or 90:10
Nawkin
@Nawkin
Jan 29 2017 15:47
@faddah thanks for your patience :D
CamperBot
@camperbot
Jan 29 2017 15:47
nawkin sends brownie points to @faddah :sparkles: :thumbsup: :sparkles:
:cookie: 119 | @faddah |http://www.freecodecamp.com/faddah
Bigyan Karki
@bigyankarki
Jan 29 2017 15:48
@faddah did you know why my cursor is down instead of in the header section?
Faddah Wolf
@faddah
Jan 29 2017 15:48
@bigyan karki - i'm looking at @Nawkin 's code now, sorry.
Bigyan Karki
@bigyankarki
Jan 29 2017 15:49
no problem :)
Faddah Wolf
@faddah
Jan 29 2017 15:52
@nawkin - i see you moved the <link stylesheet="..." ... /> to the top, which is good, but it needs to be between <head> ... </head> tags.
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 15:53
in codepen, don't use anything in HTML window except the things that should appear between <body>...</body> tags. Everything else should be placed in the pen settings
Faddah Wolf
@faddah
Jan 29 2017 15:55
@NitinNair89 that's not a hard & fast rule about codepen, it's optional. it doesn't hurt anything, either way. you can put your <link styleshee="..." /> or <script> tags in your HTML or in their codepen settings interface, either will work. i've done both, both work fine.
Nawkin
@Nawkin
Jan 29 2017 15:56
@faddah what if i add margin-bottom to the nav bar?
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 15:56
yeah right, but sometimes the <link> tag does not work and affects the other elements..helped fix such a issue with one of the campers
Faddah Wolf
@faddah
Jan 29 2017 15:57
@Nawkin - in your css, you mean? which are you trying to fix, the "cut off" problem or that the links don't transfer you to those sections of the page? i'm working on your link issue first, as that seems most pressing.
@NitinNair89 you are correct that you have to know how to do CSS stylesheet links and <script> tags correctly, and know the right order they need to be in for them to work, but that is true in any implementation of HTML/CSS.
Nawkin
@Nawkin
Jan 29 2017 15:58
@faddah i only see the problem with cutting off with the navigation bar. so yeah :/
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 15:58
hmm
Faddah Wolf
@faddah
Jan 29 2017 15:59
@Nawkin - i don't really see your "cut off" problem, so i'm working on the links.
Nawkin
@Nawkin
Jan 29 2017 15:59
maybe im using wrong terms but i think we're talking about the same thing :D
Jean Marco Romero
@volkranium
Jan 29 2017 16:02
Supp guys
Can i animate an svg avatar with css?
like close its eyes
and moves its mouth
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 16:03
yes
Jean Marco Romero
@volkranium
Jan 29 2017 16:03
awesome
Faddah Wolf
@faddah
Jan 29 2017 16:04
@Nawkin - "cut off" to me is a visual thing — one element is bleeding down on another when you use it, as in "cutting off the other element," and i am not seeing that when i hover over your nav bar. the fact that when i click your "Contact" link and it doesn't jump me down to the bottom of the page is more disconcerting to me.
@Nawkin - one question - are you accessing your code pen through a mobile phone or tablet touch browser, or via a desktop/laptop with a touchpad or mouse?
Nawkin
@Nawkin
Jan 29 2017 16:05
@faddah normal desktop with mouse and keyboard
@faddah when i click contact in the nav bar it takes me down though
Faddah Wolf
@faddah
Jan 29 2017 16:06
@Nawkin hmmmm....
Nawkin
@Nawkin
Jan 29 2017 16:06
@faddah only when i click about or portfolio it goes a little bit to low
can anyone explain why the cursor is in a new line?
PipsChips
@PipsChips
Jan 29 2017 16:10
Hi! Could someone pls check my JS part of code for typos and mistakes. My Random Quote Machine generates only one (first) quote; although i've set cache to false...?
http://codepen.io/PipsChips/pen/pRWRKd
playingwithinfinity
@playingwithinfinity
Jan 29 2017 16:13
How do you build a JS calculator? I've gotten the HTML and CSS done, but I have no idea how to perform the actual operations.
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 16:13
use javascript @playingwithinfinity
playingwithinfinity
@playingwithinfinity
Jan 29 2017 16:14
@NitinNair89 Duh
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 16:14
:P
You get the elements value via JS, do the operations, then put that value in html using JS
Don't do it all at once, do one operation at a time
playingwithinfinity
@playingwithinfinity
Jan 29 2017 16:16
Displaying the operations is the hard part
Clicking and other stuff is pretty easy.
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 16:16
yeah
@bigyankarki Where is "typed-cursor" defined in HTML?
Faddah Wolf
@faddah
Jan 29 2017 16:19
@Nawkin - i don't know why, but i'm getting a "404 not found" on your pen now in my desktop chrome browser. so maybe i'm not the one to help you. sorry.
Faddah Wolf
@faddah
Jan 29 2017 16:20
@Nawkin - i have to leave now, in any case, sorry i couldn't be more help. re-post the question, maybe someone else can help.
Nawkin
@Nawkin
Jan 29 2017 16:21
@faddah no problem, have a good one :)
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 16:21
@Nawkin I can try. Issue?
Nawkin
@Nawkin
Jan 29 2017 16:22
does anybody see what i did wrong? when i click on about or portfolio on my navigationbar it almost does the right thing
but cuts out and it should show more
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 16:23
i am checking
Tom
@moT01
Jan 29 2017 16:23
@Nawkin it goes to where you tell it to, ...the label is just hiding behind your menu
Nawkin
@Nawkin
Jan 29 2017 16:24
exactly, so where do i add margin?
Tom
@moT01
Jan 29 2017 16:26
this worked
#portfolio {
  padding-top: 100px;
}
makes a big space though
Nawkin
@Nawkin
Jan 29 2017 16:27
@moT01 thank you so much, exactly what i needed
CamperBot
@camperbot
Jan 29 2017 16:27
nawkin sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 483 | @mot01 |http://www.freecodecamp.com/mot01
Nawkin
@Nawkin
Jan 29 2017 16:27
im out, have a nice day!
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 16:27
@Nawkin You can add a <section id="about"> wrapping up the necessary elements. This will also make your HTML DOM good
Add sections for each group and then in CSS -
#about {
  padding-top:70px;
}
respectively for all sections.
PipsChips
@PipsChips
Jan 29 2017 16:32
Hi! Could someone pls check my JS part of code for typos and mistakes. My Random Quote Machine generates only one (first) quote; although i've set cache to false...?
http://codepen.io/PipsChips/pen/pRWRKd
Bigyan Karki
@bigyankarki
Jan 29 2017 16:34
@NitinNair89 it is defined in typed.js
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 16:35
ah ok @bigyankarki
Bigyan Karki
@bigyankarki
Jan 29 2017 16:36
@NitinNair89 idk whats wrong though
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 16:36
check it's CSS in their code and overwrite it in your pen. Maybe it has display:block; or something instead of inline and that's why it appears on next line
*its
@PipsChips your getJSON is called only once when the document loads. Hence the click event also executes once since you wrote that inside the getJSON which is a wrong practice
Define your function outside getJSON but within document.ready() and pass on the json data you retrieve as a function argument.
something like -
$(document).ready(function(){
function getQuote(){
// my getJSON call goes here
displayQuote(response); // call a function and pass the response from getJSON
};

function displayQuote(data){
//update HTML element values here using 'data' variable.
};
});
Bigyan Karki
@bigyankarki
Jan 29 2017 16:45
@NitinNair89 <span class="typed-cursor">'+this.cursorChar+"</span>")
i think its defined correctly
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 16:46
yes, that's the HTML. check the CSS
Bigyan Karki
@bigyankarki
Jan 29 2017 16:47
.typed-cursor{
    opacity: 1;
    -webkit-animation: blink 0.7s infinite;
    -moz-animation: blink 0.7s infinite;
    animation: blink 0.7s infinite;
}
@keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-webkit-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-moz-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
this is the CSS
its all animation
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 16:48
and where does the <span> appear for cursor?
Bigyan Karki
@bigyankarki
Jan 29 2017 16:50
its on JS
or do you mean i should add it on my HTML too?
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 16:51
no i mean, where exactly in JS?
you added it in HTML @bigyankarki
Bigyan Karki
@bigyankarki
Jan 29 2017 16:53
well i dont know what to tell
but the link is here
ya i just did it
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 16:53
Good
I found the solution
Bigyan Karki
@bigyankarki
Jan 29 2017 16:55
what was wrong?
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 16:55
the <h1> adds deafult padding and margins
try this -
  <span class="typed-cursor"></span><span class="heading"></span>
add font-size to your heading class to look it like an <h1> tag ;) @bigyankarki
Bigyan Karki
@bigyankarki
Jan 29 2017 16:56
oh :D
@NitinNair89 thank you :)
CamperBot
@camperbot
Jan 29 2017 16:57
bigyankarki sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 388 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
Nitin Chandran Nair
@NitinNair89
Jan 29 2017 16:57
hehe
Good night Everyone!
Thanks for making me feel productive today :P
Had fun helping you all, learned a great many things as well :)
Until next time, cyz
You can always PM me, but please expect delay in response
Bigyan Karki
@bigyankarki
Jan 29 2017 17:00
thanks for helping @NitinNair89
CamperBot
@camperbot
Jan 29 2017 17:00
bigyankarki sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:warning: bigyankarki already gave nitinnair89 points
Bigyan Karki
@bigyankarki
Jan 29 2017 17:00
good night
Tyler Moeller
@TylerMoeller
Jan 29 2017 17:17
@thodorisanta One way is to find it via the greatest common divisor. (lcm(a,b) = (a*b)/gcd(a,b))
There is some pseudo code on Wikipedia that helps with the implementation:
Bigyan Karki
@bigyankarki
Jan 29 2017 17:21
@TylerMoeller hi tyler how are you doing?
this is the program I am doing right now. and I just wanted to make it more dynamic
how do i make a smooth transition from a search button to a input field at the top of a page
?
Tyler Moeller
@TylerMoeller
Jan 29 2017 17:23
Hi @bigyankarki just waking up :coffee: :) I'll take a look
Bigyan Karki
@bigyankarki
Jan 29 2017 17:23
:D
i mean just give me the idea
Tyler Moeller
@TylerMoeller
Jan 29 2017 17:23
You want the search field to animate to the top?
Bigyan Karki
@bigyankarki
Jan 29 2017 17:23
do i need animation
yes and change it to an input field
Tyler Moeller
@TylerMoeller
Jan 29 2017 17:24
One way is to replace the HTML with the input field when the user clicks the icon, and then use .animate() to change the position of the element.
.animate() takes CSS properties as arguments, so you might change the css to ({position: absolute;}, {top: 50px}) for example
Bigyan Karki
@bigyankarki
Jan 29 2017 17:29
hmm will try that :)
Tyler Moeller
@TylerMoeller
Jan 29 2017 17:29
I'm not an expert at this stuff yet - still learning it, but it's how I would start
Chris Wingler
@chriswingler
Jan 29 2017 17:42
why won't data.name append? i suspect it's related to pulling in multiple data sources, but don't know how to fix it.
  function online(data) {
    console.log(data)
    if (data.stream !== null && data.stream !== undefined) {
      $('#results').append(data.name);
    }
  }

  function apiLookup(term1, term2, name, callback) {
    $.getJSON(api + apiTerms[term1] + '/' + name + '?callback=?', callback)
    $.getJSON(api + apiTerms[term2] + '/' + name + '?callback=?', callback)
  }

  for (var i = 0; i < user.length; i++) {
    apiLookup('users', 'streams', user[i], online);
  }
Tom
@moT01
Jan 29 2017 17:47
@chriswingler maybe the test isn't passing? got a pen? i could maybe help if you do
Chris Wingler
@chriswingler
Jan 29 2017 17:48
Spyrantis Theodoros
@thodorisanta
Jan 29 2017 17:50
@TylerMoeller but how will i use this to find the lcm of more than 2 numbers
Tyler Moeller
@TylerMoeller
Jan 29 2017 17:52
@thodorisanta You can sort from greatest to smallest, start with the first two, then go through the rest in the range
Tom
@moT01
Jan 29 2017 17:53
@chriswingler yea, i think nothing is getting past your test
the streams are mostly = undefined
Chris Wingler
@chriswingler
Jan 29 2017 17:54
@moT01 i can append data.stream.game
and when i console.log, i can see a couple users streaming starcraft
Tom
@moT01
Jan 29 2017 18:03
i think its because the name is in the users url
which doesn't include the stream variable in your test
@chriswingler
Chris Wingler
@chriswingler
Jan 29 2017 18:04
ahh hrmm i'll check that out @moT01
Tom
@moT01
Jan 29 2017 18:15
@chriswingler the name is also in the stream url after a second look
so you could keep your test and use data.stream.channel.name to get the name
Tyler Moeller
@TylerMoeller
Jan 29 2017 18:22
@chriswingler Use || instead of &&: if(data.stream !== null && data.stream !== undefined) {`
Chris Wingler
@chriswingler
Jan 29 2017 18:25
@TylerMoeller when i do that, it returns users that aren't streaming
Tyler Moeller
@TylerMoeller
Jan 29 2017 18:27
@chriswingler Sorry, thought you were trying to get data.name to append from your question above
Chris Wingler
@chriswingler
Jan 29 2017 18:30
it's cool.. thanks @TylerMoeller @moT01
CamperBot
@camperbot
Jan 29 2017 18:30
:cookie: 484 | @mot01 |http://www.freecodecamp.com/mot01
:star2: 1427 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
chriswingler sends brownie points to @tylermoeller and @mot01 :sparkles: :thumbsup: :sparkles:
Tom
@moT01
Jan 29 2017 18:30
@TylerMoeller have you done any of the data visualization challenges?
Tyler Moeller
@TylerMoeller
Jan 29 2017 18:31
@moT01 Just the markdown previewer - did the bar chart in jquery, need to do it in react
maybe halfway through the camper leaderboard, but keep going back to learn more algorithms instead of front-end work
Tom
@moT01
Jan 29 2017 18:33
need to do it in react? says you can use whatever, im lazily trying to play around with this d3 for that
Tyler Moeller
@TylerMoeller
Jan 29 2017 18:34
I assume they want us to use react.js for all those challenges, but you're right, they don't say you have to use React
Tom
@moT01
Jan 29 2017 18:34
i think its react for that first group of challenges, and d3 for the 2nd group
Tyler Moeller
@TylerMoeller
Jan 29 2017 18:34
I'm finding D3 to be a pain - most of the tutorials and documentation are for v2 and v3, but I'm thinking we should use v4... :)
Tom
@moT01
Jan 29 2017 18:35
yea, thats what im playing with
Tyler Moeller
@TylerMoeller
Jan 29 2017 18:35
So I keep finding how to convert what I learn in the tutorials to the newer method names. Lots of stack overflow searches for errors in my console
Tom
@moT01
Jan 29 2017 18:35
theres a few syntax differences that got me stuck for a bit
any idea if theyre going to put up the 'coming soon' learning challenges anytime soon
Tyler Moeller
@TylerMoeller
Jan 29 2017 18:37
I saw a post from Quincy on the forums that they have the alpha version up and ready
I did the courses at codecademy
Tom
@moT01
Jan 29 2017 18:42
good timing
Michael Bomholt
@bomholtm
Jan 29 2017 18:52
hey guys is there a way to use the browsers back button to close a bootstrap modal?
Tyler Moeller
@TylerMoeller
Jan 29 2017 18:53
@bomholt Yes, lots of solutions on stack overflow. Ideally though, the modal can be presented in a way where the user sees a 'close' button and presses that instead.
Michael Bomholt
@bomholtm
Jan 29 2017 18:58
now im confused @TylerMoeller just got told in main channel its not possible ^^
Mostafa Masri
@thefakeweed
Jan 29 2017 18:59
hey guys this challenge is complicated , i didnt understand what i should do https://www.freecodecamp.com/challenges/finding-a-remainder-in-javascript
Michael Bomholt
@bomholtm
Jan 29 2017 18:59
@TylerMoeller there is a really big close button but if a modal is fullscreen lots of people... at least the ones which tested the page tend to use the browser back button
Tyler Moeller
@TylerMoeller
Jan 29 2017 19:08
@bomholt Here's an example of it working: http://s.codepen.io/TylerMoeller/pen/oBpgXO
Michael Bomholt
@bomholtm
Jan 29 2017 19:08
@TylerMoeller i will look into it thanks man
CamperBot
@camperbot
Jan 29 2017 19:08
bomholt sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1428 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
KaviJo
@KaviJo
Jan 29 2017 19:11
Hello Everyone, How are you today?
I am currently doing the Pomodoro Clock challenge and was wondering if anyone could point me toward a website where I can obtain a "clock" mp3 audio file to add to my code? Please and thank you :D
David Koch
@davidakoch
Jan 29 2017 19:12
Hello all, can anyone help me understand the logic in this:
return Math.floor(Math.random() * (ourMax - ourMin + 1)) + ourMin;
@mml3b Hello Mostafa, the remainder operator is a bit tricky. But think of it as an operator that automatically divides. So we know that if you divide 5 by 2, you'll have a remainder of 1. So think that the % operator won't give you 2.5 (which is what 5 divided by 2 is), but will give you 1 (which is what is left over from 5 divided by 2)...hope that helps
Mostafa Masri
@thefakeweed
Jan 29 2017 19:17
@davidakoch thank god i passed that challenge , tell me if you want something
CamperBot
@camperbot
Jan 29 2017 19:17
:cookie: 191 | @davidakoch |http://www.freecodecamp.com/davidakoch
mml3b sends brownie points to @davidakoch :sparkles: :thumbsup: :sparkles:
David Koch
@davidakoch
Jan 29 2017 19:19
@mml3b thanks, I'm having trouble figuring out this formula "return Math.floor(Math.random() * (ourMax - ourMin + 1)) + ourMin;"
CamperBot
@camperbot
Jan 29 2017 19:19
davidakoch sends brownie points to @mml3b :sparkles: :thumbsup: :sparkles:
:cookie: 139 | @mml3b |http://www.freecodecamp.com/mml3b
alonl6
@alonl6
Jan 29 2017 19:20
Hello. About projects.. Can I use github instead of codepen?
Bigyan Karki
@bigyankarki
Jan 29 2017 19:23
$(".btn").replaceWith("<input type="text" class="form-control" id="inputField" placeholder= "Search"></input>");
what is wrong with this line?
Veronika Krukovich
@VKrukovich
Jan 29 2017 19:23
i dontt understand why git hub doesn't show the page? i have a repository frontend-nanodegree-mobile-portfolio and there is index.html here https://VKrukovich.github.io/frontend-nanodegree-mobile-portfolio/
Tom
@moT01
Jan 29 2017 19:23
@davidakoch its getting a random number in a range i think
math.random() gives a random number between 0 and 1 i believe
math.floor() rounds down to the closest integer i believe
alpox
@alpox
Jan 29 2017 19:30
@bigyankarki If you use " inside of a string, you have to use different begin and terminating quotes -- use ' the single quote at the beginning and end:
'This is some "string" with " quotes'
Chinmaya B
@sharang108
Jan 29 2017 19:31
Help! This API projects SUck API's wont work for free there are no easy/free options
CamperBot
@camperbot
Jan 29 2017 19:31
no wiki entry for: this api projects suck apis wont work for free there are no easyfree options
alpox
@alpox
Jan 29 2017 19:32
@sharang108 It is working for free, but you have to use the http:// instead of https://
Chinmaya B
@sharang108
Jan 29 2017 19:32
@alpox Okay I will try that
alpox
@alpox
Jan 29 2017 19:32
@sharang108 Also, you cannot use navigator.geolocation.getCurrentPosition because it depends on https.
You got to use another free ip location api like http://ip-api.com/
Chinmaya B
@sharang108
Jan 29 2017 19:33
@alpox still noresponse
@alpox my firewall is blocking ip-api.com
Tyler Moeller
@TylerMoeller
Jan 29 2017 19:35
@bigyankarki By the way, this is one way to get that search box moving to the top. It's a bit overkill with the animations :) but the moving to top part is done with a css change of margin-top. No need for position: absolute. http://s.codepen.io/TylerMoeller/pen/oBpNNp
Harshil Agrawal
@harshil1712
Jan 29 2017 19:35
can anyone help me out with the CSS. I want to display text when I hover over the image. I dont understand why it fails to work. http://codepen.io/harshil1712/pen/bgaNEB?editors=1100
alpox
@alpox
Jan 29 2017 19:44
@sharang108 hmm cannot help there then :D
Chinmaya B
@sharang108
Jan 29 2017 19:44
@alpox Okay thanks anyway
CamperBot
@camperbot
Jan 29 2017 19:44
sharang108 sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
:cookie: 753 | @alpox |http://www.freecodecamp.com/alpox
alpox
@alpox
Jan 29 2017 19:45
@sharang108 I think all solutions i've seen were with ip-api
Chinmaya B
@sharang108
Jan 29 2017 19:46
@alpox But I don't know why it isn't loading even if I allow it to bypass my firewall
alpox
@alpox
Jan 29 2017 19:46
@sharang108 I don't know... check your developer console (F12 or ctrl-shift-i) for errors
Tyler Moeller
@TylerMoeller
Jan 29 2017 19:47
Chinmaya B
@sharang108
Jan 29 2017 19:47
Well there is no error
@alpox
@TylerMoeller Okay yeah the first ipinfo link works
Ivan Ngundela
@ingundela
Jan 29 2017 19:49
hello everyone.... I need some help here with a dropdown menu list .. I need to have list inside the "Solucoes" please check my codepen... this messed up
<nav class="menu">
        <ul>
          <li><a href="default.solucoes">Solucoes</a>
              <nav class="sub-menu">
                  <ul>
                    <li><a href="#">Internet Dedicada Corporativa</a></li> 
                    <li><a href="#">Transmissao de Dados</a></li> 
                    <li><a href="#">IP-MPLS</a></li> 
                    <li><a href="#">M2M</a></li>
                    <li><a href="#">Alojamento</a></li>  
                </ul>
              </Nav>

             </li>
          <li><a href="default.ready business">Ready Business</a></li>
          <li><a href="default.ready business">Parceiros</a></li>
          <li><a href="default.voz">Suporte</a></li>

          </ul>    
    </nav>
Chinmaya B
@sharang108
Jan 29 2017 19:49
@TylerMoeller Can you explain
done(data =>
displayLoc(data.lat, data.lon,
Allison M.
@allisonmahmood
Jan 29 2017 19:51
Can someone please send an example of their portfolio page. the one given as an example in the actual task seems like it uses some js and i dont know js yet so i wanna see one by u guys to see a more realistic example for my knowladge
Harshil Agrawal
@harshil1712
Jan 29 2017 19:52
@allisonmahmood here you go http://codepen.io/harshil1712/pen/wWBMjL
Tyler Moeller
@TylerMoeller
Jan 29 2017 19:52
@sharang108 It's the same as:
.done(function(data) {})
Allison M.
@allisonmahmood
Jan 29 2017 19:52
@harshil1712 thanks a lot
CamperBot
@camperbot
Jan 29 2017 19:52
allisonmahmood sends brownie points to @harshil1712 :sparkles: :thumbsup: :sparkles:
:cookie: 324 | @harshil1712 |http://www.freecodecamp.com/harshil1712
Harshil Agrawal
@harshil1712
Jan 29 2017 19:53
@allisonmahmood anytime
Ivan Ngundela
@ingundela
Jan 29 2017 19:53
PLEASE HELP ME
Allison M.
@allisonmahmood
Jan 29 2017 19:54
how did ui get the backgroung images to scroll in the backgroung.
Harshil Agrawal
@harshil1712
Jan 29 2017 19:55
@allisonmahmood sorry didn't got you
Allison M.
@allisonmahmood
Jan 29 2017 19:55
@harshil1712 as u scroll down the background changes. how did u do that??
Tyler Moeller
@TylerMoeller
Jan 29 2017 19:56
@sharang108 For example, these are the same, one just uses arrow notation so you don't have to type in function(data):
$.getJSON(url, function(data) {
  // do something with data
}).done(function(data){
  // do some more stuff with data
}).fail(function(err) {
  // log errors
});

$.getJSON(url, data => {
  // do something with data
}).done(data => {
  // do some more stuff with data
}).fail(err => {
  // log errors
});
alan-redding
@alan-redding
Jan 29 2017 19:56
Harshil Agrawal
@harshil1712
Jan 29 2017 19:56
I made different sections and for each section i selected a different background image
Allison M.
@allisonmahmood
Jan 29 2017 19:56
@harshil1712 ohh ok
Chinmaya B
@sharang108
Jan 29 2017 19:57
@TylerMoeller Okay its some sort of advance function notation
can I skip done()?
Harshil Agrawal
@harshil1712
Jan 29 2017 19:58
@ingundela try using boostrap it will be much easier
alan-redding
@alan-redding
Jan 29 2017 19:58
@ingundela Check out the code in this pen, it will help you figure out the submenus. https://codepen.io/philhoyt/pen/ujHzd
Tyler Moeller
@TylerMoeller
Jan 29 2017 19:58
@sharang108 You can skip done if you wish. The arrow notation is from the JavaScript version released in 2015 (es6)
Chinmaya B
@sharang108
Jan 29 2017 19:58
@TylerMoeller Okay
Ivan Ngundela
@ingundela
Jan 29 2017 19:59
@harshil1712 how do I use boostrap?
Harshil Agrawal
@harshil1712
Jan 29 2017 20:00
@ingundela everything you need to know about bootstrap http://getbootstrap.com/
Ivan Ngundela
@ingundela
Jan 29 2017 20:01
@harshil1712 @alan-redding thanks
CamperBot
@camperbot
Jan 29 2017 20:01
:cookie: 325 | @harshil1712 |http://www.freecodecamp.com/harshil1712
:cookie: 254 | @alan-redding |http://www.freecodecamp.com/alan-redding
ingundela sends brownie points to @harshil1712 and @alan-redding :sparkles: :thumbsup: :sparkles:
Katja Vegner
@dearkathie
Jan 29 2017 20:03
Hi guys.
I've spent whole day trying to figure out what's wrong with my code (feels like I read every page about this errors at staskoverflow, really).
I almost never get data (you can check it in console.log)
Maybe anyone can help and tell whats going on?
http://codepen.io/dearkathie/pen/xgpbjo
Ivan Ngundela
@ingundela
Jan 29 2017 20:09
@alan-redding the code in this pen is just the way I did it but why my submenu is in the right side of the pay.. isn't supposed to be right below the Solucoes ?
Chinmaya B
@sharang108
Jan 29 2017 20:09
@TylerMoeller What Weather api do you recommend?
in this problem when i click a search icon and the input field appears and i try to write a text, why does the rectangular blue shade appears?
Tyler Moeller
@TylerMoeller
Jan 29 2017 20:13
@sharang108 I like Weather Underground. They have one URL that gives you weather and location all in one API call.
Tom
@moT01
Jan 29 2017 20:13
@dearkathie wondering if it has to do with the data in the url, ...im not sure its actually json, just a bunch of arrays
Chinmaya B
@sharang108
Jan 29 2017 20:14
@TylerMoeller Is it free and does it need signup?
Tyler Moeller
@TylerMoeller
Jan 29 2017 20:15
@sharang108 Yes, it's free, but you do need to sign up for an API Key. Their auto location + weather url isn't very well documented, but this is the link for your getJSON:
https://api.wunderground.com/api/API_KEY/conditions/q/autoip.json
Chinmaya B
@sharang108
Jan 29 2017 20:16
@tyler
@TylerMoeller Okay I will try this.
Katja Vegner
@dearkathie
Jan 29 2017 20:17
@moT01 it's a json, according Wiki API Docs. Looks like something wrong with request, but I cant realise what exactly. I even deleted AdBlock as everyone told me so
Tom
@moT01
Jan 29 2017 20:18
i dunno, i plugged the url i used into it, and that's not working either, so its something else
Katja Vegner
@dearkathie
Jan 29 2017 20:19
@bigyankarki you need to add to your css of input outline: none;
@moT01 yeah, I see Provisional headers are shown error when I make a request
Bigyan Karki
@bigyankarki
Jan 29 2017 20:22
@dearkathie wow that worked :D
by the way can anyone tell me the smooth way of transitioning from a search icon to an input field?
cambscoder
@cambscoder
Jan 29 2017 20:22
In the Local Weather Challenge, there is kind of a bug in the whole way it's set up. I'll explain what I mean: 1. Open Weather API is recommended. Now that API works only using http. CodePen only allows the AJAX request when you are on http://codepen.io
  1. in the tutorial for jQuery right before, learners are shown how to use the navigator.geolocation object to find the position of the user. Problem is, that this only works with https. So you can't use both together. Is there maybe an API out there that you can use with https? Or a workaround? Haven't been able to find one.
Chinmaya B
@sharang108
Jan 29 2017 20:33
@TylerMoeller How do I generate key on Weatherunderground?
alpox
@alpox
Jan 29 2017 20:54
@cambscoder That is a relict from before chrome disabled navigator.geolocation for https
they changed that few months ago
cambscoder
@cambscoder
Jan 29 2017 21:09
@alpox yes, that's what it seems like. so now you need to query the ip through ipify or so. could they maybe change it in the course. otherwise people get unnecessarily stuck.
I've now resolved it like this: http://codepen.io/cambscoder/pen/VPrqrL
Ryan
@DoubleTri
Jan 29 2017 21:57
Anyone know why my javaScript/jQuery will run fine in a browser but not in Code Pen? (yes I added jQuery to Code Pen).
cas_dd
@casdidier
Jan 29 2017 22:01

Hello Guys !
I am having issue with Weather API, I m trying to get my city name from the JSON api. But it fails at converting JSON to HTML...

https://codepen.io/ddcas/pen/zNpxMX

Simon Cordova
@gbsimon87
Jan 29 2017 22:08
@casdidier still need help?
alpox
@alpox
Jan 29 2017 22:10
@casdidier When you use getJSON the result is already an object. Just skip this part: obj = JSON.stringify(json);
cas_dd
@casdidier
Jan 29 2017 22:11
@gbsimon87 I will try what @alpox said : P thx
CamperBot
@camperbot
Jan 29 2017 22:11
:cookie: 386 | @gbsimon87 |http://www.freecodecamp.com/gbsimon87
casdidier sends brownie points to @gbsimon87 and @alpox :sparkles: :thumbsup: :sparkles:
:cookie: 754 | @alpox |http://www.freecodecamp.com/alpox
cas_dd
@casdidier
Jan 29 2017 22:12
@alpox actually not working :/
cas_dd
@casdidier
Jan 29 2017 22:18
@gbsimon87 if you could help me : D
Jean Marco Romero
@volkranium
Jan 29 2017 22:20
How did you get your first job???
alpox
@alpox
Jan 29 2017 22:21
@casdidier "json.name" without quotes
just json.name
@casdidier Also you have one time }); too much :-)
@casdidier And in settings -> Javascript you have to quick add jquery (Above bootstrap so you might have to remove that one first
cas_dd
@casdidier
Jan 29 2017 22:29
@alpox mmmh are you sure for the }); more ?
Moisés Man
@moigithub
Jan 29 2017 22:31

@casdidier always check devtools / console
if something doesnt work.. probably have errors...

Mixed Content: The page at 'https://codepen.io/ddcas/pen/zNpxMX?editors=0010' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://api.openweathermap.org/data/2.5/weather?id=3037456&APPID=6a658928bb00556b756c4018538cefbc'. This request has been blocked; the content must be served over HTTPS.

alpox
@alpox
Jan 29 2017 22:35
@casdidier You had one too much
@casdidier But now its ok
@casdidier Just access codepen through http:// instead of https:// and it works
cas_dd
@casdidier
Jan 29 2017 22:40
oooh....
Thanks @moigithub @alpox it was frustrating... , next time i will check more console... but not all errors are understandble for me yet.. : )
CamperBot
@camperbot
Jan 29 2017 22:40
casdidier sends brownie points to @moigithub and @alpox :sparkles: :thumbsup: :sparkles:
:warning: casdidier already gave alpox points
:star2: 2629 | @moigithub |http://www.freecodecamp.com/moigithub
cambscoder
@cambscoder
Jan 29 2017 22:45
Seems like people are running into the http/https codepen problem all the time. Maybe it'd be good if there was a warning at some point in the API chapter. Admins anywhere?
cas_dd
@casdidier
Jan 29 2017 22:46
agreed :) , there must be a section to report problem on the challenge page no?
@cambscoder actually i have checked on forum the error already reported there, we can just upvote the issue so admin takes action later on
Anas Butt
@anas2ab
Jan 29 2017 22:49
is anyone else on the portfolio challenge?
or has completed it?
Dan
@MindWhys
Jan 29 2017 22:49
Is anyone else having problems with the Random Quote Generator?
I couldn't work out why it wasn't putting in the quote when I clicked the button so I cut and pasted the example in and that didn't work either!
@cambscoder what's the http/https problem?
Tyler Moeller
@TylerMoeller
Jan 29 2017 22:56
@MindWhys Do you have a codepen link?
Tyler Moeller
@TylerMoeller
Jan 29 2017 22:57
@cambscoder They need a challenge that explains mixed-content. Many people are not aware that you cannot load HTTP when connected over HTTPS...
https://developers.google.com/web/fundamentals/security/prevent-mixed-content/what-is-mixed-content
MikeSigelakis
@Mikesigelakis
Jan 29 2017 22:57
hello guyz
i need you help on smth
taltmann42
@taltmann42
Jan 29 2017 22:58
@MindWhys You need to add your javascript to the javascript-panel ;)
MikeSigelakis
@Mikesigelakis
Jan 29 2017 22:58
i have started my second project and I have problems with dimension when i change these
any ideas how to overcome this problem
i am newbie :/
Dan
@MindWhys
Jan 29 2017 22:58
@taltmann42 what javascript?
Tyler Moeller
@TylerMoeller
Jan 29 2017 22:58
@MindWhys If you add jQuery to the codepen settings, you have to use the JS Panel. Otherwise, add jQuery to your HTML and put all the <script> tags after your HTML
taltmann42
@taltmann42
Jan 29 2017 22:58
@MindWhys the javascript that's inside the <script> tags
Tyler Moeller
@TylerMoeller
Jan 29 2017 22:58
<div class="container-fluid">
  <div class = "row text-center">
    <h2>Cat Photo Finder</h2>
  </div>
  <div class = "row text-center">
    <div class = "col-xs-12 well message">
      The message will go here
    </div>
  </div>
  <div class = "row text-center">
    <div class = "col-xs-12">
      <button id = "getMessage" class = "btn btn-primary">
        Get Message
      </button>
    </div>
  </div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
  $(document).ready(function() {
    $("#getMessage").on("click", function(){
      // Only change code below this line.
      $(".message").html("Here is the message");
      // Only change code above this line.
    });
  });
</script>
Dan
@MindWhys
Jan 29 2017 23:00
@TylerMoeller I have cut and pasted it into javascript now @taltmann42 thanks
CamperBot
@camperbot
Jan 29 2017 23:00
mindwhys sends brownie points to @tylermoeller and @taltmann42 :sparkles: :thumbsup: :sparkles:
:star2: 1430 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
:cookie: 405 | @taltmann42 |http://www.freecodecamp.com/taltmann42
Dan
@MindWhys
Jan 29 2017 23:00
Why wasn't that made clear in the tutorials?
Tyler Moeller
@TylerMoeller
Jan 29 2017 23:02
@MindWhys The tutorials are just meant to get you started and give you the vocabulary to help you read-search-ask to figure out stuff on your own.
taltmann42
@taltmann42
Jan 29 2017 23:02
@MindWhys hmm right.. well it tells you that the HTML belongs to the HTML tab.. so it's kinda intuitive to add the Javascript to the JS tag
Dan
@MindWhys
Jan 29 2017 23:05
@TylerMoeller @taltmann42 I guess I'll chock it up to a good chance to practise my read-search-ask skills and move on. Thank you both again
CamperBot
@camperbot
Jan 29 2017 23:05
mindwhys sends brownie points to @tylermoeller and @taltmann42 :sparkles: :thumbsup: :sparkles:
:warning: mindwhys already gave tylermoeller points
:warning: mindwhys already gave taltmann42 points
MikeSigelakis
@Mikesigelakis
Jan 29 2017 23:09
@all
@Mikesigelakis
i have started my second project and I have problems with dimension when i change these
any ideas how to overcome this problem
i am newbie :/
taltmann42
@taltmann42
Jan 29 2017 23:11
@Mikesigelakis you should provide us with more information. We don't know what you mean by "this problem", what is happening? what have you tried? a link to the codepen is also necessary to help
taltmann42
@taltmann42
Jan 29 2017 23:20
or not
Gulsvi
@gulsvi
Jan 29 2017 23:21
@Mikesigelakis I'm guessing you mean to make your web page responsive? Check out the bootstrap grid system: http://getbootstrap.com/css/#grid
anapandey
@anapandey
Jan 29 2017 23:58
Hello guys, I am working on the Wikipedia Viewer project and stuck from the very beginning. :( Could anyone please tell how to use Wikipedia's API.