These are chat archives for FreeCodeCamp/HelpFrontEnd

15th
Feb 2017
Gulsvi
@gulsvi
Feb 15 2017 00:00
usually do more than that, but it will slow down when they get harder, so just an average
Adam
@GoingAllTheWayUp
Feb 15 2017 00:01
ok I am about to begin Basic algorithm section
Gulsvi
@gulsvi
Feb 15 2017 00:01
Some are real easy, others are real hard... had to take a break on a couple of them so far
four more basic ones to go
Adam
@GoingAllTheWayUp
Feb 15 2017 00:02
I want to do this in order, i take it you are not?
Gulsvi
@gulsvi
Feb 15 2017 00:02
No, I'm skipping around
Adam
@GoingAllTheWayUp
Feb 15 2017 00:03
ok nice, in life im not lucky getting ahead of myself, i have to go step by step
I might look ahead, don't get me worng
im not a nun
Gulsvi
@gulsvi
Feb 15 2017 00:05
:)
runnerbill75
@runnerbill75
Feb 15 2017 00:08
Trying to create a link to another web page, not working this is what i have <p class="link"><strong>To learn more about Louie Zamperini click</strong><a href="http://www.louiszamperini.net/ target="_blank> here</a></p>
Johnny
@jtan3
Feb 15 2017 00:10
check your ending quotes
runnerbill75
@runnerbill75
Feb 15 2017 00:10
aha thank you
Gulsvi
@gulsvi
Feb 15 2017 00:11
And don't forget mobile users can't click ;)
Johnny
@jtan3
Feb 15 2017 00:11
is anyone doing the beta fcc?
Gulsvi
@gulsvi
Feb 15 2017 00:12
beta fcc?
Gulsvi
@gulsvi
Feb 15 2017 00:13
fcc always reminds me of something else lol
I didn't know about that though, thanks @jtan3 I'll check it out
CamperBot
@camperbot
Feb 15 2017 00:13
:cookie: 306 | @jtan3 |http://www.freecodecamp.com/jtan3
skycoder01 sends brownie points to @jtan3 :sparkles: :thumbsup: :sparkles:
Jakov Horvat
@Yaaqovv
Feb 15 2017 00:19
hey
Thomas Mullen
@t-mullen
Feb 15 2017 00:20
Beta fcc looks great!
Johnny
@jtan3
Feb 15 2017 00:22
is flexbox worth learning or is bootstrap better?
Tony
@FreakishLancer
Feb 15 2017 00:39
Oh man...I'ved pushed myself into a corner. Can anyone help me find out why my Tic-Tac-Toe game is making the computer (when it is X) make two moves at the beginning of a new game if you win the previous one? http://codepen.io/Freaklancer/pen/xgMbPm
runnerbill75
@runnerbill75
Feb 15 2017 00:51
Ok i am trying to decrease amount of space between <p> and a link element at the bottom of my web page. I have tried using margin-top, has not worked for some reason...
Johnny
@jtan3
Feb 15 2017 00:55
@runnerbill75 try margin-bottom?
Jakov Horvat
@Yaaqovv
Feb 15 2017 00:56
hy
Gulsvi
@gulsvi
Feb 15 2017 00:57
@runnerbill75 put your <p> and link element in a separate <div class="row"></div> and reduce the bottom margin on your .col-xs-4
runnerbill75
@runnerbill75
Feb 15 2017 00:58
ok thank you @SkyCoder01
CamperBot
@camperbot
Feb 15 2017 00:58
:cookie: 200 | @skycoder01 |http://www.freecodecamp.com/skycoder01
runnerbill75 sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
Tony
@FreakishLancer
Feb 15 2017 01:13
Okay, I fixed my code, but it still looks messy. Oh well. :shrug:
VilfredSikker
@VilfredSikker
Feb 15 2017 01:14
Hey people I need help. I'm a rookie and trying to create my own webside. But I can't figure out why my pages are overlapping. If you look down at the page to the Concept page it gets overlapped by a new page. The page overlapping is the "Offering" page which should be a whole new site. What is going wrong? https://codepen.io/VilfredSikker/pen/pRYjgm
lifelernner
@lifelernner
Feb 15 2017 01:39
so I have started on the Tribute Page and I have a question about the rules dos it have to be only in html or can I mix other languages in it like css? (don`t know if this is the right place to ask and sorry for the way written it is not my 1st language )
VilfredSikker
@VilfredSikker
Feb 15 2017 01:45
You should use css too :)
But only html and css
lifelernner
@lifelernner
Feb 15 2017 01:47
@VilfredSikker thx:)
CamperBot
@camperbot
Feb 15 2017 01:47
:cookie: 249 | @vilfredsikker |http://www.freecodecamp.com/vilfredsikker
lifelernner sends brownie points to @vilfredsikker :sparkles: :thumbsup: :sparkles:
Rennie Bevineau
@Renniesb
Feb 15 2017 01:54
I've centered my image inside my div now how do I center text within that image?
Jonathan Lifschitz
@jonylif
Feb 15 2017 02:10
@Renniesb width and margin auto, or text-align center
Rennie Bevineau
@Renniesb
Feb 15 2017 02:11
Thank you @jonylif but it is a little more complicated than that I think. Here is an image that shows what I am talking about
CamperBot
@camperbot
Feb 15 2017 02:11
renniesb sends brownie points to @jonylif :sparkles: :thumbsup: :sparkles:
:cookie: 72 | @jonylif |http://www.freecodecamp.com/jonylif
Rennie Bevineau
@Renniesb
Feb 15 2017 02:11
blob
First there is a big image than a smaller image and than within it smaller images and text
The white image must be centered withen the larger image and the other content centered within the white image and it must all be responsive
white image must adjust its size with screen dimensions
Jonathan Lifschitz
@jonylif
Feb 15 2017 02:13
try with flexbox
do you now how?
Rennie Bevineau
@Renniesb
Feb 15 2017 02:14
No
Jonathan Lifschitz
@jonylif
Feb 15 2017 02:16
all the item that i see there, the logo, the text and the button, all that is inside a div?
Rennie Bevineau
@Renniesb
Feb 15 2017 02:17
I am not using flexbox it is using translate
Yes they are all inside a div
runnerbill75
@runnerbill75
Feb 15 2017 02:18
Hello, I am wondering if someone can take look at my pen and help me figure out how to align text and link at bottom of page with paragraph above it. https://codepen.io/runnerbill75/full/WRYzoQ/
Jonathan Lifschitz
@jonylif
Feb 15 2017 02:20
@Renniesb you are using bootstrap, there might be something of that, i dont use bootstrap
World
@IamWorld
Feb 15 2017 02:21
@runnerbill75 have you tried text-center
Jonathan Lifschitz
@jonylif
Feb 15 2017 02:21
It is better to learn pure html and css when you learn to program for the first time
World
@IamWorld
Feb 15 2017 02:21
i mean the class: " text-center"
runnerbill75
@runnerbill75
Feb 15 2017 02:21
I have not, i will try that out
World
@IamWorld
Feb 15 2017 02:22
i don't remembre if is class or style
Rennie Bevineau
@Renniesb
Feb 15 2017 02:22
I could do it the pure way
Jonathan Lifschitz
@jonylif
Feb 15 2017 02:22
@IamWorld i tried, it doesnt work, niether margin auto
Rennie Bevineau
@Renniesb
Feb 15 2017 02:22
if that helps
World
@IamWorld
Feb 15 2017 02:22
and remember its with equial sign
=
equal
Rennie Bevineau
@Renniesb
Feb 15 2017 02:22
Either way I just want to get it done. I will do it either or
just looking for best solution
and I am using both
img-responsive class is useful
so are columns
and containers
and rows
World
@IamWorld
Feb 15 2017 02:24
ill search how i did it
@runnerbill75 @jonylif here is how i did it
<h1 class="text-primary text-center" id=Head>Rugby</h1>
no thats de old, sorry
here's the css file

.titletext {
display: flex;
justify-content: center;
align-content: center;
margin: 190px 0;
}

h2 {
position: absolute;
margin-top: 150px;
}

Rennie Bevineau
@Renniesb
Feb 15 2017 02:33
Ok, that works. I also just read an article about flexbox
and centering
runnerbill75
@runnerbill75
Feb 15 2017 02:33
ok thank you for your help @IamWorld
CamperBot
@camperbot
Feb 15 2017 02:33
runnerbill75 sends brownie points to @iamworld :sparkles: :thumbsup: :sparkles:
:cookie: 120 | @iamworld |http://www.freecodecamp.com/iamworld
Rennie Bevineau
@Renniesb
Feb 15 2017 02:33
I will use media queries to have the text adjust
size
Jonathan Lifschitz
@jonylif
Feb 15 2017 02:36
great @Renniesb
Rennie Bevineau
@Renniesb
Feb 15 2017 02:43
@jonylif Thanks
CamperBot
@camperbot
Feb 15 2017 02:43
:warning: renniesb already gave jonylif points
renniesb sends brownie points to @jonylif :sparkles: :thumbsup: :sparkles:
World
@IamWorld
Feb 15 2017 02:54
NO proble glad it worked
Tanya Gamarian
@ohtanya
Feb 15 2017 03:02
hi everyone. i want to build a simple ‘to do list’ web app. i don’t know much about databases though, can anyone recommend one to look into for something like this?
Darlene Tate
@Darlene1
Feb 15 2017 03:06
I can't get my to be responsive. What am I doing wrong? Help! http://codepen.io/D-Pens/pen/vgVgYP
Mihai Veronica
@VeronicaM
Feb 15 2017 03:07
@Darlene1 you need to use media queries to make it responsive or percentages instead of pixels for your elements sizes
Mihai Veronica
@VeronicaM
Feb 15 2017 03:09
@ohtanya check this out for your todo list app http://todomvc.com/, mongo db is an easy to get started with db
Tanya Gamarian
@ohtanya
Feb 15 2017 03:10
thanks @VeronicaM !
CamperBot
@camperbot
Feb 15 2017 03:10
ohtanya sends brownie points to @veronicam :sparkles: :thumbsup: :sparkles:
:cookie: 318 | @veronicam |http://www.freecodecamp.com/veronicam
Mihai Veronica
@VeronicaM
Feb 15 2017 03:14
you're welcome @ohtanya
Jack Lyons
@JackEdwardLyons
Feb 15 2017 03:18
thanks @taltmann42
CamperBot
@camperbot
Feb 15 2017 03:18
jackedwardlyons sends brownie points to @taltmann42 :sparkles: :thumbsup: :sparkles:
:cookie: 519 | @taltmann42 |http://www.freecodecamp.com/taltmann42
Jack Lyons
@JackEdwardLyons
Feb 15 2017 03:18
ill give it a try now :)
Jack Lyons
@JackEdwardLyons
Feb 15 2017 03:42
http://codepen.io/JackEdwardLyons/full/JEzjMJ/ getting there, its a bit buggy...
Darlene Tate
@Darlene1
Feb 15 2017 04:25
Thanks @VeronicaM and @jtan3, I'll try it!
CamperBot
@camperbot
Feb 15 2017 04:25
darlene1 sends brownie points to @veronicam and @jtan3 :sparkles: :thumbsup: :sparkles:
:cookie: 319 | @veronicam |http://www.freecodecamp.com/veronicam
:cookie: 307 | @jtan3 |http://www.freecodecamp.com/jtan3
Albert L. C.
@sirus3020
Feb 15 2017 04:31
guys. halp?
Brandon Achu
@bachu-dev
Feb 15 2017 04:32
@JackEdwardLyons looks really good!
Albert L. C.
@sirus3020
Feb 15 2017 04:33
anyone can help with the twitchTV api challenge?
Johnny
@jtan3
Feb 15 2017 04:35
i can try
try clicking ALL multiple times.
Johnny
@jtan3
Feb 15 2017 04:36
ok?
Albert L. C.
@sirus3020
Feb 15 2017 04:37
online and offline is changing everytime
Drsquidy
@Drsquidy
Feb 15 2017 04:38
hey guys im trying to get the Gif in my codepen to be centered on the page but im struggling to do it, can someone help? http://codepen.io/DrSquidy/pen/ggEreR
Albert L. C.
@sirus3020
Feb 15 2017 04:38
use margin-left?
or try using text-center on the container div instead.
Johnny
@jtan3
Feb 15 2017 04:42
@sirus3020 sorry. I'm not sure why that's happening.
@sirus3020 http://codepen.io/jtan3/pen/GqPgOp I got my all button to work but not the others
Drsquidy
@Drsquidy
Feb 15 2017 04:43
That worked Albert! the text-center in the container div. thank you
Albert L. C.
@sirus3020
Feb 15 2017 04:46
@jtan3 $('#offline').click(function(){
if(mode == 'OFFLINE'){
$('#streamers')
nvm
Johnny
@jtan3
Feb 15 2017 04:48
@sirus3020 it only gets one of the offline accounts not all of them
@sirus3020 if you use $('#all').click(function(all){ $('#statusList').toggle();
it stays in place
Johnny
@jtan3
Feb 15 2017 04:56
@sirus3020 i don't think you should use .appendTo
@sirus3020 https://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_html_appendto it keeps adding each time i click the button
Albert L. C.
@sirus3020
Feb 15 2017 04:59
I have $('#all').click(function(){
$('#list').html('')
$('#statusList').html('')
so that it empties every time
Johnny
@jtan3
Feb 15 2017 05:00
oh
@sirus3020 maybe try it with out that? $('#all').click(function(){ $('#list').html('') $('#statusList').html('') ?
maybe when it empties it each time it changes the order too?
eswhy
@eswhy
Feb 15 2017 05:11
can someone tell me why my <UL> is not displaying in my nav bar? I have made nav bars before and for some reason cant get this one to get inline.http://codepen.io/eswhy/pen/KaEzZB
despiseddemon
@despiseddemon
Feb 15 2017 05:33
can you guys tell me how this looks so far for my first time, its the build a tribute page http://codepen.io/despiseddemon/pen/mRoPEE
codingcorey
@codingcorey
Feb 15 2017 05:37
how can i remove inline white space around my whole image
Albert L. C.
@sirus3020
Feb 15 2017 05:44
what do you mean by inline white space
codingcorey
@codingcorey
Feb 15 2017 05:45
inline might not be the right word for it , but around the image there is white space on both the left and right
Albert L. C.
@sirus3020
Feb 15 2017 05:47
try using a <div><img></div>
despiseddemon
@despiseddemon
Feb 15 2017 05:47
http://codepen.io/despiseddemon/pen/mRoPEE what you guys think so far
Albert L. C.
@sirus3020
Feb 15 2017 05:47
set an id for the div then change background color of div
@despiseddemon looking great. try formatting it to make it readable.
despiseddemon
@despiseddemon
Feb 15 2017 05:48
its not readable?
Albert L. C.
@sirus3020
Feb 15 2017 05:49
well, no one wants to read a giant wall of text. heheh
codingcorey
@codingcorey
Feb 15 2017 05:49
@sirus3020 ,that worked for the most part but now there is a full width white bar across the top of the image
Albert L. C.
@sirus3020
Feb 15 2017 05:52
try margin-top: 0px for the alpha
codingcorey
@codingcorey
Feb 15 2017 05:52
still there
Albert L. C.
@sirus3020
Feb 15 2017 05:53
i think ids' are case sensitive
codingcorey
@codingcorey
Feb 15 2017 05:54
maybe, still didnt remove it though
Johnny
@jtan3
Feb 15 2017 05:54
@codingcorey if you want the entire page to have a background wrap all your html in a <body></body> tag
@codingcorey and add a background color
codingcorey
@codingcorey
Feb 15 2017 05:55
yeah , there we go , thanks you both for the help
MacGuffin
@MacGuffin1990
Feb 15 2017 06:52
hello can anyone help me .i am doing simon's game .i make a "addClass" to some div but it dose not work , i can not find why it dose not work ...i need some guys helphttp://codepen.io/MacGuffin1990/pen/PWLPLL?editors=0110
Samuel Kachisa
@Rizamoyi
Feb 15 2017 08:39
hey guys having a problem fixing my image as a thumbnail..it cant fit correctly inside the jumbotron div. Help me out anyone
Millen812
@Millen812
Feb 15 2017 09:01
Any experts on typo3 available?
Jack Lyons
@JackEdwardLyons
Feb 15 2017 09:03
can you show where in your code @MacGuffin1990
Clyde Lobo
@oppiniated
Feb 15 2017 09:06
@MacGuffin1990 There is no addClass in the code
also line 51 $(lte).html("opc"); should be $("#"+lte).html("opc");
MacGuffin
@MacGuffin1990
Feb 15 2017 09:07
@JackEdwardLyons @oppiniated i have changed my code
@oppiniated @JackEdwardLyons thanks
CamperBot
@camperbot
Feb 15 2017 09:07
macguffin1990 sends brownie points to @oppiniated and @jackedwardlyons :sparkles: :thumbsup: :sparkles:
:cookie: 575 | @oppiniated |http://www.freecodecamp.com/oppiniated
:cookie: 346 | @jackedwardlyons |http://www.freecodecamp.com/jackedwardlyons
Samuel Kachisa
@Rizamoyi
Feb 15 2017 09:13
guys how can i insert a thumbnail image on bootstrap
Uladzimir
@mrpuer
Feb 15 2017 09:14
@Rizamoyi maybe this help you http://getbootstrap.com/css/#images
Jack Lyons
@JackEdwardLyons
Feb 15 2017 09:32
i totally re did my spotify search app using bootstrap material design, what do you guys think?
kirbyedy
@kirbyedy
Feb 15 2017 09:36
@JackEdwardLyons looks nice, the only problem is that block building because of the image sizes
I guess its because they have different sizes
looks like this on my screen
Jack Lyons
@JackEdwardLyons
Feb 15 2017 09:37
yeah, i need some sort of masonry layout, you think? @kirbyedy
kirbyedy
@kirbyedy
Feb 15 2017 09:37
Screen Shot 2017-02-15 at 11.36.32.png
Cato Myhre
@Zalmez
Feb 15 2017 09:37
heyo! I need some help giving my tribute page a background. currently it just jumps above the bootstrap and stays there
kirbyedy
@kirbyedy
Feb 15 2017 09:37
yes, masonry should fix that
@boredgamerz I dont think thats the right place where you should put it
Cato Myhre
@Zalmez
Feb 15 2017 09:39
ok?
Sonja
@sonjaSch
Feb 15 2017 09:40
hello to everyone :smile:
How can i use glyphicons on codepen?
Cato Myhre
@Zalmez
Feb 15 2017 09:42
@kirbyedy , kinda fixed it kinda not
@boredgamerz well the placing is better, but I am not sure why do you want it there, I mean its not going to be visible anyways
the text will cover it
and the box
Sonja
@sonjaSch
Feb 15 2017 09:45
@kirbyedy thx
CamperBot
@camperbot
Feb 15 2017 09:45
sonjasch sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1786 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Cato Myhre
@Zalmez
Feb 15 2017 09:45
hmm, mby I can try to make the box transparent, change the color of the text etc and make it fit the whole page :thought_balloon:
Abhijith Somaraj
@abhijithsomaraj
Feb 15 2017 09:47
hi.. how can i make my unordered list in a box
https://codepen.io/abhijithsomaraj/pen/oBVYGX
Samuel Kachisa
@Rizamoyi
Feb 15 2017 09:50
@mrpuer thanks it really helped.
CamperBot
@camperbot
Feb 15 2017 09:50
rizamoyi sends brownie points to @mrpuer :sparkles: :thumbsup: :sparkles:
:cookie: 265 | @mrpuer |http://www.freecodecamp.com/mrpuer
Cato Myhre
@Zalmez
Feb 15 2017 09:51
@kirbyedy figured it out :D I think I should just have some kind of border to separate it from everything
kirbyedy
@kirbyedy
Feb 15 2017 09:52
:thumbsup:
@abhijithsomaraj
<ul>
  <li>first item</li>
  <li>second item</li>
  <li>third item</li>
</ul>
Abhijith Somaraj
@abhijithsomaraj
Feb 15 2017 09:57
ohhh...i forgot about that..
thanks @kirbyedy
CamperBot
@camperbot
Feb 15 2017 09:57
abhijithsomaraj sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1787 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Abhijith Somaraj
@abhijithsomaraj
Feb 15 2017 09:57
can i add a box around just that list
Tom Frenken
@Blackioo
Feb 15 2017 09:59
how do i center the list instead of only the text? http://codepen.io/blackioo/pen/KaGqxy?editors=1000#0
Rimi.
@Codevotee
Feb 15 2017 10:05
@Blackioo do you want it to appear like this?
blob
Tom Frenken
@Blackioo
Feb 15 2017 10:07
No, I want the list to be inline but centered :D
Rimi.
@Codevotee
Feb 15 2017 10:08
blob

@Blackioo you can do this in your CSS:

ul {
    margin: auto;
    text-align: left;
    width: 60%;
}

then change the width to what you want

R^2
@iriquoi
Feb 15 2017 10:08
is anyone having trouble adding gliphicon's to their pages????
Tom Frenken
@Blackioo
Feb 15 2017 10:08
thanks :D @APRim05
CamperBot
@camperbot
Feb 15 2017 10:08
blackioo sends brownie points to @aprim05 :sparkles: :thumbsup: :sparkles:
:cookie: 545 | @aprim05 |http://www.freecodecamp.com/aprim05
Rimi.
@Codevotee
Feb 15 2017 10:09
this centers the list, moves the text to the left, then because the list takes full width you wont notice a difference unless you change the width to something else instead of 100% @Blackioo
np
@iriquoi what's the problem?
@iriquoi did you include bootstrap in your file?
R^2
@iriquoi
Feb 15 2017 10:12
yes I did but I added it to the html setting because for some reason bootstrap 4 some times doesnt work
Richard Stolp
@RichardStolp
Feb 15 2017 10:12
hey, I'm working on the the quote generator project right now, and I'm running into an issue. I'm using the api from forismatic.com which seems to work fine when running it in Atom but I get an "'Access-Control-Allow-Origin' header is present on the requested resource." error when running it on chrome or firefox. What is this error?
R^2
@iriquoi
Feb 15 2017 10:13
the problem is that when I call the gliphicon-search for example I just get an empty box
Rimi.
@Codevotee
Feb 15 2017 10:13
@iriquoi show your code
R^2
@iriquoi
Feb 15 2017 10:13
one sec
<div class="container-fluid bg-2 text-center">
   <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
   <a class="btn btn-default btn-lg" href="#"><span class="gliphicon glyphicon-globe"></span></a>
</div>
every thing works, just no ghiphicon?
gliphicon*
Rimi.
@Codevotee
Feb 15 2017 10:15
you spelled the first gliphicon class wrong
it should be glyphicon @iriquoi
R^2
@iriquoi
Feb 15 2017 10:16
lol Thanks @APRim05
CamperBot
@camperbot
Feb 15 2017 10:16
iriquoi sends brownie points to @aprim05 :sparkles: :thumbsup: :sparkles:
:cookie: 546 | @aprim05 |http://www.freecodecamp.com/aprim05
Rimi.
@Codevotee
Feb 15 2017 10:16
np :D
R^2
@iriquoi
Feb 15 2017 10:16
my bad its 2am :sleepy:
buiphuking
@buiphuking
Feb 15 2017 10:25
anyone good at wordpress, i want to ask something??/
playingwithinfinity
@playingwithinfinity
Feb 15 2017 10:27
Why isn't my isWin() function working? Why doesn't it display anything when you select all of the first row? http://codepen.io/jimpix/pen/vgVrRa
Adel
@AdelMahjoub
Feb 15 2017 10:35
@playingwithinfinity you are not changing board[] values on the tick function
playingwithinfinity
@playingwithinfinity
Feb 15 2017 10:35
I am
@AdelMahjoub
Adel
@AdelMahjoub
Feb 15 2017 10:36
@playingwithinfinity add this to the tick function and it will work
var index = $(this).attr('id')
      board[index] = currentTurn
@playingwithinfinity you are changing the innerHTML values, but you are testing board values
playingwithinfinity
@playingwithinfinity
Feb 15 2017 10:37
Oh, I get it.
rugano
@rugano
Feb 15 2017 10:42
Hello fellow campers.How do i put a small line between quoted text and the person who spoke? <blockquote><p>"Margaret Thatcher was the iron lady.",/p>,footer><cite>A Soviet journalist</cite></footer></blockquote>
Tiboski
@Tiboski
Feb 15 2017 10:59
can anyone help me to set a picture as background to my portfolio in codepen?
i try'd everything i found online... nothing worked.
thanks for your time
Uladzimir
@mrpuer
Feb 15 2017 11:05
@Tiboski add to CSS
'''
body {
background-color: #CCFFCC;
background: url(http://site.com/image.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
'''
CamperBot
@camperbot
Feb 15 2017 11:05
:bulb: to format code use backticks! ``` more info
Uladzimir
@mrpuer
Feb 15 2017 11:06
body {
background-color: #CCFFCC;
background: url(http://site.com/image.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
Tiboski
@Tiboski
Feb 15 2017 11:09
ok ill try it right away thank u
Tiboski
@Tiboski
Feb 15 2017 11:15
@mrpuer its not working
Invalid CSS after "#CCFFCC": expected expression (e.g. 1px, bold), was ";"
Uladzimir
@mrpuer
Feb 15 2017 11:18
show your CSS code please
Tiboski
@Tiboski
Feb 15 2017 11:19
body {
background-color: #CCFFCC;
background: url(http://more-sky.com/data/out/8/IMG_246013.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
i started fresh so
Uladzimir
@mrpuer
Feb 15 2017 11:22
you get this error in codepen?
Tiboski
@Tiboski
Feb 15 2017 11:22
yes
Uladzimir
@mrpuer
Feb 15 2017 11:25
in Pen Settings check CSS Preprocessor
select None
Tiboski
@Tiboski
Feb 15 2017 11:29
@mrpuer done it, but aint working
Millen812
@Millen812
Feb 15 2017 11:29
@Tiboski try setting heigth: 1000px;
Uladzimir
@mrpuer
Feb 15 2017 11:30
if remove background-color: #CCFFCC; line?
Tiboski
@Tiboski
Feb 15 2017 11:30
both did not work
Uladzimir
@mrpuer
Feb 15 2017 11:31
Invalid CSS after...?
Tiboski
@Tiboski
Feb 15 2017 11:32
nope that is gone now
Millen812
@Millen812
Feb 15 2017 11:32
your link is wrong
or not
strange
Tiboski
@Tiboski
Feb 15 2017 11:33
this is my link
Uladzimir
@mrpuer
Feb 15 2017 11:34
this link redirect me to *html page
Millen812
@Millen812
Feb 15 2017 11:34
yeah that is what I meant
I used another random picture from google and it worked
Tiboski
@Tiboski
Feb 15 2017 11:35
ok ill try that
@Millen812 @mrpuer u guys are great! thank u it worked
CamperBot
@camperbot
Feb 15 2017 11:36
tiboski sends brownie points to @millen812 and @mrpuer :sparkles: :thumbsup: :sparkles:
:cookie: 220 | @millen812 |http://www.freecodecamp.com/millen812
:cookie: 266 | @mrpuer |http://www.freecodecamp.com/mrpuer
Millen812
@Millen812
Feb 15 2017 11:36
np mate
0livier1O1
@0livier1O1
Feb 15 2017 11:37
Hi guys! So here is my problem, I finished (more or less) my random Quote generator, but I don’t want the button tweet to work if the person hasn’t pressed « New quote » first. So in the JS, I added an if statement that you can see, but it doesn’t seem to work. Any help/comments appreciated :smile: http://codepen.io/0livier1O1/full/WRmNPN/
Matthew
@Krimsonmedic
Feb 15 2017 11:43
ok, I'm so stuck..on the local weather project
I'm just having a brain meltdown. I've found the API and signed up. got my API key... No idea how to begin to call the API, let alone display it's output
Clyde Lobo
@oppiniated
Feb 15 2017 11:45
@0livier1O1 I do not see any if statement
h1tag
@h1tag
Feb 15 2017 11:56
@Krimsonmedic use getJSON to get the response from the API
Matthew
@Krimsonmedic
Feb 15 2017 11:58
@fortMaximus so....
$.getJSON("/json/cats.json", function(json) {
$(".message").html(JSON.stringify(json));
});
would I just replace the /cats with the openweather api
h1tag
@h1tag
Feb 15 2017 11:59
yup
Matthew
@Krimsonmedic
Feb 15 2017 11:59
$.getJSON("/json/api.openweathermap.org/data/2.5/weather?lat=35&lon=139.json", function(json) {
$(".message").html(JSON.stringify(json));
});
like that?
h1tag
@h1tag
Feb 15 2017 12:00
without the /json part
I think
Matthew
@Krimsonmedic
Feb 15 2017 12:00
$.getJSON("/api.openweathermap.org/data/2.5/weather?lat=35&lon=139.json", function(json) {
$(".message").html(JSON.stringify(json));
});
h1tag
@h1tag
Feb 15 2017 12:02
and the 1st /
remove
Matthew
@Krimsonmedic
Feb 15 2017 12:02
ok
h1tag
@h1tag
Feb 15 2017 12:02
but I think there's a problem with openweather API on codepen
Matthew
@Krimsonmedic
Feb 15 2017 12:03
so...it wont work regardless?
h1tag
@h1tag
Feb 15 2017 12:05
you can try, but if it didn't, here's the one I used: https://www.apixu.com/
Matthew
@Krimsonmedic
Feb 15 2017 12:06
ty @fortMaximus
CamperBot
@camperbot
Feb 15 2017 12:06
:cookie: 399 | @fortmaximus |http://www.freecodecamp.com/fortmaximus
krimsonmedic sends brownie points to @fortmaximus :sparkles: :thumbsup: :sparkles:
Tiboski
@Tiboski
Feb 15 2017 12:11
@mrpuer are u still there mate?
@Millen812 or u mate?
Joris Labie
@labiej
Feb 15 2017 12:14
@Krimsonmedic Are you using codepen? Can you share it so we can troubleshoot faster
Matthew
@Krimsonmedic
Feb 15 2017 12:18
I am, but I didn't have anything written outside of my HTML layout
kirbyedy
@kirbyedy
Feb 15 2017 12:20
@Krimsonmedic that api call is definitely wrong
Millen812
@Millen812
Feb 15 2017 12:23
@Tiboski I am, whats up?
Tiboski
@Tiboski
Feb 15 2017 12:41
@Millen812 found it out myself, thanks for the reply tho
CamperBot
@camperbot
Feb 15 2017 12:41
tiboski sends brownie points to @millen812 :sparkles: :thumbsup: :sparkles:
:cookie: 221 | @millen812 |http://www.freecodecamp.com/millen812
Millen812
@Millen812
Feb 15 2017 12:42
@Tiboski no problem, if you need any help just whisper me in privat
Tiboski
@Tiboski
Feb 15 2017 12:42
will do
h1tag
@h1tag
Feb 15 2017 12:47
@Krimsonmedic oh, yea without the .json too
rodrigode
@rodrigode
Feb 15 2017 12:53
hi there, would someone help me with a newbie question?
i'm finishing my first project and i can't find how to make the header to be responsive while being centered-aligned
https://codepen.io/rdrgde/pen/ggqPVg?editors=1100
Micah Lewis
@EastML
Feb 15 2017 13:01
I haven't pinpointed the exact reason for your problem for sure, but anything past h6 just defaults to normal font
rodrigode
@rodrigode
Feb 15 2017 13:02
@EastML sorry, i'm not following
Micah Lewis
@EastML
Feb 15 2017 13:05
Headers only go from h1 to h6
kirbyedy
@kirbyedy
Feb 15 2017 13:06
@rodrigode you used <h7> <h8> and <h10> that does not exist
you have to use h1 to h6 as @EastML said
rodrigode
@rodrigode
Feb 15 2017 13:13
oh lord! of course, sry about that, guys
i edited it and tried to change it to look like reponsevely following the window resizing... it still doesn't...
https://codepen.io/rdrgde/pen/ggqPVg?editors=1100
(sry if it sounds stupid, it's the only thing to finish this project and it seems that i'm not typing correctly for what i should be looking for on google...)
PRADEEP YADAV
@Flosolver
Feb 15 2017 13:48
can any one help my get the image and the caption with it to the center. https://codepen.io/flosolver/pen/jyJBKB/
Clyde Lobo
@oppiniated
Feb 15 2017 13:52
@Flosolver You can try this .container { text-align: center; }
PRADEEP YADAV
@Flosolver
Feb 15 2017 13:56
thanx @oppiniated
CamperBot
@camperbot
Feb 15 2017 13:56
flosolver sends brownie points to @oppiniated :sparkles: :thumbsup: :sparkles:
:cookie: 577 | @oppiniated |http://www.freecodecamp.com/oppiniated
PRADEEP YADAV
@Flosolver
Feb 15 2017 14:00
@oppiniated can you help getting bootstrap "well" in the caption . what i'm doing wrong <div class="caption well">Dennis M. Ritchie, developer of C programming language and Co-developer of UNIX OS.</div>
any suggestion or opinions?
kirbyedy
@kirbyedy
Feb 15 2017 14:06
@DavidRadivojevic yea, center the caption under the picture
not responsive ?
this is ugly
put a dash after the year, separate it from the text
Screen Shot 2017-02-15 at 16.06.59.png
David Radivojevic
@DavidRadivojevic
Feb 15 2017 14:08
aaaaah ovo sam uradio za pola sata
nisam ni primetio da nisam razdvojio godine
Ghulam Shabir
@ghulamshabir
Feb 15 2017 14:10
google translate: I did this for half an hour
I did not even notice that I have not separated the :smile:
David Radivojevic
@DavidRadivojevic
Feb 15 2017 14:12
haha
how'd you know which language we were speaking?
PRADEEP YADAV
@Flosolver
Feb 15 2017 14:13
google auto detect language @DavidRadivojevic
Ghulam Shabir
@ghulamshabir
Feb 15 2017 14:13
google detected it automatically it is bosnian right
David Radivojevic
@DavidRadivojevic
Feb 15 2017 14:15
serbian
close
Ghulam Shabir
@ghulamshabir
Feb 15 2017 14:15
oh I see
Fabio Di Pane
@saylos
Feb 15 2017 14:27
Hi guys, what do you think about my Wikipedia Viewer?
http://codepen.io/saylos/full/ygEYZd/
Ken Haduch
@khaduch
Feb 15 2017 14:32
@saylos - your wikipedia page looks really nice! One thing that I would like it to do is trigger the search when you hit the "Enter" key - a minor thing, but you get used to having that happen. Overall, though, nice design, the background is cool!
Fabio Di Pane
@saylos
Feb 15 2017 14:35
@khaduch really thanks! I tryied to do that, but it works only if I leave the "Go!" button, if I cancel it the Enter doesn't work.
CamperBot
@camperbot
Feb 15 2017 14:35
saylos sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 2482 | @khaduch |http://www.freecodecamp.com/khaduch
Fabio Di Pane
@saylos
Feb 15 2017 14:36
how should I do?
Zhanibek
@zhann1982
Feb 15 2017 14:40
Hello Everyone! Next piece of code doesn't work in my google chrome browser, but it works in firefox browser.
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
var latNum = Math.round(position.coords.latitude), lonNum = Math.round(position.coords.longitude);
$("#weather-box").html("latitude: " + position.coords.latitude + "<br>longitude: " + position.coords.longitude);
});
}
Can someone give me an advice how to fix this
h1tag
@h1tag
Feb 15 2017 14:43
@zhann1982 try checking location setting in chrome
Abhijith Somaraj
@abhijithsomaraj
Feb 15 2017 14:56
how can i align the last 2 lists as that of the 1st one
https://codepen.io/abhijithsomaraj/pen/oBVYGX
Atharva Pandey
@atharvajava
Feb 15 2017 14:58
https://codepen.io/atharvajava/pen/YNRBBa?editors=0010 can anyone help me on with my js throwing error ??
@abhijithsomaraj you forgot to close UL tag for the first one
<p>With Motherjane
<ul>
<li>Insane Biography - 2003</li>
<li>Maktub - 2008</li>
</ul>
rodrigode
@rodrigode
Feb 15 2017 15:09
@atharvajava can u help me getting bootstrap responsive with that header, pls?
https://codepen.io/rdrgde/pen/ggqPVg?editors=1100
Zhanibek
@zhann1982
Feb 15 2017 15:09
@fortMaximus I've changed to "Allow to get geolocation always"
h1tag
@h1tag
Feb 15 2017 15:09
did it work?
@zhann1982
Atharva Pandey
@atharvajava
Feb 15 2017 15:10
@rodrigode responsive header as in you mean you want the header to shrink as you go down on screen
rodrigode
@rodrigode
Feb 15 2017 15:11
@atharvajava yes(:
Atharva Pandey
@atharvajava
Feb 15 2017 15:12
@rodrigode try to use grid for it read about grid on bootstrap documentation it will help you for future as well in manyways
Abhijith Somaraj
@abhijithsomaraj
Feb 15 2017 15:12
@atharvajava ohh.. yess... thanks man :smile:
CamperBot
@camperbot
Feb 15 2017 15:12
abhijithsomaraj sends brownie points to @atharvajava :sparkles: :thumbsup: :sparkles:
:cookie: 300 | @atharvajava |http://www.freecodecamp.com/atharvajava
Alan
@alant90
Feb 15 2017 15:13
can someone help me with fetching api in an angular app?
Atharva Pandey
@atharvajava
Feb 15 2017 15:13
@rodrigode i can do it for you but you wont learn it if i will type the stuff XO
Zhanibek
@zhann1982
Feb 15 2017 15:13
@fortMaximus No . I also tryed "by request". it doesn't work either
Atharva Pandey
@atharvajava
Feb 15 2017 15:14
@abhijithsomaraj np
Paul Freeman
@pfreema1
Feb 15 2017 15:17
var global_box_shadow = '"box-shadow", ".25px .25px 10.75px .6px black"';
$(".box1").css(global_box_shadow);
in javascript that should work right?
when i print global_box_shadow it prints the string
but passing the string into the function doesn't work for some reason
ZenZate
@ZenZate
Feb 15 2017 15:18
hi
Paul Freeman
@pfreema1
Feb 15 2017 15:18
im using the single quote then double quote syntax to include the quotation marks in the string
ZenZate
@ZenZate
Feb 15 2017 15:18
JUst wondering
Alan
@alant90
Feb 15 2017 15:18
i'm having trouble using Angular to pull the API data from openweathermap and using it in the same way as the JSON data that i just copied into a local variable http://codepen.io/alant90/pen/egPpLj
how to fetch the data in the correct way?
S André Leal
@sergandrleal
Feb 15 2017 15:22
https://codepen.io/sergandrleal/full/OWqjNK hey there guys, what do you think about my Tribute Page?
h1tag
@h1tag
Feb 15 2017 15:22
@zhann1982 can you show your codepen?
Ken Haduch
@khaduch
Feb 15 2017 15:25
@saylos - I think that what you want to do is set up the input element to handle keyup events, and recognize that a character that is entered is a newline or "enter" key. Then you have to refactor your code a little so that the function that actually performs the search (the callback from your button click) can be called from the keyup handler or the button click - just make it a named function and call it from within either of the two possible entry points?
rodrigode
@rodrigode
Feb 15 2017 15:32
@atharvajava no worries, thanks(:
CamperBot
@camperbot
Feb 15 2017 15:32
rodrigode sends brownie points to @atharvajava :sparkles: :thumbsup: :sparkles:
:cookie: 301 | @atharvajava |http://www.freecodecamp.com/atharvajava
Fabio Di Pane
@saylos
Feb 15 2017 15:38
@khaduch ok I'll try, thanks!
CamperBot
@camperbot
Feb 15 2017 15:38
saylos sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 2483 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Feb 15 2017 15:50
@saylos - well, I don't know if I just missed something when I tried it before, but it seems to be working fine now. I think that it is because you have the search input implemented in a form element, and hitting the enter key triggers it? I'm trying this in FireFox - I don't know if that makes a difference or not?
@saylos - there is one thing that I did just notice as I was trying it again - if I type some nonsense string in the search box, it doesn't give any indication that no results were found, or if you already had a search result on the screen, then it doesn't clear that? Other than that - it seems to be working fine for me with the enter key and all...
Ken Haduch
@khaduch
Feb 15 2017 15:59
@sergandrleal - it looks good - "Essential" is spelled incorrectly. I think that it might be a little better to put the "Biography" section above the "Filmography" section? But it looks pretty good, nice project!
S André Leal
@sergandrleal
Feb 15 2017 16:00
Thank you @khaduch :) Will fix that right away!
CamperBot
@camperbot
Feb 15 2017 16:00
sergandrleal sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 2484 | @khaduch |http://www.freecodecamp.com/khaduch
@fortMaximus it has only one button :)
when you load the page the request for geolocation should appear, but it doesn't. @fortMaximus
Adam
@GoingAllTheWayUp
Feb 15 2017 16:05
in the problem "Factorialize a Number" https://www.freecodecamp.com/challenges/factorialize-a-number
Do the the want us to give the long hand or verbose way of factoring out a given number? Becuase I am entering the shorthand return num!; and I am getting only one task to pass
Zhanibek
@zhann1982
Feb 15 2017 16:05
@fortMaximus Hey !!! it works in this chat ))))))
h1tag
@h1tag
Feb 15 2017 16:06
lol. How?
Fabio Di Pane
@saylos
Feb 15 2017 16:07
@khaduch ok i'll fix it
Zhanibek
@zhann1982
Feb 15 2017 16:09
@fortMaximus I think it's a bug in codepen. I tryed the code via sublime. Now it works in google chrome
@fortMaximus thank you for your respond
CamperBot
@camperbot
Feb 15 2017 16:10
zhann1982 sends brownie points to @fortmaximus :sparkles: :thumbsup: :sparkles:
:cookie: 402 | @fortmaximus |http://www.freecodecamp.com/fortmaximus
Tom
@moT01
Feb 15 2017 16:24
anyone want to help me with a height transition?
taltmann42
@taltmann42
Feb 15 2017 16:25
@zhann1982 that's because gitter is https, probably that's why it's working. When you open your pen with https it should pop up to
Sam
@Samwise12
Feb 15 2017 16:28
Does anyone know how to connect to mongodb using webpack-dev-server?
taltmann42
@taltmann42
Feb 15 2017 16:28
@GoingAllTheWayUp that's not valid javascript, freecodecamp even shows you that there is an error
@Samwise12 the same way you'd do it in express/nodejs
Adam
@GoingAllTheWayUp
Feb 15 2017 16:30
@taltmann42 I relize this now. I misunderstood the directions, I though they were showing me something new with this n!, instead they are just telling me that in mathmatics n! mean to do a factoral
My brain wants to do a for loop and increment upwards ++
from 1.
taltmann42
@taltmann42
Feb 15 2017 16:31
then it's 1+2+3+4+5 not 1*2*3*4*5 for example
Adam
@GoingAllTheWayUp
Feb 15 2017 16:32
but all examples want to deincrement -- from (num - 1)
taltmann42
@taltmann42
Feb 15 2017 16:32
that's just when you're going for a recursive solution
Adam
@GoingAllTheWayUp
Feb 15 2017 16:32
I just saying increment the multiplyer by one increasing it.
Arnt I supposed to make a recursive solution for this problems tasks?
taltmann42
@taltmann42
Feb 15 2017 16:33
try it with your way of thinking and see if it works or not, i don't know how you imagine your code
you can solve it however you like
Adam
@GoingAllTheWayUp
Feb 15 2017 16:47
what does this mean to you:
for (var i = num - 1; i >= 1; i--) {
num *= i;
}
I am confused over the var i = num - 1; portion
im question is that gets set one time or does it always refer back to num and subtract 1 with every loop?
taltmann42
@taltmann42
Feb 15 2017 16:49
if num is five.. it does num*=4, so 5*=4 (20), then num*3, 20*3 (60), then 60*2 (120)
Adam
@GoingAllTheWayUp
Feb 15 2017 16:51
is this setting "i" once or is this formula i = num -1 played out every loop?
i have never come accross setting the for loop variable to anything but a number value
taltmann42
@taltmann42
Feb 15 2017 16:52
well it is a numeric value
the first part get's executed once, before the loop starts
Adam
@GoingAllTheWayUp
Feb 15 2017 16:52
ok
taltmann42
@taltmann42
Feb 15 2017 16:52
the last one after each iteration if the second part evauluates to true
Adam
@GoingAllTheWayUp
Feb 15 2017 16:53
```
function factorialize(num) {
var factoredAnswer;

if ( num === 1 || num <= 0) {
  return 1;
} else {
  for ( var i = 1; i <= num; i++ ) {
    factoredAnswer *= i;
}
  return factoredAnswer;
}
}

factorialize(5);
returns null
taltmann42
@taltmann42
Feb 15 2017 16:55
because factoredAnswer is not defined, you declare it but it has no value, and what would you say is undefined * 1?
Adam
@GoingAllTheWayUp
Feb 15 2017 16:55
OK, if i do that I get 0
I am just Multiplying everything by 0 lol
taltmann42
@taltmann42
Feb 15 2017 16:56
what did you change?
Adam
@GoingAllTheWayUp
Feb 15 2017 16:56
var factoredAnswer = 0;
taltmann42
@taltmann42
Feb 15 2017 16:56
well yep.. 0*1 is 0, 0*2 also, and so on
Adam
@GoingAllTheWayUp
Feb 15 2017 16:57
Thats why we have to count backwards from the given value! other wise you multiply by 0.
taltmann42
@taltmann42
Feb 15 2017 16:57
no
you can simply initialize it with 1?
both ways are possible
Adam
@GoingAllTheWayUp
Feb 15 2017 16:59
@taltmann42 thank you, I have got to learn everything the wrong way to beable to do things the correct way. its weird but thats my life
CamperBot
@camperbot
Feb 15 2017 16:59
goingallthewayup sends brownie points to @taltmann42 :sparkles: :thumbsup: :sparkles:
:cookie: 520 | @taltmann42 |http://www.freecodecamp.com/taltmann42
Adam
@GoingAllTheWayUp
Feb 15 2017 17:00
I would have never thought to set the value to 1.
BebeSel
@bebesel
Feb 15 2017 17:00
hi there..
taltmann42
@taltmann42
Feb 15 2017 17:00
you'll get there
BebeSel
@bebesel
Feb 15 2017 17:00
is there anybody know how to center my images inside my <div ="row">
how do you center images inside your <div="row">????
taltmann42
@taltmann42
Feb 15 2017 17:01
try setting text-align to center
BebeSel
@bebesel
Feb 15 2017 17:01
ohh thanks..
Tom
@moT01
Feb 15 2017 17:02
@taltmann42 wanna see if you can find a fix to my issue?
taltmann42
@taltmann42
Feb 15 2017 17:02
@moT01 what is your issue?
its a height transition
BebeSel
@bebesel
Feb 15 2017 17:03
@taltmann42 how will I do it?
Tom
@moT01
Feb 15 2017 17:03
the height is based on the content, and it won't transition, it just jumps
BebeSel
@bebesel
Feb 15 2017 17:03
<div class="row text-align: center">
singleincome
@singleincome
Feb 15 2017 17:03
Hello -- how do I group the image and the first div with the TEST image together so that when I scroll down, the image disappears?
taltmann42
@taltmann42
Feb 15 2017 17:03
@bebesel no, it's not a class, it's CSS for the row
Jesse Wright
@jesserwright
Feb 15 2017 17:03
why does this not work in codepen? it works locally....https://codepen.io/jesserwright/pen/egXMwd
BebeSel
@bebesel
Feb 15 2017 17:04
ohh haha thanks..
Tom
@moT01
Feb 15 2017 17:04
@taltmann42 must be because there is no defined height or something
taltmann42
@taltmann42
Feb 15 2017 17:07
@moT01 yep that's an issue with CSS. when height is auto, it's not affected by transitions correctly. You can do this to bypass it:
  • remove height:0 from transition
  • don't use transition for height, but only opacity and padding
  • use slideToggle() on the element, jQuery calculates the height of the element and animates it correctly
@jesserwright The page at 'https://codepen.io/jesserwright/pen/egXMwd' was loaded over HTTPS, but requested an insecure script 'http://labs.bible.org/api/?passage=random&type=json&callback=myfunction&callback=myfunction&_=1487178445924'. This request has been blocked; the content must be served over HTTPS.
@jesserwright using codepen with http works too http://codepen.io/jesserwright/pen/egXMwd
Jakov Horvat
@Yaaqovv
Feb 15 2017 17:08
HEy
can somebody help me with twitch json api?
Tom
@moT01
Feb 15 2017 17:09
@taltmann42 i will try it, and let you know how it turns out
@taltmann42 thanks
CamperBot
@camperbot
Feb 15 2017 17:09
mot01 sends brownie points to @taltmann42 :sparkles: :thumbsup: :sparkles:
:cookie: 521 | @taltmann42 |http://www.freecodecamp.com/taltmann42
singleincome
@singleincome
Feb 15 2017 17:14
Lol I got it <_<
Chris Rutherford
@cjrutherford
Feb 15 2017 17:17

hey all, I'm working on a wireframe for a new portfolio site, and am not sure what's going on. I'm using the same CSS to style section one and two, just changed the targets. Section one has it right (in blue) and section two has this odd blank space that I can't seem to get rid of.... help? image reference and here is the code:

Html:

  <div class="container-fluid" id="secOne">
      <div class="outer">
        <div class="inner">
          <h1 class="text-center" id="seconeTitle">Developing Tools for Others</h1>
          <div class="row">
            <div class="col-md-4 text-center">
              <h1>GitHub &nbsp; &nbsp;<span class="fa fa-github"></span></h1>
              <div id="gitHub"></div>
            </div>
            <div class="col-md-4 text-center">
              <h1>CodePen &nbsp;&nbsp;<span class="fa fa-codepen"></span></h1>
              <div id="cpio"></div>
            </div>
            <div class="col-md-4 text-center">
              <h1>Professional Projects&nbsp;&nbsp;<span class="fa fa-code"></span></h1>
              <div id="profProj"></div>
            </div>
          </div>
          <div class="row">
            <div class="col-md-12 text-center">
              <h1>Languages and Frameworks of Note &nbsp;&nbsp;<span class="fa fa-cogs"></span></h1>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="container-fluid" id="secTwo">
      <div class="outer">
        <div class="inner">
          <h1 class="text-center" id="sectwoTitle">Studying for the Future</h1>
          <div class="row">
            <div class="col-md-4 text-center">
              <h1>Western Governors University</h1>
            </div>
            <div class="col-md-4 text-center">
              <h1>Udemy</h1>
            </div>
            <div class="col-md-4 text-center">
              <h1>Free Code Camp<span class="fa fa-free-code-camp"></span></h1>
            </div>
          </div>
          <div class="row">
            <div class="col-md-12"></div>
          </div>
        </div>
      </div>
    </div>

and the CSS:

#secOne {
  padding: 0;
  margin: 0;
  border-top: 10px solid black; }
  #secOne h1#seconeTitle {
    padding-top: 0;
    margin-top: 0; }
  #secOne .outer {
    padding: 0;
    margin: 0;
    background: url("http://wallpaper.pickywallpapers.com/1440x900/blue-trianglish-pattern.jpg"); }
  #secOne .inner {
    padding: 0;
    margin: 0;
    background: rgba(109, 141, 169, 0.8); }

#secTwo {
  padding: 0;
  margin: 0;
  border-top: 10px solid black; }
  #secTwo h1#seconeTitle {
    padding-top: 0;
    margin-top: 0; }
  #secTwo .outer {
    padding: 0;
    margin: 0;
    background: url("http://www.photos-public-domain.com/wp-content/uploads/2012/06/yellow-fabric-with-floral-pattern-texture.jpg"); }
  #secTwo .inner {
    padding: 0;
    margin: 0;
    background: rgba(208, 214, 181, 0.8); }
taltmann42
@taltmann42
Feb 15 2017 17:19
@cjrutherford do you have a codepen-link? would be easer to debug
singleincome
@singleincome
Feb 15 2017 17:20
Any tips on sizing images in css (using things like background-size, etc) to avoid squishing the image or ruining the resolution?'
Chris Rutherford
@cjrutherford
Feb 15 2017 17:20
that's the thing, I'm doing this with pug and sass, so I have just the compiled code, but I'll get the pug/sass into codepen
@taltmann42 I'll get it in there
taltmann42
@taltmann42
Feb 15 2017 17:21
@cjrutherford yep you can choose those preprocessors, so you can just paste your original source there
Chris Rutherford
@cjrutherford
Feb 15 2017 17:24
@taltmann42 and of course it's not doing it in the pen..... http://codepen.io/christopherrutherford/pen/egXjbZ so I'm not crazy
taltmann42
@taltmann42
Feb 15 2017 17:25
does it happen in your local code if you remove the first part? in the image, there's another section, and in the codepen there isn't
Chris Rutherford
@cjrutherford
Feb 15 2017 17:26
@taltmann42 This is true, but it's another whole section like the others laid out the same way. I'll inject the pug/sass for that and see what happens
@taltmann42 still the same here.... works in CP, not local
Pen is updated.
taltmann42
@taltmann42
Feb 15 2017 17:31
do you have some CSS-libraries referenced locally that you didn't include in codepen?
Chris Rutherford
@cjrutherford
Feb 15 2017 17:32
only using bootstrap, jquery, and font-awesome
taltmann42
@taltmann42
Feb 15 2017 17:32
okay then that's a tough one
i have a theory
in sec2 you set css for #seconeTitleto remove the top margin, but it's actually #sectwoTitle.. but reboot from bootstrap removes the top-margin anyway.. buuuut if you increase the margin manually you'll see the exact same effect as in the image you posted
so maybe not everything from bootstrap get's loaded correctly or something like that?
@cjrutherford do you use the bootstrap 4.0 alpha locally too?
Tom
@moT01
Feb 15 2017 17:38
@taltmann42 worked like a charm
taltmann42
@taltmann42
Feb 15 2017 17:38
@moT01 :thumbsup:
Chris Rutherford
@cjrutherford
Feb 15 2017 17:39
@taltmann42 that's the thing, I'm not using the BS4 alpha at all, and it's importing from a CDN, and it's only version 3.3.7
taltmann42
@taltmann42
Feb 15 2017 17:39
@cjrutherford then you should use the same CDN link in codepen instead of using the one from the dropdown
Chris Rutherford
@cjrutherford
Feb 15 2017 17:40
ah, is that why it's working there? lol kk
taltmann42
@taltmann42
Feb 15 2017 17:41
probably
Chris Rutherford
@cjrutherford
Feb 15 2017 17:42
@taltmann42 Thanks, I think that's the issue, for some reason it like bootstraps 4.0 A6 release better
CamperBot
@camperbot
Feb 15 2017 17:42
cjrutherford sends brownie points to @taltmann42 :sparkles: :thumbsup: :sparkles:
:cookie: 522 | @taltmann42 |http://www.freecodecamp.com/taltmann42
Chris Rutherford
@cjrutherford
Feb 15 2017 17:42
I'm going to migrate this over.
taltmann42
@taltmann42
Feb 15 2017 17:42
uhm okay, but I have the solution for the bug too, and it's not called alpha without a reason :P
Chris Rutherford
@cjrutherford
Feb 15 2017 17:45
@taltmann42 yeah... alpha may kill you, beta may bite you, but when they become stable....
what's the fix?
taltmann42
@taltmann42
Feb 15 2017 17:46
@cjrutherford you remove the margin-top from seconeTitle but it's sectwoTitle
so the h1 in the second section still has a margin-top which pushes its container downwards
Chris Rutherford
@cjrutherford
Feb 15 2017 17:49
ah, okay, I forgot you said that before....
@taltmann42 works!!!
gotta remember if I copy/paste code I have to be sure it matches up
:smirk:
funkymonkey79
@funkymonkey79
Feb 15 2017 17:52

Hi guys,

I am working on Personal Portfolio Project and have a problem with CodePen and Bootstrap - can't seem to get it to work.

In CodePen's settings I add Bootstrap to Css and Bootstrap + jQuery to JavaScript tab, then from Bootsrtap website from components section I copy default navbar and past it into CodePen HTML section but can't get it to work.

http://codepen.io/funkymonkey79/pen/LxaJWr

What am I doing wrong?

Thanks!

taltmann42
@taltmann42
Feb 15 2017 17:55
@funkymonkey79 use one of these links: https://www.bootstrapcdn.com/
you included the alpha version
Chris Rutherford
@cjrutherford
Feb 15 2017 17:55
@funkymonkey79 and also be sure to include the JS for Bootstrap too
@taltmann42 Seems like cp is preferring alpha 6
U-ways
@U-ways
Feb 15 2017 17:57
@funkymonkey79 Wrong bootstrap link -- this is the correct BS version you need: https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css
@funkymonkey79 Replace your bootstrap link with this one.
Albert L. C.
@sirus3020
Feb 15 2017 17:58
guys, can anyone help with the Twitch API?
funkymonkey79
@funkymonkey79
Feb 15 2017 17:59
@taltmann42 @cjrutherford @U-ways Thank you so much!!! I've just spent 5 hours trying to figure it out lol
CamperBot
@camperbot
Feb 15 2017 17:59
funkymonkey79 sends brownie points to @taltmann42 and @cjrutherford and @u-ways :sparkles: :thumbsup: :sparkles:
:cookie: 316 | @cjrutherford |http://www.freecodecamp.com/cjrutherford
:cookie: 523 | @taltmann42 |http://www.freecodecamp.com/taltmann42
:cookie: 681 | @u-ways |http://www.freecodecamp.com/u-ways
U-ways
@U-ways
Feb 15 2017 18:00
@funkymonkey79 Ouch! Goodluck! :D
Chris Rutherford
@cjrutherford
Feb 15 2017 18:01
@funkymonkey79 lol, the first step to being a developer is a thousand mile journey, which starts with a few simple steps! lol
Albert L. C.
@sirus3020
Feb 15 2017 18:05
Anyone can help me with my problem? trying to figure it out since yesterday. lol
If you guys click 'ALL' multiple times, the 'ONLINE' jumps around.
funkymonkey79
@funkymonkey79
Feb 15 2017 18:06
@U-ways Thanks, I will need tones of it :)
CamperBot
@camperbot
Feb 15 2017 18:06
funkymonkey79 sends brownie points to @u-ways :sparkles: :thumbsup: :sparkles:
:warning: funkymonkey79 already gave u-ways points
funkymonkey79
@funkymonkey79
Feb 15 2017 18:07
@cjrutherford lol, learning the hard way :), slow clap to myself and a bottle of cold beer!
taltmann42
@taltmann42
Feb 15 2017 18:09
@sirus3020 what exactly do you mean with "Online" jumping around?
Diogo Righi
@diogorighi
Feb 15 2017 18:11
hi! I need some help on the "show local weather" app. Actually i'm having problems using $.getJSON on codepen. I think it's something common, so.. does anybody know how to fix it?
Albert L. C.
@sirus3020
Feb 15 2017 18:12
@taltmann42 well, try clicking 'ALL' multiple times.
taltmann42
@taltmann42
Feb 15 2017 18:12
@diogorighi doing that too currently, what's the problem?
Diogo Righi
@diogorighi
Feb 15 2017 18:13
@taltmann42 I think codepen is blocking any request that are not via https
taltmann42
@taltmann42
Feb 15 2017 18:14
@diogorighi yep, the openweather-api only gives https to paying users, you can bypass this with another site, one sec
@diogorighi https://cors-anywhere.herokuapp.com/http://api.openweathermap.org/data/2.5/weather?[YOUR_PARAMETERS]
this page basically makes the request for you and returns the results to your site
Diogo Righi
@diogorighi
Feb 15 2017 18:17
hummmm, nice! Thanks @taltmann42 I'll try that
CamperBot
@camperbot
Feb 15 2017 18:17
diogorighi sends brownie points to @taltmann42 :sparkles: :thumbsup: :sparkles:
:cookie: 524 | @taltmann42 |http://www.freecodecamp.com/taltmann42
taltmann42
@taltmann42
Feb 15 2017 18:20
Hey could some of you check if my weather-app shows correct data for you? https://codepen.io/taltmann42/pen/EZMojv?editors=0100
Martin
@MartinKah
Feb 15 2017 18:27
Hallo Thomas, bei mir wird da nichts angezeigt ;)
taltmann42
@taltmann42
Feb 15 2017 18:28
woah
Martin
@MartinKah
Feb 15 2017 18:28
ah doch jetzt, nach langer wartezeit :D
taltmann42
@taltmann42
Feb 15 2017 18:28
ja der tab muss aktiv sein, und dann dauerts ne weile bis der server reagiert
niprobin
@niprobin
Feb 15 2017 18:29
hey guys, what kind of display should I use for a div to use vertical-align? "display:cell" or can I use something else?
taltmann42
@taltmann42
Feb 15 2017 18:31
@niprobin you can add display:flex and align-items:center on the contianer, that will vertically center its content
niprobin
@niprobin
Feb 15 2017 18:32
@taltmann42 thanks a lot!
niprobin
@niprobin
Feb 15 2017 18:39
@taltmann42 this guide looks good, thanks again for all the info
CamperBot
@camperbot
Feb 15 2017 18:39
niprobin sends brownie points to @taltmann42 :sparkles: :thumbsup: :sparkles:
:cookie: 525 | @taltmann42 |http://www.freecodecamp.com/taltmann42
Chris Rutherford
@cjrutherford
Feb 15 2017 18:41
@funkymonkey79 heh, yeah I know that feel. the only thing that's saved me in this program is the fact that I've done some programming classes in college, and HTML in middle school
Diogo Righi
@diogorighi
Feb 15 2017 18:44
@taltmann42 yes! its showing the correct location and weather for me
taltmann42
@taltmann42
Feb 15 2017 18:45
@diogorighi okay great, is there also a background-image?
Diogo Righi
@diogorighi
Feb 15 2017 18:49
@taltmann42 noo, there's no background image
taltmann42
@taltmann42
Feb 15 2017 18:50
@diogorighi damn.. what text is there in the middle?
Diogo Righi
@diogorighi
Feb 15 2017 18:50
cool, you're using react. I didn't know that it was possible
taltmann42
@taltmann42
Feb 15 2017 18:50
@diogorighi jup, include react and react-dom in codepen and use the babel-preprocessor if you want to use JSX too
Diogo Righi
@diogorighi
Feb 15 2017 18:51
I'm not a codepen user, but I've been working with front-end for a long time. Just rushing these tests
its showing "clear sky"
taltmann42
@taltmann42
Feb 15 2017 18:51
yeah started like that too.. and every once in a while I'm doing a project.. it's not that they're particularly hard but still time-consuming
Diogo Righi
@diogorighi
Feb 15 2017 18:51
yep
same here
i'm leaving the startup that I founded in 2012, so I'm looking for this certificates to help me find a new job
taltmann42
@taltmann42
Feb 15 2017 18:52
oh okay, sorry to hear that
can you give me your lat/long, so I can check out what's going wrong?
Diogo Righi
@diogorighi
Feb 15 2017 18:53
oh, It's my choice
so it's a good thing
sure
taltmann42
@taltmann42
Feb 15 2017 18:53
oh okay, but when you already had a startup and worked in front-end for a while, i don't think that can be topped by a "free code camp" certificate
Diogo Righi
@diogorighi
Feb 15 2017 18:54
hm.. yeah maybe
but I think it can help
especially the non profits projects
I think the main problem is being unknown
and I live in Brazil, looking for a remote job in another country
taltmann42
@taltmann42
Feb 15 2017 18:56
yeah that's true, another dev-friend just started blogging about several aspects of android-development and soom companies contacted him
Diogo Righi
@diogorighi
Feb 15 2017 18:57
my coords: lat: -5.83 lon: -35.21
taltmann42
@taltmann42
Feb 15 2017 18:57
okay let's see
hmm for me it shows a clear sky image in the background... weird
Diogo Righi
@diogorighi
Feb 15 2017 19:01
for me is just a blue background
maybe its a sky
taltmann42
@taltmann42
Feb 15 2017 19:01
ah probably the image gets cropped so much that you don't see the part of the image with something else in it
Diogo Righi
@diogorighi
Feb 15 2017 19:01
hahaha
taltmann42
@taltmann42
Feb 15 2017 19:02
yep that's it.. center-positioned background image ftw!
@diogorighi thanks for testing anyways :)
CamperBot
@camperbot
Feb 15 2017 19:02
taltmann42 sends brownie points to @diogorighi :sparkles: :thumbsup: :sparkles:
:cookie: 211 | @diogorighi |http://www.freecodecamp.com/diogorighi
Diogo Righi
@diogorighi
Feb 15 2017 19:02
:D
yep, you're right
just saw a guy jumping
taltmann42
@taltmann42
Feb 15 2017 19:03
yep.. probably could've used a better image for that one
Diogo Righi
@diogorighi
Feb 15 2017 19:12
hahaha, i think it's fine
VilfredSikker
@VilfredSikker
Feb 15 2017 19:26
Hey people I need help. I'm a rookie and trying to create my own webside. But I can't figure out why my pages are overlapping. If you look down at the page to the Concept page it gets overlapped by a new page. The page overlapping is the "Offering" page which should be a whole new site. What is going wrong? https://codepen.io/VilfredSikker/pen/pRYjgm
Gulsvi
@gulsvi
Feb 15 2017 19:35
@VilfredSikker It looks like you don't have bootstrap set up for your project: https://www.bootstrapcdn.com/
Diogo Righi
@diogorighi
Feb 15 2017 19:35
@VilfredSikker it looks like the .pageConcept div is insice the pagehome
inside*
singleincome
@singleincome
Feb 15 2017 19:41
Can anyone help me out? I'm trying to move the TEST image to overlap the bottom left corner of the div object with the lorem ipsum text
achudoz
@achudoz
Feb 15 2017 19:45
@singleincome I imagine adding some margins/padding would do the trick
singleincome
@singleincome
Feb 15 2017 19:46
@achudoz I've tried adding a left margin, but it forces the image above the text

so instead of () [] it becomes:

()
[]

achudoz
@achudoz
Feb 15 2017 19:46
@singleincome i just looked at the pen and it seems that your image and text are both in the same <div> move them to seperate divs and then use the margin/padding method
if you have them in the same div, it acts as one block and will never overlap
singleincome
@singleincome
Feb 15 2017 19:49
@achudoz Like this?
'''
<div id="div1">
</div>
<div>
<img src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcQSXbAPjvTfcr9ge8uzA6gMOzw0TkJz2ixXun6BUOXnrVmZaIk2Bi4-UccK8g" alt="">
</div>
'''
CamperBot
@camperbot
Feb 15 2017 19:49
:bulb: to format code use backticks! ``` more info
singleincome
@singleincome
Feb 15 2017 19:49
        <div id="div1">
        </div>
    <div>
        <img src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcQSXbAPjvTfcr9ge8uzA6gMOzw0TkJz2ixXun6BUOXnrVmZaIk2Bi4-UccK8g" alt="">
        </div>
Gulsvi
@gulsvi
Feb 15 2017 19:52
@singleincome You can use negative margins, but not sure I understand the look you want.
    margin-top: 180px;
    margin-left: -100px;
achudoz
@achudoz
Feb 15 2017 19:52
yeah, I would do
<div class="masterdiv">
   <div class="imagediv">
        <img src="(source)"
   </div>
   <div class="textdiv">
       <p>yourtexthere</p>
   </div>
</div>
then adjust the margins to get the desired effect. negative margins help as pointed out by @SkyCoder01
achudoz
@achudoz
Feb 15 2017 19:57
@singleincome oh and one pointer for the future: I know that it makes sense to label your elements by IDs rather than by classes, when you know/think you will only use the specific css only for this one element, but apparently it is considered a bad practice and in fact when you will be doing more complex pages, you WILL reuse pieces of css formatting and you will use IDs for different things than css targeting. Those things would be mostly javasrcipt sorcery
Jason
@ICodeWateverIFeelLikeCoding
Feb 15 2017 19:58
margin: auto isn't working for my input & button elements..however it is working for an h1 element. can somebody help me figure out why this is happening? https://codepen.io/JaosnCodes/pen/vgQdjR
Drew Paris
@Drewishman6
Feb 15 2017 19:58
Hey guys, if I want to have an H1 element "Yaya Toure" but want the Yaya in orange and the Toure in green. How would i do this. I get the rite colours but i can't keep them on the same line.
singleincome
@singleincome
Feb 15 2017 20:00
@achudoz Are you talking about my #margin ID? Hehe, yeah. It was pointed out to me yesterday. I haven't gotten around to changing things around completely.
Thanks for your suggestion -- i'll try to implement!
Gulsvi
@gulsvi
Feb 15 2017 20:04
@ICodeWateverIFeelLikeCoding margin: auto will only center block elements. <button> and <input> are inline elements.
singleincome
@singleincome
Feb 15 2017 20:05
@SkyCoder01 using negative margins breaks my div for some reason :(
Gulsvi
@gulsvi
Feb 15 2017 20:05
@Drewishman6 Use a <span> tag. <h1><span class="orange-text">Orange</span> and <span class="green-text">Green</span></h1>
@singleincome If you can post an image of what you want, I might have a better idea. Having trouble visualizing what you're going for.
Johnny
@jtan3
Feb 15 2017 20:10
http://codepen.io/jtan3/pen/GqPgOp my offline button only targets one account. How can I make it target all of the offline accounts?
Gulsvi
@gulsvi
Feb 15 2017 20:13
@jtan3 When I did that project, I gave each streamer a class name "offline", "online", "closed" and then used jQuery to .hide() and .show() the streamers.
Johnny
@jtan3
Feb 15 2017 20:15
@SkyCoder01 you did that manually?
Gulsvi
@gulsvi
Feb 15 2017 20:17
manually?
Drew Paris
@Drewishman6
Feb 15 2017 20:22
@SkyCoder01 Where do i put my elements to have them changed by the classes?
Gulsvi
@gulsvi
Feb 15 2017 20:22

@jtan3 You add it to your HTML prepend code:

$("#streamerInfo").prepend(
  "<div class='row' id='streamers'>" + 
    "<a target='_blank'  href=" + url + " >" +
      "<div class='col-md-4' >" + 
        "<img src='" + logo + "'>" + 
      "</div>" +
        "<div class='col-md-4' class='name'>" + name + 
        "<p class='viewers'>" + views + " views" + "</p>" + 
        "<p>" + followers + " followers" + "</p>" + 
      "</div>" +
      "<div class='col-md-4'>" + mode + "</div>" + 
    "</a>" +
  "</div>"
);

It helps to format it like that (for me) so I can view it like normal HTML

Don't use id="streamers" for every streamer - IDs need to be unique. But you can do something like class="row offline" (use a variable for offline/online/closed)
Johnny
@jtan3
Feb 15 2017 20:23
@SkyCoder01 thanks, ill try it
CamperBot
@camperbot
Feb 15 2017 20:23
jtan3 sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 201 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Gulsvi
@gulsvi
Feb 15 2017 20:24
@Drewishman6 You put them in the place where I did in that code example, or are you asking how to style them in your CSS?
Drew Paris
@Drewishman6
Feb 15 2017 20:28
@SkyCoder01 Do I need CSS as well?
Ahhh yes i do
AlejoFCC
@AlejoFCC
Feb 15 2017 20:30
Hello! I am in the Local weather app and I can not go through it. Totally stuck. I have checked many different codes, try them, understanding them but I can not see the mistake. Can someone have a look at my codepen, please?? I am just trying to get data from API, no css, no html complicated but ... Thank you https://codepen.io/AlejoFCC/pen/ZLmBBE?editors=1011
Gulsvi
@gulsvi
Feb 15 2017 20:30
@Drewishman6 It wouldn't hurt to do the HTML and CSS challenges again if you haven't yet
We learn all of this stuff in those challenges - how to style elements with CSS
Drew Paris
@Drewishman6
Feb 15 2017 20:31
@SkyCoder01 Thanks! Yes I'm trying to look those over. I completed them 2 weeks ago so I've lost a lot in my head. Thanks for the help and sorry for the amateurness lol
CamperBot
@camperbot
Feb 15 2017 20:31
drewishman6 sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 202 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Gulsvi
@gulsvi
Feb 15 2017 20:33
Yeah, It looks like it's been almost 3 months since you did those. Easy to forget :)
Matthew Bailin
@mdbailin
Feb 15 2017 20:34
Hey all, does anyone have an idea on how to check an array to see if there's a set of numbers in order, to then give that array a score?
Gulsvi
@gulsvi
Feb 15 2017 20:34
@AlejoFCC HTTP and HTTPS don't work together. You should use a different weather API that supports HTTPS or get location over HTTP instead of using navigator.geolocation
Ian Lee
@asparism
Feb 15 2017 20:35
@AlejoFCC also don't forget to add the jquery script
Matthew Bailin
@mdbailin
Feb 15 2017 20:35
I.e. if the array has [1,4,7], that would get 10 points because there's a winning column of X's or O's on the board now
Gulsvi
@gulsvi
Feb 15 2017 20:35
@mdbailin Can you sort the array?
Oh if it's for tic tac toe...I haven't done that yet :/
Matthew Bailin
@mdbailin
Feb 15 2017 20:36
@SkyCoder01 Yeah we don't want to sort in this case because the order of when the move was played matters here
AlejoFCC
@AlejoFCC
Feb 15 2017 20:36
@asparism jQuery script?! I am lost about that, do i need to add an instance for that?@SkyCoder01 Thank you. I will try to find out by that way.
CamperBot
@camperbot
Feb 15 2017 20:36
:cookie: 305 | @asparism |http://www.freecodecamp.com/asparism
alejofcc sends brownie points to @asparism :sparkles: :thumbsup: :sparkles:
AlejoFCC
@AlejoFCC
Feb 15 2017 20:36
@SkyCoder01 Thank you. I will try to find out by that way.
CamperBot
@camperbot
Feb 15 2017 20:36
:cookie: 203 | @skycoder01 |http://www.freecodecamp.com/skycoder01
alejofcc sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
Ian Lee
@asparism
Feb 15 2017 20:38
@AlejoFCC from codepen, upper - right: choose settings, thenselect JS; use quick-add drop down at the bottom and select jquery. that will automatically add jquery and allow you to use, for example, the $ selector.
can someone help me understand why i can still press buttons after i've completed the series in this simon codepen? i can't seem to exit the function or turn off the variable that lets buttons be pressed http://codepen.io/Asparism/pen/ZLyJRb?editors=0011
singleincome
@singleincome
Feb 15 2017 20:41
@SkyCoder01 I can't find a good image
But it has to do with overflow
AlejoFCC
@AlejoFCC
Feb 15 2017 20:41
@asparism thank you
CamperBot
@camperbot
Feb 15 2017 20:41
alejofcc sends brownie points to @asparism :sparkles: :thumbsup: :sparkles:
:warning: alejofcc already gave asparism points
Ian Lee
@asparism
Feb 15 2017 20:41
no prob
Alan
@alant90
Feb 15 2017 20:54
if i want to push the contents of an array[i] into my html with Angular upon clicking a button, should I be using a directive or a component?
singleincome
@singleincome
Feb 15 2017 20:55

What's the difference between:

.class{}

And:

class image {}
Matthew Bailin
@mdbailin
Feb 15 2017 20:56
Hey all, does anyone have an idea on how to check an array to see if there's a set of numbers in order, to then give that array a score?
I.e. if the array has [1,4,7], that would get 10 points because there's a winning column of X's or O's on the board now
Gulsvi
@gulsvi
Feb 15 2017 20:59
@singleincome One is CSS the other is JavaScript :)
singleincome
@singleincome
Feb 15 2017 21:02
but I can write the latter in a stylesheet
Gulsvi
@gulsvi
Feb 15 2017 21:03
Can you show an example?
singleincome
@singleincome
Feb 15 2017 21:04
Css:
.container {
    width: 100%;
    height: 275px;
    overflow: visible;
    padding: 20px;
    background-color: #84B6C0;
    box-shadow: 0px 10px 5px #888888;
    font-family: sans-serif;
}

#margin {
    margin: 1cm 1.5cm 1cm 1cm;
}

.container img {
    position: aboslute;
    margin-right: 25px;
    width: 300px;
    border-radius: 85%;
    z-index: -1;
    float: left;
}
html:
<div id="wrap">
    <div class="container" id="margin">
        <div id="div1">
        </div>
    <div>
        <img src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcQSXbAPjvTfcr9ge8uzA6gMOzw0TkJz2ixXun6BUOXnrVmZaIk2Bi4-UccK8g" alt="">
        <h2> Lorem</h2>
        <p> Ipusm. Phasellus non turpis a eros suscipit sagittis eu nec purus. Ut a bibendum lacus. Quisque tincidunt a libero non faucibus. Sed augue ipsum, pharetra at laoreet in, ornare mattis magna. Mauris eget urna magna. Nulla mollis, lorem nec pulvinar posuere. </p>
        </div>
Gulsvi
@gulsvi
Feb 15 2017 21:04
Oh..... not the keyword class?
Eric
@ericsolomon21
Feb 15 2017 21:04
Hey guys, anyone have any idea why setTimeout wouldn't be working on line 17 of my code?
http://codepen.io/ericsolomon21/pen/Lxqyvx/?editors=0011
singleincome
@singleincome
Feb 15 2017 21:04
Oh yeah, sorry. Not the keyword class @SkyCoder01
Gulsvi
@gulsvi
Feb 15 2017 21:05
@singleincome It means to select all img elements inside elements with the .container class in that example. https://www.w3schools.com/cssref/css_selectors.asp
singleincome
@singleincome
Feb 15 2017 21:05
oooooou
i wonder if that's why my img won't overlap my div element...
Gulsvi
@gulsvi
Feb 15 2017 21:15
@singleincome Wish I could help, just not sure what you're looking to do. In my twitch project I have the user logos overlapping divs - I did it with position: absolute. http://codepen.io/skycoder/pen/XpyrYN
Michael Bordenaro
@MBcoder87
Feb 15 2017 21:21
Anyone know where in the bootstrap or HTML lessons it was taught to make a nav bar? Since that is the first thing you need to do to create your portfolio site, I would think they would teach this, but I cant find anywhere this was taught. Have mercy, I am new!
there you go @MBcoder87
Sam
@Samwise12
Feb 15 2017 21:28
How do I connect to mongodb when using react-router?
Michael Bordenaro
@MBcoder87
Feb 15 2017 21:30
Thank you @alant90
CamperBot
@camperbot
Feb 15 2017 21:30
mbcoder87 sends brownie points to @alant90 :sparkles: :thumbsup: :sparkles:
:cookie: 315 | @alant90 |http://www.freecodecamp.com/alant90
Annetta Ives
@IvesNoIdea
Feb 15 2017 21:34
Hi everyone, I'm really struggling with the Weather App challenge. Can anyone point me to some good resources for learning more about how to use APIs? I've looked at the standard documentation (MDN etc.) but it might as well be written in Klingon for all the chance I've got of following it!
Alan
@alant90
Feb 15 2017 21:39
which libraries are you using @IvesNoIdea ?
Annetta Ives
@IvesNoIdea
Feb 15 2017 21:40
@alant90 I'm trying to use the OpenWeatherMap API as suggested in the challenge. I've got my API key, but the call just won't work.

My code:

$.getJSON("api.openweathermap.org/data/2.5/weather?q=London,uk&APPID=303a654508a3690e8004b21117457135", function(json) {
        $("#user-weather").html(JSON.stringify(json));
      });

I know it's not using the user's location, I just wanted to get it working with a static location first, and output the JSON in string format so I could see it pulling through.

Joris Labie
@labiej
Feb 15 2017 21:44
use https:// in front of the url
Jason
@ICodeWateverIFeelLikeCoding
Feb 15 2017 21:51
Annetta Ives
@IvesNoIdea
Feb 15 2017 21:57
@labiej A-ha! It didn't work with https, but it did with http! Thanks :smile:
CamperBot
@camperbot
Feb 15 2017 21:57
ivesnoidea sends brownie points to @labiej :sparkles: :thumbsup: :sparkles:
:cookie: 457 | @labiej |http://www.freecodecamp.com/labiej
Joris Labie
@labiej
Feb 15 2017 21:58
@IvesNoIdea Indeed, forgot that the https endpoint is restricted to pro accounts
A shame really if google ever starts enforcing https in chrome
Annetta Ives
@IvesNoIdea
Feb 15 2017 21:59
@labiej I just can't believe I've been banging my head against a brick wall for so long because I didn't put http! :LOL:
Bigyan Karki
@bigyankarki
Feb 15 2017 22:05
can anyone help me get through this problem?
Annetta Ives
@IvesNoIdea
Feb 15 2017 22:14
@bigyankarki You're ahead of me, I'm afraid. It looks nice, though!
Evan
@EvanDCP
Feb 15 2017 22:14
does my project look nice so far guys?http://codepen.io/EvanDCP18/full/bgZZqm/
Annetta Ives
@IvesNoIdea
Feb 15 2017 22:16
@EvanDCP Looks simple to use. You've got a typo in 'Pomodoro', though.
(former newspaper proofreader, I can't help it!)
Fabio
@Gentarozzo
Feb 15 2017 22:26
hello can someone help me here with a css problem?
Gulsvi
@gulsvi
Feb 15 2017 22:29
@Gentarozzo I can try
Fabio
@Gentarozzo
Feb 15 2017 22:30

after a "each" cycle i want to change the color for every item i append... but it just changes the first one:

$.each(trovato, function(i,j){
var goto = 'https://en.wikipedia.org/?curid='+trovato[i].pageid;
$("#risultati").append('<a target = '+"_blank"+' href = ' + goto + '<li><span id = "titoline">'+ trovato[i].title + '</span><br>' + trovato[i].extract + '</li></a>')

$("#titoline").css({ color: "#"+(Math.random()*16777215|0).toString(16)

I just changed the ID... now I've a class
but all the colours are the same... i want a random title
Gulsvi
@gulsvi
Feb 15 2017 22:30
You want a random color for each #titoline?
Fabio
@Gentarozzo
Feb 15 2017 22:31
yes
Gulsvi
@gulsvi
Feb 15 2017 22:31
You will have to use .titoline because you can't have duplicate IDs
Fabio
@Gentarozzo
Feb 15 2017 22:31
told you i changed it
but are all the same... i need random
Gulsvi
@gulsvi
Feb 15 2017 22:31
and use a $.each, like:
      $.each($(".titoline"), function() {
        $(this).css({
          color: "#" + (Math.random() * 16777215 | 0).toString(16)
        });
      });
Fabio
@Gentarozzo
Feb 15 2017 22:32
trying
@SkyCoder01 totally working... thanks a lot ^^
CamperBot
@camperbot
Feb 15 2017 22:32
gentarozzo sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 205 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Adam
@GoingAllTheWayUp
Feb 15 2017 22:33
Check for Palindromes
https://www.freecodecamp.com/challenges/check-for-palindromes
Is there a regular expression that allow us to select only valid letters of the alphabete? ommiting numbers ,symbols and/or spaces.
Bigyan Karki
@bigyankarki
Feb 15 2017 22:33
@SkyCoder01 i am sorry i couldnt find your comment up in the section
this is the site
Gulsvi
@gulsvi
Feb 15 2017 22:33

@Gentarozzo I just did that for animating, you could do the same with a hide and fadeIn:

      $.each($(".titoline"), function() {
        $(this).css({
          color: "#" + (Math.random() * 16777215 | 0).toString(16)
        }).hide().fadeIn(2000);

For fun anyway :)

@bigyankarki You are submitting the <input> instead of the <form> - that was one thing I noticed
Fabio
@Gentarozzo
Feb 15 2017 22:34
@SkyCoder01 looks cool :D
fvdave2017
@fvdave2017
Feb 15 2017 22:35
I am having trouble getting the scrolling on the portfolio project to work. I have copied the code from the spy data for bootstrap even. I thought that I made an typing error coding . Still no success. Does codePen really work for everything?
Fabio
@Gentarozzo
Feb 15 2017 22:35
@SkyCoder01 what if i want to take colors from an array? in a random way=
Gulsvi
@gulsvi
Feb 15 2017 22:36
@Gentarozzo I forget the formula to use, but it's similar - use Math.random() to choose a random item from your array of colors
Fabio
@Gentarozzo
Feb 15 2017 22:36
@SkyCoder01 okok I'll try
Bigyan Karki
@bigyankarki
Feb 15 2017 22:39
@SkyCoder01 so that means we can get a value from form and not from input field?
Gulsvi
@gulsvi
Feb 15 2017 22:39
No, you get your value from the input field, but you submit() a form, not an input field.
I forget the tutorial I went through for this when i did my wikipedia viewer. I'll see if I can find it
Faddah Wolf
@faddah
Feb 15 2017 22:40
hey folks, i'm trying to remember the link to that image upload service, "like imgur.com," but not imgur, as that has problems with codepen.io sometimes? imgaccess.org or something like that? i tried googling for it but all i keep coming up is someone's large-scale print shop in the midwest.
Gulsvi
@gulsvi
Feb 15 2017 22:41
https://postimage.org?
Or you can replace runnerbill75 with your username and use github with these instructions :point_up: February 10, 2017 4:17 PM
Bigyan Karki
@bigyankarki
Feb 15 2017 22:42
@SkyCoder01 do you mean we should submit() a form or input field?
Faddah Wolf
@faddah
Feb 15 2017 22:42
@SkyCoder01 - that's it. i'll bookmark it this time. thank you!
CamperBot
@camperbot
Feb 15 2017 22:42
faddah sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 206 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Finagl3
@Finagl3
Feb 15 2017 22:43
would someone help me get my text centered horizontally and vertically inside a background image? I've looked for solutions on google and nothing I try works. I'm using bootstrap 3.
https://codepen.io/Finagl3/pen/WRKMLo?editors=1100
Gulsvi
@gulsvi
Feb 15 2017 22:43
@bigyankarki The submit() method submits a form
fvdave2017
@fvdave2017
Feb 15 2017 22:43
I have just done HTML and CSS. Do I need JavaScript to be able to make a page scroll?
Bigyan Karki
@bigyankarki
Feb 15 2017 22:44
oh
Steven
@Ironwrangler
Feb 15 2017 22:44

What do i have to do to make this link to a site.

<div class="btnlist text-center">

<a class="btn btn-default" href="https://twitter.com/ironwrangler"<i class="fa fa-twitter fa-lg"id="twittericon"aria-hidden="true"></i>Twitter</a>
Duong Le
@leduong96
Feb 15 2017 22:45
hi guys
so..i have recently gotten to the tribute page challenge
and i need to say, im lost. It's like i've completely forgotten about everything i have learned
Bigyan Karki
@bigyankarki
Feb 15 2017 22:46
```
Duong Le
@leduong96
Feb 15 2017 22:46
can you guys help me to start somewhere?
Bigyan Karki
@bigyankarki
Feb 15 2017 22:46
$(".btn").click(function(){

  $(".btn").replaceWith('<form id="thisForm"><input class="input-lg" type= "search" id="inputField" placeholder= "Search"></form>')
});

 $("#thisForm").submit(function(){
   var input = document.getElementById("inputField").value;
  getData(input);
  console.log(input);
});
@sky this should solve the problem right?
Steven
@Ironwrangler
Feb 15 2017 22:47
@leduong96 it happened to me too.
Mac
@itchick85
Feb 15 2017 22:47
working on my portfolio how do I get my navbar elements separate? http://codepen.io/itchick85/pen/RKENBR
Gulsvi
@gulsvi
Feb 15 2017 22:47
@bigyankarki Does this help? http://codepen.io/skycoder/pen/NdJVPd
Duong Le
@leduong96
Feb 15 2017 22:48
@Ironwrangler what do you do to get back on your feet?
Steven
@Ironwrangler
Feb 15 2017 22:49
i went back to the beginning and wrote notes and did some of the lessons over @leduong96
Bigyan Karki
@bigyankarki
Feb 15 2017 22:50
@SkyCoder01 wow thanks i kinda have concept of what i should do
CamperBot
@camperbot
Feb 15 2017 22:50
:cookie: 207 | @skycoder01 |http://www.freecodecamp.com/skycoder01
bigyankarki sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
Bigyan Karki
@bigyankarki
Feb 15 2017 22:50
i will let you know if there is any prblem :)
Steven
@Ironwrangler
Feb 15 2017 22:51
@itchick85 check your messages
Gulsvi
@gulsvi
Feb 15 2017 22:53
@Ironwrangler You were missing a closing > on your <a> tag. If this is in codepen, add target="_blank" to your <a> tag as well.
<a class="btn btn-default" href="https://twitter.com/ironwrangler"><i class="fa fa-twitter fa-lg" id="twittericon" aria-hidden="true"></i>Twitter</a>
Bigyan Karki
@bigyankarki
Feb 15 2017 22:53
$(".btn").click(function(){

  $(".btn").replaceWith('<form id="thisForm"><input class="input-lg" type= "search" id="inputField" placeholder= "Search"></form>')
});

 $("#thisForm").submit(function(){
   var input = document.getElementById("inputField").value();
  getData(input);
  console.log(input);
});
this should work right?
Gulsvi
@gulsvi
Feb 15 2017 22:54
Does it?
Bigyan Karki
@bigyankarki
Feb 15 2017 22:55
idk i tried to look in console..but input doesnt show up
Finagl3
@Finagl3
Feb 15 2017 22:57
@leduong96 it helps to just put a header.
Gulsvi
@gulsvi
Feb 15 2017 22:57
Hmmm, I just looked and the page refreshes. Maybe you can create the HTML manually and then use jQuery to .hide() and .show() it before and after you click on the icon
Finagl3
@Finagl3
Feb 15 2017 22:57
@leduong96 when the screen isn't blank it's a loss less intimidating and easier to think of where to start.
Duong Le
@leduong96
Feb 15 2017 22:58
@Finagl3 Thank you Final3
CamperBot
@camperbot
Feb 15 2017 22:58
leduong96 sends brownie points to @finagl3 :sparkles: :thumbsup: :sparkles:
:cookie: 143 | @finagl3 |http://www.freecodecamp.com/finagl3
Gulsvi
@gulsvi
Feb 15 2017 22:59
@bigyankarki I don't know what the replaceWhith method does, maybe that has something to do with it :( maybe use .html()?
You may also have to do this to make it so the form doesn't refresh:
 $("#thisForm").submit(function(event){
   event.preventDefault();
Finagl3
@Finagl3
Feb 15 2017 22:59
So just do a header' change the font color or font family, change background color etc. Just simple things. I had to dot hat to actually get started.
@leduong96 your welcome
Bigyan Karki
@bigyankarki
Feb 15 2017 23:00
@SkyCoder01 do you mean i should use .hide() and .show() instead of replaceWith()
OKAY
Robert
@Brayn7
Feb 15 2017 23:00
anyone any good with react in here?
fvdave2017
@fvdave2017
Feb 15 2017 23:01
Does anyone know anything about data-spy? It does nothing for me when I implement it.
Gulsvi
@gulsvi
Feb 15 2017 23:06
@bigyankarki Actually, never mind... you have to put your .submit() in the same function where you generate the HTML:
$(".btn").click(function() {
  $(".btn").replaceWith('<form id="thisForm"><input class="input-lg" type= "search" id="inputField" placeholder= "Search"></form>')
  $("#thisForm").submit(function(event) {
    event.preventDefault();
    var input = $('#inputField').val();
    getData(input);
    console.log(input);
  });
});
That console.log()'s something
Finagl3
@Finagl3
Feb 15 2017 23:08
@itchick85 I had to use padding to separate them. Like 8px
Fabio
@Gentarozzo
Feb 15 2017 23:12
var ricerca = $("#input");
var inp = ricerca.val();
should this gimme me the value back?
Bigyan Karki
@bigyankarki
Feb 15 2017 23:12
@SkyCoder01 does it? I dont see anything in the console
Finagl3
@Finagl3
Feb 15 2017 23:13
Anyone willing to help with the portfolio project?
Gulsvi
@gulsvi
Feb 15 2017 23:15
@bigyankarki Yes, it works for me at least - put your .submit() in the .click(function()
Bigyan Karki
@bigyankarki
Feb 15 2017 23:18
@SkyCoder01 shows error
aj-willi
@aj-willi
Feb 15 2017 23:18
@Finagl3 what do you need help with mate?
Bigyan Karki
@bigyankarki
Feb 15 2017 23:18
i am sorry if i am being so annoying :D
Gulsvi
@gulsvi
Feb 15 2017 23:20
@bigyankarki You didn't copy the code correctly: var input = $('#inputField').val();
You had var input = $('inputField').value();
Finagl3
@Finagl3
Feb 15 2017 23:20
@aj-willi I'm trying to get my header centered horizontally and vertically on my background image. I've been working on trying tonfind this the past few days, but nothing I try works
aj-willi
@aj-willi
Feb 15 2017 23:21
can you make a jsfiddle? or show the code
Finagl3
@Finagl3
Feb 15 2017 23:22
@aj-willi I'm using bootstrap 3
aj-willi
@aj-willi
Feb 15 2017 23:22
hmm
link your html markup and css
i have bootstrap also
Finagl3
@Finagl3
Feb 15 2017 23:23
@aj-willi hold on trying to paste link and it's not working for some reason
There it goes
Had to restart app
Bigyan Karki
@bigyankarki
Feb 15 2017 23:24
@SkyCoder01 does the console show the input in yours?
Gulsvi
@gulsvi
Feb 15 2017 23:25
@bigyankarki Yes, it shows the value in the input field if you use var input = $('#inputField').val();
aj-willi
@aj-willi
Feb 15 2017 23:25
the header seems centered, what exactly are you trying to do? @Finagl3
Bigyan Karki
@bigyankarki
Feb 15 2017 23:26
@SkyCoder01 thanks
CamperBot
@camperbot
Feb 15 2017 23:26
bigyankarki sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:warning: bigyankarki already gave skycoder01 points
Bigyan Karki
@bigyankarki
Feb 15 2017 23:26
i was stuck for days in that one
Finagl3
@Finagl3
Feb 15 2017 23:26
I mean header as in text header. If you scroll down the name of the portfolio is all the way at the bottom, and I don't know why. WhenI want it in the center of the image.
Bigyan Karki
@bigyankarki
Feb 15 2017 23:27
now i need to solve the ajax part
Gulsvi
@gulsvi
Feb 15 2017 23:27
:sweat: That was tough, no problem
Finagl3
@Finagl3
Feb 15 2017 23:27
@aj-willi
aj-willi
@aj-willi
Feb 15 2017 23:27
ahh you want the text at top?
ok
Finagl3
@Finagl3
Feb 15 2017 23:27
Yes
fvdave2017
@fvdave2017
Feb 15 2017 23:27
I guess there are too many newbies on today. I can not seem to get any help with data-spy. I will try again another day.
Bigyan Karki
@bigyankarki
Feb 15 2017 23:27
/to get the required data from wikipedia API
function getData(input) {
  $.ajax({
    url: "https://en.wikipedia.org/w/api.php",
    dataType: "json",
    data: "method=get&format=json&list=search&srsearch=input",
    type: "GET",
    headers: {"api-user-agent" : "b.gyankarki@gmail.com"},
    success: function(wiki) {
      for (var i= 0; i< wiki.query.search.length; i++) {
        $(".content").append("<p>wiki.query.search.title[i]</p>");
      }
    }
  });
}
can you just give me an overview of whats wrong in this code?
i have adjusted the code, see if thats better

<div class="container-fluid">
<div class="homePage text-center">
<h1>Devver's Hub</h1>
</div>
</div> <!--container close-->

<div class= "container-fluid">
<ul class="nav nav-pills navbar-fixed-top">
<li id="name">Finagle</li>
<li class="pull-right">
<a href="#">Contact</a>
</li>
<li class = "pull-right">
<a href="#">Portfolio</a>
</li>
<li class = "pull-right">
<a href="#">Home</a>
</li>
</ul>
</div> <!--c-f close-->

<div class="container-fluid">
<div class="homePage text-center">
<h1>Devver's Hub</h1>
</div>
</div> <!--container close-->

<img src="http://ibithink.com/wp-content/uploads/2016/04/web-unsplash-med-1330x600.gif">
<!--Above this line ^ navbar-->

.nav-pills {
list-style-type: none;
background-color: black;
overflow: hidden;
font-size: 1.7em;
margin-bottom: 20px;
}

name {

font-family: Lobster;
color: white;
margin-top: 10px;
margin-left: 5px;
}
li a {
font-family: Arial;
color: yellow;
}
.active {
background-color: green;
color: black;
}
li {
float: left;
}
a {
display: block;
padding: 8px;
}
li a:hover {
background-color: green !important;
color: black;
text-decoration: none;
}
.homePage {
/home background image/
background: url("http://ibithink.com/wp-content/uploads/2016/04/web-unsplash-med-1330x600.gif");
background-repeat: no-repeat;
width: 100%;
padding-top: 100%;
}
h1 {
color: green;
font-family: Lobster;
}

/
background-repeat: no-repeat;
padding-top: 100%;
max-height: 800px;
/

Gulsvi
@gulsvi
Feb 15 2017 23:33
@bigyankarki I didn't use ajax for my wikipedia, just getJSON, but this looks wrong: data: "method=get&format=json&list=search&srsearch=input",
Finagl3
@Finagl3
Feb 15 2017 23:33
@aj-willi I looked and I don't see any difference. Can't even see any changes in the code...
Bigyan Karki
@bigyankarki
Feb 15 2017 23:34
@SkyCoder01 i will check that :)
aj-willi
@aj-willi
Feb 15 2017 23:35
link is not saving code, what you need to do is remove the img css you have and replace it with an img src on your markup. put the h1 container at the top
Bigyan Karki
@bigyankarki
Feb 15 2017 23:36
$(".btn").click(function(){

  $(".btn").replaceWith('<form id="thisForm"><input class="input-lg" type= "search" id="inputField" placeholder= "Search"></form>')
 $("#thisForm").submit(function(event){
   event.preventDefault();
   var input = $('#inputField').val();
  getData(input);
  console.log(input);
   });
});
@SkyCoder01 we can call getData(input) here right?
Finagl3
@Finagl3
Feb 15 2017 23:37
@aj-willi would the nav bar still show up at the top if i move the h1 above it?
Finagl3
@Finagl3
Feb 15 2017 23:38
@aj-willi so instead of making a class in css that contains the image, I just need to put the image directly into the html portion?
Gulsvi
@gulsvi
Feb 15 2017 23:38
@bigyankarki Put console.log(input) in your getData function to test it out :)
Bigyan Karki
@bigyankarki
Feb 15 2017 23:39
XMLHttpRequest cannot load https://en.wikipedia.org/w/api.php?method=get&format=json&list=search&srsearch=input. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://s.codepen.io' is therefore not allowed access.
aj-willi
@aj-willi
Feb 15 2017 23:39
@Finagl3 there is different options, but i think its most practical
Bigyan Karki
@bigyankarki
Feb 15 2017 23:39
this is the error i got
so that means it is working right @SkyCoder01 ?
Gulsvi
@gulsvi
Feb 15 2017 23:40
Yes, it means your api call is going through
Finagl3
@Finagl3
Feb 15 2017 23:40
@aj-willi thank you. I will give it a shot.
CamperBot
@camperbot
Feb 15 2017 23:40
finagl3 sends brownie points to @aj-willi :sparkles: :thumbsup: :sparkles:
:cookie: 267 | @aj-willi |http://www.freecodecamp.com/aj-willi
Bigyan Karki
@bigyankarki
Feb 15 2017 23:51
@SkyCoder01 can you give me some links where I can know more about how API works?
Gulsvi
@gulsvi
Feb 15 2017 23:53
@bigyankarki I don't really have any :( I just started learning JavaScript a little over a month ago but have been going to a javascript meetup every weekend and people have been helping me there. I'm also reading through this book: http://eloquentjavascript.net/ and these documents: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference
Bigyan Karki
@bigyankarki
Feb 15 2017 23:54
@SkyCoder01 thats so cool
i wish there were any JS meetup here in NJ too
Gulsvi
@gulsvi
Feb 15 2017 23:55
Helping people here has taught me a lot too, I may try playing around with ajax so I can help more
Bigyan Karki
@bigyankarki
Feb 15 2017 23:57
thats cool @SkyCoder01 :)