These are chat archives for FreeCodeCamp/HelpFrontEnd

22nd
Sep 2016
Salomon
@zarruk
Sep 22 2016 00:00
@wearenotgroot when I do it on Safari, still wont work!
JD Tadlock
@jdtdesigns
Sep 22 2016 00:17
@zarruk You're declaring variables inside the geolocation function then trying to use them outside that function. Also, the info is async so you will need to call your getweather
from inside the geolocation function after setting the variables
Declare the vars at the top, then set them inside geolocation.
This message was deleted
Salomon
@zarruk
Sep 22 2016 00:25
@jdtdesigns http://codepen.io/zarruk/pen/dpNyOj?editors=0010 I did what you said and still wont work :(
JD Tadlock
@jdtdesigns
Sep 22 2016 00:29
@zarruk Looks the same. If you're using Chrome you can't use the navigator without being on https. Open weather requires premium service to use https. You'll need to use an ip locator for chrome and navigator for the others.
Salomon
@zarruk
Sep 22 2016 00:30
@jdtdesigns when I use it in Safari, wont work either
JD Tadlock
@jdtdesigns
Sep 22 2016 00:30
Because your code is wrong ;)
Stacey Landrum
@staceyland
Sep 22 2016 00:31
I'm having problems with my portfolio. Can someone explain why "my New Portfolio website" runs into my navbar?? http://codepen.io/staceyland/pen/ZpBdoX
Chris Cullen
@123xylem
Sep 22 2016 00:32
Where Can i find a website with URL based sound bytes to upload to Js??
Walid Ashri
@walidashri
Sep 22 2016 01:01
hi any body knows how to make the pomodoro clock background color with css
Michael Bomholt
@bomholtm
Sep 22 2016 01:06
@AshriSoft ?
Walid Ashri
@walidashri
Sep 22 2016 01:10
@bomholt when the clock almost to end the background color changing gradually to green or red
Walid Ashri
@walidashri
Sep 22 2016 01:12
@staceyland body { padding-top: 70px; } add this
Michael Bomholt
@bomholtm
Sep 22 2016 01:13
thats what i posted ^^
you mean how to change css per js? @AshriSoft
the css is background-color: #fff but that can't be your problem if you are doing the pomodoro clock already ^^
with JS add .style.background-color = "#fff" to an element
Stacey Landrum
@staceyland
Sep 22 2016 01:19
Thanks @bomholt @AshriSoft
CamperBot
@camperbot
Sep 22 2016 01:19
staceyland sends brownie points to @bomholt and @ashrisoft :sparkles: :thumbsup: :sparkles:
:cookie: 310 | @ashrisoft |http://www.freecodecamp.com/ashrisoft
:cookie: 555 | @bomholt |http://www.freecodecamp.com/bomholt
Amit Patel
@AmitP88
Sep 22 2016 01:24
hey guys, I can't figure out why my Demo buttons don't work on my site: https://amitp88.github.io/New-Portfolio/
but the Repo buttons do
I've inspected my code and I can't find what's the difference
also on my hamburger menu, I can't seem to change the color of the hamburger in toggle form (when it turns into an X)
Alex
@delk0
Sep 22 2016 01:30
guys what are your favourite fonts?
looking for fresh ideas
the ubuntu one was a great discovery
never actually thought of using it on a website lol
Kyle
@keyspress
Sep 22 2016 01:53
could someone help me figure out why my navbar hamburger menu won't toggle my links when my screen size goes small? links work fine but the drop down just doesn't appear. not sure what it is i am missing. https://codepen.io/keyspress/pen/YGpGPP
Ken Haduch
@khaduch
Sep 22 2016 02:02
@keyspress - make sure that you have (in your JS panel) the external libraries jquery.js, and bootstrap.js, loaded in that order - jquery first, bootstrap second. That is what makes the menu expand.
Kyle
@keyspress
Sep 22 2016 02:04
@khaduch oh man, thank you so much. that fixed it.
CamperBot
@camperbot
Sep 22 2016 02:04
keyspress sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1705 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Sep 22 2016 02:05
@keyspress - you're welcome. I don't think that you need jquery-ui to be loaded?
Kyle
@keyspress
Sep 22 2016 02:07
@khaduch yeah, i loaded that one out of desperation lol. i took it out now
Igor Amidzic
@igoramidzic
Sep 22 2016 02:10
Can someone check to see if this is how I'm allowed to write my js?
JS inside of jQuery??
Also, can you find what is wrong on line 11?
http://codepen.io/amidzicigor/pen/JREGyq
Walid Ashri
@walidashri
Sep 22 2016 02:17
@amidzicigor else if ==> not elseif
Igor Amidzic
@igoramidzic
Sep 22 2016 02:18
@AshriSoft Thank you
CamperBot
@camperbot
Sep 22 2016 02:18
amidzicigor sends brownie points to @ashrisoft :sparkles: :thumbsup: :sparkles:
:cookie: 312 | @ashrisoft |http://www.freecodecamp.com/ashrisoft
Koua Thao
@kthao91
Sep 22 2016 02:24
@AmitP88 not sure why but it has something to do with your span element
Amit Patel
@AmitP88
Sep 22 2016 02:39
@kthao91 yeah, I was thinking that too, but I don't know why or what, since both span elements for the demo and repo buttons are the same
oh wait, nvm. lemme check
Timothy
@timothycdykes
Sep 22 2016 03:05
Can someone help me - I can't find out why my openweathermap API is returning undefined for weather.main and weather.description when they should be Rain and heavy intensity rain for the area I am debugging with (Minneapolis): http://codepen.io/a_melomaniac/pen/EgNyjb
All of my other variables are assigning and logging to the console.
Timothy
@timothycdykes
Sep 22 2016 03:13
Nevermind! I found the problem. I'm supposed to use weather[0].main
Gikuyu Nderitu
@GikuyuNderitu
Sep 22 2016 03:53
could I get some feedback on a project?
Algorri
@Algorri
Sep 22 2016 04:02
I require some help on the Random Quote Machine project. I was well on my way until I noticed I have no idea where I am to get the quotes from. Is there an API to a website out there that can help with this, or do I have to write a JSON of my own with quotes? Any assistance would be appreciated.
Gikuyu Nderitu
@GikuyuNderitu
Sep 22 2016 04:04
Yea, you can take your pick from the results when you google random quote generator
Algorri
@Algorri
Sep 22 2016 04:04
@GikuyuNderitu Thank you. Turns out there are quite a few.
CamperBot
@camperbot
Sep 22 2016 04:04
algorri sends brownie points to @gikuyunderitu :sparkles: :thumbsup: :sparkles:
:cookie: 294 | @gikuyunderitu |http://www.freecodecamp.com/gikuyunderitu
Gikuyu Nderitu
@GikuyuNderitu
Sep 22 2016 04:05
@Algorri no problem!
Manikanth
@manikanth1024
Sep 22 2016 05:34
what is the best source to embed video calling service to embed into a site?
Juwdohr
@Juwdohr
Sep 22 2016 05:47
Hey all, I'm trying to fix my Twitch Viewer does anyone know what the Redirect URI is supposed to be? Not understanding what the oauth_authorization in the URL is supped to be?
Juwdohr
@Juwdohr
Sep 22 2016 06:31
Does anyone know how to get the authorization for the Twitch API?
How could I center the span element "Erick Delfin" ?
center vertically*
Erick Delfin
@Nifled
Sep 22 2016 07:37
:worried:
kirbyedy
@kirbyedy
Sep 22 2016 07:38
I dont understand the question
Erick Delfin
@Nifled
Sep 22 2016 07:39
@kirbyedy I literally just want "Erick Delfin" to be vertically centered
gemaderus
@gemaderus
Sep 22 2016 07:42
@Nifled you can use: span {line-height: 71px};
@Nifled the same line-height that the height of the other elements
Erick Delfin
@Nifled
Sep 22 2016 07:46
@gemaderus How would you know that the height of the other elements is 71px?
just asking, I really want to get the hang of this
gemaderus
@gemaderus
Sep 22 2016 07:47
@Nifled open the console, do rollover over the other elements and you can see the height and the width of them
@Nifled with flexbox is better than the line-height
Erick Delfin
@Nifled
Sep 22 2016 07:51
@gemaderus I've tried with flexbox so much, it just won't work
gemaderus
@gemaderus
Sep 22 2016 07:51
@Nifled here you have a guide about flexbox https://css-tricks.com/snippets/css/a-guide-to-flexbox/ If you have any question tell me
Erick Delfin
@Nifled
Sep 22 2016 07:51
but the line-height approach works
@gemaderus Thanks for the additional help.
CamperBot
@camperbot
Sep 22 2016 07:52
nifled sends brownie points to @gemaderus :sparkles: :thumbsup: :sparkles:
:cookie: 273 | @gemaderus |http://www.freecodecamp.com/gemaderus
gemaderus
@gemaderus
Sep 22 2016 07:54
@Nifled delete the line-height and put in the parent row {display: flex;
align-items: center;}
Erick Delfin
@Nifled
Sep 22 2016 07:56
wow, that is just perfect. Thank you so much! @gemaderus I will get to reading the flexbox guide.
CamperBot
@camperbot
Sep 22 2016 07:56
nifled sends brownie points to @gemaderus :sparkles: :thumbsup: :sparkles:
:warning: nifled already gave gemaderus points
gemaderus
@gemaderus
Sep 22 2016 07:57
@Nifled you're welcome!
dbtate
@dbtate
Sep 22 2016 09:01
Hi, I'm working on the tribute page and can't seem to get jQuery to work in codepen. Is there a known issue? My code is identical to that used in the lessons
Andrew Seravkin
@ndrsrv
Sep 22 2016 09:08
@dbtate settings -> javascript -> quickadd -> jquery
dbtate
@dbtate
Sep 22 2016 09:41
Hi Andrew, thanks for your help. It still doesn't seem to be working.
Here's the code:

<script>
$(document).ready(function() {
$("#myTitle").css("color","red");
});
</script>

<h1 id="myTitle">Leonhard Euler</h1>

The colour isn't changing though
Stephen James
@sjames1958gm
Sep 22 2016 10:02
@dbtate You can link your codepen page here
kirbyedy
@kirbyedy
Sep 22 2016 10:04
@dbtate did you load the jquery library ?
dbtate
@dbtate
Sep 22 2016 10:05
@sjames1958gm thanks, here's the link: http://codepen.io/dbtate/pen/kkgPqV
CamperBot
@camperbot
Sep 22 2016 10:05
dbtate sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 3412 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
dbtate
@dbtate
Sep 22 2016 10:06
@kirbyedy I did 'quick add' of jQuery in the JavaScript window. Is that correct?
kirbyedy
@kirbyedy
Sep 22 2016 10:06
yes
in this case, you better put that styling in the css part
Stephen James
@sjames1958gm
Sep 22 2016 10:07
@dbtate Put your javascript into the js section to ensure that the jquery is loaded before your code is run
Theodore P.
@Ierofantis
Sep 22 2016 10:08
@Ierofantis
Does anybody know how to link on my html/ejs template with href a router with parameters like this:/title/:name?
I tried something like this a href="/title/<%= user.name%>">Press</a> but noope
And here is the rendering lineres.render("title.ejs", { user: user });
kirbyedy
@kirbyedy
Sep 22 2016 10:08
@dbtate
#myTitle {
  color: red;
}
dbtate
@dbtate
Sep 22 2016 10:09
@kirbyedy thank you, that worked straight away. Is that doing the same thing essentially? The only reason I was trying to use that code in particular was because that is what I've just learnt
CamperBot
@camperbot
Sep 22 2016 10:09
dbtate sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1403 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
kirbyedy
@kirbyedy
Sep 22 2016 10:10
its the same thing, but styling is usually done in the css part
you did it through jquery
dbtate
@dbtate
Sep 22 2016 10:14
Is there a reason the jQuery wouldn't work?
I've just been learning addClass(), css(), appendTo(), etc. and was trying to test those functions in codepen
Stephen James
@sjames1958gm
Sep 22 2016 10:20
@dbtate If you put the javascript in the js section of codepen it does work
dbtate
@dbtate
Sep 22 2016 10:23
@sjames1958gm thank you for that, it does too!
CamperBot
@camperbot
Sep 22 2016 10:23
dbtate sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:warning: dbtate already gave sjames1958gm points
dbtate
@dbtate
Sep 22 2016 10:23
That makes sense, too.
dbtate
@dbtate
Sep 22 2016 10:28
@sjames1958gm would I be correct in saying, in a simplified manner, that HTML is a webpage's content, CSS is its appearance/design, and JavaScript is its functionality?
Stephen James
@sjames1958gm
Sep 22 2016 10:28
@dbtate Yes
dbtate
@dbtate
Sep 22 2016 10:32
@sjames1958gm awesome! Thank you. Only just getting started so still wrapping my head around all of this as I'm a total beginner. Thanks again for your help, I really appreciate it. I'm off to start working in codepen again.. Take care!
CamperBot
@camperbot
Sep 22 2016 10:32
dbtate sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:warning: dbtate already gave sjames1958gm points
sourabhatt
@sourabhatt
Sep 22 2016 10:37
Help please
in Build a Tribute Page i am getting an error that the server unexpectedly closed the connection.
CamperBot
@camperbot
Sep 22 2016 10:37
no wiki entry for: pleasein build a tribute page i am getting an error that the server unexpectedly closed the connection
sourabhatt
@sourabhatt
Sep 22 2016 10:37
what this is all about ??
Mokubao
@mokubao
Sep 22 2016 10:38
This message was deleted
This message was deleted
Hi, can someone tell my why for the temperature class in my code when I use a conditional expression it disappears and when I use if else the units only change once. http://codepen.io/Mokubao/pen/JRdpXq
sourabhatt
@sourabhatt
Sep 22 2016 10:40
blob
This message was deleted
blob
Help please
in Build a Tribute Page i am getting an error that the server unexpectedly closed the connection.
CamperBot
@camperbot
Sep 22 2016 10:41
no wiki entry for: pleasein build a tribute page i am getting an error that the server unexpectedly closed the connection
sourabhatt
@sourabhatt
Sep 22 2016 10:41
blob
is this issue same with everyone ??
Travis Cameron
@TravCamer
Sep 22 2016 10:49
no issues here - this is a link to the video that's not loading for you: https://youtu.be/qqrnzmqCGDw
sourabhatt
@sourabhatt
Sep 22 2016 10:52
@TravCamer youtube access is prohibited on my desktop :(
Travis Cameron
@TravCamer
Sep 22 2016 10:53
@sourabhatt bummer dude. let me see if i can find a mirror on another site. the video more or less just outlines the rule/steps on the left side of the page.
Travis Cameron
@TravCamer
Sep 22 2016 10:59
@sourabhatt how about this? https://vimeo.com/154927651
Stephen James
@sjames1958gm
Sep 22 2016 11:15
@mokubao $(".temperature").html(Ctemp + CtempSym) this probably always return something truthy so it never gets to the else in your click handler.
You probably should have a "global" that says which type of temperature is being displayed
@mokubao initialize celsius to true
      if(celsius){
         $(".temperature").html(Ftemp + FtempSym);
         celsius = false;
        }else{
         $(".temperature").html(Ctemp + CtempSym);
         celsius = true;
         }
Stephen James
@sjames1958gm
Sep 22 2016 11:16
@vtarun What do you need?
vtarun
@vtarun
Sep 22 2016 11:17
what is "?" in the api.
Stephen James
@sjames1958gm
Sep 22 2016 11:17
@vtarun Are you using $.getJSON?
vtarun
@vtarun
Sep 22 2016 11:17
no
Mokubao
@mokubao
Sep 22 2016 11:17
@sjames1958gm too some time to understand but thanks man
CamperBot
@camperbot
Sep 22 2016 11:17
:star2: 3413 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
mokubao sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
vtarun
@vtarun
Sep 22 2016 11:17

this is my code
$.ajax({
url: "http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&lang=en&jsonp=?",

// The name of the callback parameter, as specified by the YQL service
jsonp : "callback" , 
// Tell jQuery we're expecting JSONP
dataType : "jsonp",
success: function( response ) {
    console.log( response.quoteText); // server response
},
cache: false

});

William Maes
@maeswilliam
Sep 22 2016 11:20
hi
<header class="main-header">
    <div class="container">
        <h1 class="name">Wild horses <span>tour</span></h1>
Which selector do i need to use to select the span in css
is it .main-header .name and thenN
Hansi2468
@Hansi2468
Sep 22 2016 11:20
Hi! I need som help with scopes. I am tryng to check if str is the same forwards as backwards, any one that can help=
if (str1=== str){
str = str.split("");
str = str.reverse();
var str1 = str.join("");
return true;}
Andrew Seravkin
@ndrsrv
Sep 22 2016 11:21
@maeswilliam use span{}
William Maes
@maeswilliam
Sep 22 2016 11:21
@ndrsrv even if i alleady have other spans?
vtarun
@vtarun
Sep 22 2016 11:22

@sjames1958gm
this is my code
$.ajax({
url: "http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&lang=en&jsonp=?",

// The name of the callback parameter, as specified by the YQL service
jsonp : "callback" , 
// Tell jQuery we're expecting JSONP
dataType : "jsonp",
success: function( response ) {
    console.log( response.quoteText); // server response
},
cache: false

});

Stephen James
@sjames1958gm
Sep 22 2016 11:22
@vtarun The ? tells jquery to fill in its own callback function for jsonp.
I ran that code in codepen and the following was sent (crossorigin was to solve some issue
https://crossorigin.me/http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&lang=en&jsonp=jQuery31007955132176370245_1474543217636&_=1474543217637
William Maes
@maeswilliam
Sep 22 2016 11:22
@ndrsrv also it doesn't work it targets the other spans
Stephen James
@sjames1958gm
Sep 22 2016 11:23
@Hansi2468 Your code is testing str1 before it is even set to any value
Andrew Seravkin
@ndrsrv
Sep 22 2016 11:23
@maeswilliam .name span{} or h1.name span{}
Hansi2468
@Hansi2468
Sep 22 2016 11:23
@sjames1958gm Okay - but how do I do it?
vtarun
@vtarun
Sep 22 2016 11:23
@sjames1958gm this is working... i saw response in console
William Maes
@maeswilliam
Sep 22 2016 11:24
@ndrsrv Not working
Stephen James
@sjames1958gm
Sep 22 2016 11:24
@vtarun I only added crossorign.me to get it to work in jsbin
@Hansi2468 The code that sets str1 goes before the if
Hansi2468
@Hansi2468
Sep 22 2016 11:25

@sjames1958gm so like this
function palindrome(str) {
str = str.split("");
str = str.reverse();
var newstr = str.join("");

if (str=== newstr){
return true;}

vtarun
@vtarun
Sep 22 2016 11:26
@sjames1958gm if u open this link in chrome , it will give response
http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&lang=en&jsonp=?
Stephen James
@sjames1958gm
Sep 22 2016 11:26
@Hansi2468 Well, yes except you have replaced str with an array
@vtarun Yes it does, if you notice there is a ? in the front - when you use $.ajax the ? is not sent but jquery fills in a callback name
@vtarun
?({"quoteText":"Into each life rain must fall but rain can be the giver of life and it is all in your attitude that makes rain produce sunshine. ", "quoteAuthor":" Byron Pulsifer", "senderName":"", "senderLink":"", "quoteLink":"http://forismatic.com/en/035bb0a5bb/"})
Hansi2468
@Hansi2468
Sep 22 2016 11:28
@sjames1958gm Okay - i’ve changed it back to a string now
Stephen James
@sjames1958gm
Sep 22 2016 11:29
@Hansi2468 Probably need to create a different variable when you do the first split("")
vtarun
@vtarun
Sep 22 2016 11:30
@sjames1958gm can u please suggest any blog or tutorials where i can get learn ajax and api ?
Hansi2468
@Hansi2468
Sep 22 2016 11:31

@sjames1958gm Like this?
function palindrome(str) {
var str1 = str.split("");
var str2 = str1.reverse();
var str3 = str1.join("");

if (str=== str3){
return true;}
if (str != str3) {
return false;
}

Stephen James
@sjames1958gm
Sep 22 2016 11:34
@Hansi2468 Your join should use str2
@vtarun I would just search on youtube - I don't have any specific ones to advise
Hansi2468
@Hansi2468
Sep 22 2016 11:35
@sjames1958gm oh yeah thanks
CamperBot
@camperbot
Sep 22 2016 11:35
hansi2468 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 3414 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Sep 22 2016 11:35
@Hansi2468 You can just do return str === str3;
hellboy81
@hellboy81
Sep 22 2016 11:35
How can I implement this layout in BS ?
Hansi2468
@Hansi2468
Sep 22 2016 11:37
@sjames1958gm What is the advantage of writting that?
Stephen James
@sjames1958gm
Sep 22 2016 11:38
@Hansi2468 Less code, also the intent is more specific
rujaraju
@rujaraju
Sep 22 2016 11:38
Has anybody any idea why this script won't get the json that the url is pointing at (the url works just fine if you open it regularly in the browser)? http://codepen.io/rujaraju/pen/zKNwRA
Hansi2468
@Hansi2468
Sep 22 2016 11:39
@sjames1958gm allright, could you tell me why this palindrome("A man, a plan, a canal. Panama”) doesn’t return true?
Stephen James
@sjames1958gm
Sep 22 2016 11:40
@Hansi2468 Becuase you didn't implement all the instructions - before you reverse you need to remove all non letters and numbers
Gordon
@gordoh
Sep 22 2016 11:41
@Hansi2468 and capitals
Hansi2468
@Hansi2468
Sep 22 2016 11:42
@gordoh @sjames1958gm what is the command for that=
William Maes
@maeswilliam
Sep 22 2016 11:42
@ndrsrv thanks it worked, my brackets was troubleshooting ^^
CamperBot
@camperbot
Sep 22 2016 11:42
maeswilliam sends brownie points to @ndrsrv :sparkles: :thumbsup: :sparkles:
:cookie: 345 | @ndrsrv |http://www.freecodecamp.com/ndrsrv
Gordon
@gordoh
Sep 22 2016 11:42
@Hansi2468 toLowerCase()

@rujaraju the console returns this error

XMLHttpRequest cannot load http://www.geoplugin.net/json.gp?ip=137.163.145.183. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://s.codepen.io' is therefore not allowed access.

There is an issue with your API. I had this earlier with the Wikipedia API. I had to add origin=* to the url
I am not sure if it works the same with that API though.
sourabhatt
@sourabhatt
Sep 22 2016 11:47
@TravCamer thank you so much for helping me out, thanks a lot
CamperBot
@camperbot
Sep 22 2016 11:47
sourabhatt sends brownie points to @travcamer :sparkles: :thumbsup: :sparkles:
:cookie: 120 | @travcamer |http://www.freecodecamp.com/travcamer
sourabhatt
@sourabhatt
Sep 22 2016 11:48
@TravCamer also if u can send me the previous youtube videos
Watch Coding Videos on our YouTube Channel, gear up for success challenge
Travis Cameron
@TravCamer
Sep 22 2016 11:50
@sourabhatt gladly, here is a link to the fcc videos on Videom: https://vimeo.com/search?q=free+code+camp
sourabhatt
@sourabhatt
Sep 22 2016 11:51
@TravCamer that's awesome travis, thanks :)
CamperBot
@camperbot
Sep 22 2016 11:51
sourabhatt sends brownie points to @travcamer :sparkles: :thumbsup: :sparkles:
:warning: sourabhatt already gave travcamer points
rujaraju
@rujaraju
Sep 22 2016 11:58
@gordoh thanks! seems like a messy problem with no simple solution..
CamperBot
@camperbot
Sep 22 2016 11:58
:cookie: 273 | @gordoh |http://www.freecodecamp.com/gordoh
rujaraju sends brownie points to @gordoh :sparkles: :thumbsup: :sparkles:
Gordon
@gordoh
Sep 22 2016 11:59
It took me about an hour to figure it out earlier today. I had to read through the documentation for the API @rujaraju . I hope this works for you
Simon Cordova
@gbsimon87
Sep 22 2016 12:02
Good afternoon!
I have a question regarding HTML and jquery if anyone could offer help...
kirbyedy
@kirbyedy
Sep 22 2016 12:05
so?
how do i access the weather id in this json with jquery?
i retrieved it as "data" but data.weather[0].id doesnt work?
kirbyedy
@kirbyedy
Sep 22 2016 12:13
data.weather[0].id
this works for me
Mokubao
@mokubao
Sep 22 2016 12:20
@kirbyedy okay, i'll try to see what's wrong with my code, thanks
CamperBot
@camperbot
Sep 22 2016 12:20
mokubao sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1404 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
kirbyedy
@kirbyedy
Sep 22 2016 12:21
any console log ?
Mokubao
@mokubao
Sep 22 2016 12:22
nothing coming out on console though
kirbyedy
@kirbyedy
Sep 22 2016 12:22
strange
are you getting the other data properly ?
Mokubao
@mokubao
Sep 22 2016 12:24
yeah, the only other data I'm retrieving is data.main.temp and it works fine
kirbyedy
@kirbyedy
Sep 22 2016 12:25
if you log the whole object does that weather id show ?
Mokubao
@mokubao
Sep 22 2016 12:29
hmm, i tried storing it in something called "weatherId" first instead of just using it in switch(data.weather[0].id) and it worked
kirbyedy
@kirbyedy
Sep 22 2016 12:32
well normally thats how you should do it
Mokubao
@mokubao
Sep 22 2016 12:32
oh, it's something like a best practice thing?
kirbyedy
@kirbyedy
Sep 22 2016 12:33
yea, store it in the variable then do something with it
Mokubao
@mokubao
Sep 22 2016 12:33
Okay, got it. Thanks man
grantknaver
@grantknaver
Sep 22 2016 12:52
anyone have any idea how to transition from < 768px width, to a full page layout run by bootstrap columns?
I have both sections built I dont know how to execute the change?
kirbyedy
@kirbyedy
Sep 22 2016 12:55
if you used bootstraps syntax it should work automatically
if not, explore the media query
Simon Cordova
@gbsimon87
Sep 22 2016 13:05
Hey guys! I'm having trouble chaining some CSS elements using jQuery, anyone mind helping?
div.card {
    width: 250px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    text-align: center;
}
I just need to know how to do the box-shadow part
Moses
@oh-moses
Sep 22 2016 13:10

Hey guys, just a little help with CSS layout, please...

According to every tutorial or Stackoverflow discussion I checked, this should make the 'content' div stretch to fill the rest of the container after the headers have taken up the alocated space. For me, that's not happening, the 'content' div is tightly wrapped around the content inside. Any ideas?

#container {
  display: flex;
  flex-direction: column;
  width: 400px;
  height: 400px;
}

#header1 {
  flex: 0 1 40px;
}

#header2 {
  flex: 0 1 80px;
}

#content {
  flex: 1 1 auto;
}
grantknaver
@grantknaver
Sep 22 2016 13:17
@kirbyedy thanks
CamperBot
@camperbot
Sep 22 2016 13:17
grantknaver sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1405 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Mehdi
@Medi2006
Sep 22 2016 13:19
hey guys i m getting this with my wikipedia challenge if someone would like to take a look it will be nice
ReferenceError: valeur is not defined
Kevin Mulligan
@kmulligan
Sep 22 2016 13:21
Can someone help me stack my Simon Game controls on top of the actual game? It is currently covered up and CSS is not my forte. http://codepen.io/kmulligan/pen/ammPvA
Kevin Davis
@osfan501
Sep 22 2016 13:22
Moses
@oh-moses
Sep 22 2016 13:24
Oh, nvm, I'm an idiot; it does work
Kevin Mulligan
@kmulligan
Sep 22 2016 13:26
@osfan501 Have not, will look later today
@osfan501 Well that was easy
@osfan501 thanks!
CamperBot
@camperbot
Sep 22 2016 13:28
kmulligan sends brownie points to @osfan501 :sparkles: :thumbsup: :sparkles:
:cookie: 273 | @osfan501 |http://www.freecodecamp.com/osfan501
Kevin Davis
@osfan501
Sep 22 2016 13:29
I'm glad you guys got it figured out! :smile:
grantknaver
@grantknaver
Sep 22 2016 13:31
I can get this media queries to work with pixels and everything works fine, but the bootstrap site says this should work > @media (min-width: @screen-sm-min) {...} why wont it?
This is a curious question more than anything. I literally copied the code mentioned on the bootstrap site to see if it would work, but with no success.
Vipul Basapati
@bvipul
Sep 22 2016 13:35
@janine9vn sorry for the late reply. probably you have to look back to what you have said that made me reply.... so here is what you said
@bvipul From what I can tell it has to do you with you adding the custom class name for each user. If I remove that, it does break some of the formatting, but it brings back the links. Is there any reason why each individual user gets its own class?
kirbyedy
@kirbyedy
Sep 22 2016 13:36
@grantknaver link
Vipul Basapati
@bvipul
Sep 22 2016 13:36
@janine9vn so the classes that are made for each user is dynamically made, not made it statically, so my javascript code makes the class for each user dynamically thats why there are classes of each of their name
Kevin Davis
@osfan501
Sep 22 2016 13:36
@grantknaver that looks like a sass type of thing. Try running it with a sass compiler
Jess Callahan
@JessCallahanSEO
Sep 22 2016 13:47
Hey how is everyone this morning
can i see someones tribute page?
im curious what it means about personal style
Jess Callahan
@JessCallahanSEO
Sep 22 2016 13:50
im sort of square when it comes to doing projects
Vipul Basapati
@bvipul
Sep 22 2016 13:50
here it is @JessCallahanSEO
Jess Callahan
@JessCallahanSEO
Sep 22 2016 13:50
i do whats required
thanks @bvipul
CamperBot
@camperbot
Sep 22 2016 13:50
jesscallahanseo sends brownie points to @bvipul :sparkles: :thumbsup: :sparkles:
:cookie: 285 | @bvipul |http://www.freecodecamp.com/bvipul
Gordon
@gordoh
Sep 22 2016 13:50
@JessCallahanSEO basically you just make a tribute to somebody that you can relate to
Vipul Basapati
@bvipul
Sep 22 2016 13:50
yeah, just anyone you admire
Gordon
@gordoh
Sep 22 2016 13:51
@JessCallahanSEO Its actually a really fun project and its open to anything. Like you can even tribute a cartoon character if you wanna
Monesul Haque
@mones-cse
Sep 22 2016 13:51
@JessCallahanSEO here is mine :)
http://codepen.io/m1s/full/pbjMzK/
Jess Callahan
@JessCallahanSEO
Sep 22 2016 13:51
@gordoh i got ya i know whom/ what i want to tribute
its just the recreation
Gordon
@gordoh
Sep 22 2016 13:52
@JessCallahanSEO Its just to teach you html / css / bootstrap. Its open to your own creativity.
by the way @mones-cse thats an awesome tribute page!
Monesul Haque
@mones-cse
Sep 22 2016 13:53
:D
Jess Callahan
@JessCallahanSEO
Sep 22 2016 13:53
@mones-cse yeh i was just about to say thanks for sharing that
CamperBot
@camperbot
Sep 22 2016 13:53
jesscallahanseo sends brownie points to @mones-cse :sparkles: :thumbsup: :sparkles:
:cookie: 393 | @mones-cse |http://www.freecodecamp.com/mones-cse
Jess Callahan
@JessCallahanSEO
Sep 22 2016 13:53
that is totally swagged out
1338
@1338
Sep 22 2016 13:53
I actually started doing that just now. http://codepen.io/1338/pen/gwgGAG
Guess I have a bit to go though.
Monesul Haque
@mones-cse
Sep 22 2016 13:55
:)
Jess Callahan
@JessCallahanSEO
Sep 22 2016 13:55
you all have me hype to do this now
Monesul Haque
@mones-cse
Sep 22 2016 13:55
great to know that :)
Jess Callahan
@JessCallahanSEO
Sep 22 2016 13:55
but alas i have to go do my day job until this is my day job
Stephen James
@sjames1958gm
Sep 22 2016 13:56
@JessCallahanSEO :)
Monesul Haque
@mones-cse
Sep 22 2016 13:56
@JessCallahanSEO what is your current day job ?
Jess Callahan
@JessCallahanSEO
Sep 22 2016 13:56
heres to hoping the rain makes for a short day since our patio will be closed
@mones-cse i bartend and wait tables
Marc Droz
@b1tc0de
Sep 22 2016 13:56
how do i make col-md-3 to re-arrange in pairs instead of each col re-arranging individualy?
Jess Callahan
@JessCallahanSEO
Sep 22 2016 13:56
i love it
but i love this too
Monesul Haque
@mones-cse
Sep 22 2016 13:57
@JessCallahanSEO hope you will be soon a kick ass developer :)
1338
@1338
Sep 22 2016 13:57
you mean have 2 columns in 1 row? if so change to col-md-6 for those.
Marc Droz
@b1tc0de
Sep 22 2016 13:57
yeah
Jess Callahan
@JessCallahanSEO
Sep 22 2016 13:57
well doing seo and seeing peoples businesses doing well
Marc Droz
@b1tc0de
Sep 22 2016 13:57
thanks for clarifying
oooooh duuuuuuhhh lol thanks so much lol
1338
@1338
Sep 22 2016 13:58
Sure thing. :)
Marc Droz
@b1tc0de
Sep 22 2016 13:58
thanks @1338
CamperBot
@camperbot
Sep 22 2016 13:58
b1tc0de sends brownie points to @1338 :sparkles: :thumbsup: :sparkles:
:cookie: 119 | @1338 |http://www.freecodecamp.com/1338
rusmex
@rusmex
Sep 22 2016 13:58
so layout is made in CSS or Bootstrap or combination?
1338
@1338
Sep 22 2016 13:58
You can do whatever. But bootstrap makes your life a lot easier.
Jess Callahan
@JessCallahanSEO
Sep 22 2016 13:58
ive been doing seo for about a year and a half and its picking up but i want to not have to pay for development tools i can make myself
and web design things i want to know if what im paying for it worth it
like divi
is bs but it works for now and provides solutions to what i need
1338
@1338
Sep 22 2016 13:59
@rusmex I tend to use bootstrap as much as possible. Only using CSS if need be.
rusmex
@rusmex
Sep 22 2016 13:59
so bootstrap is kind of substituting CSS ?
Jess Callahan
@JessCallahanSEO
Sep 22 2016 14:00
anyway walking into work now later campers <3
rusmex
@rusmex
Sep 22 2016 14:00
thanks @1338
CamperBot
@camperbot
Sep 22 2016 14:00
rusmex sends brownie points to @1338 :sparkles: :thumbsup: :sparkles:
:cookie: 120 | @1338 |http://www.freecodecamp.com/1338
1338
@1338
Sep 22 2016 14:00
@rusmex You can see bootstrap as a bit of CSS and JS. They are a toolset to do things with.
Monesul Haque
@mones-cse
Sep 22 2016 14:01
@rusmex bootstrap is a css library
1338
@1338
Sep 22 2016 14:01
You can expand upon Bootstrap with extra CSS.
rusmex
@rusmex
Sep 22 2016 14:02
thanks for clarification guys. I m out
Monesul Haque
@mones-cse
Sep 22 2016 14:02
it just write most useful scenario .
all we have to do is call
sourabhatt
@sourabhatt
Sep 22 2016 14:14
help please
in the tribute page challenge
how to add these <ul> lists in the center under the above line
1914 - Born in Cresco, Iowa
1933 - Leaves his family's farm to attend the University of Minnesota, thanks to a Depression era program known as the "National Youth Administration"
CamperBot
@camperbot
Sep 22 2016 14:14
no wiki entry for: pleasein the tribute page challengehow to add these ul lists in the center under the above line1914 - born in cresco iowa1933 - leaves his familys farm to attend the university of minnesota thanks to a depression era program known as the national youth administration
Monesul Haque
@mones-cse
Sep 22 2016 14:14
@sourabhatt share your codepen link
1338
@1338
Sep 22 2016 14:15
@mones-cse <ul class="text-center">
sourabhatt
@sourabhatt
Sep 22 2016 14:15
@mones-cse any more suggestion please
it's not working
only the text moving in the center @mones-cse
not the bullet line list <ul>
Monesul Haque
@mones-cse
Sep 22 2016 14:16
@sourabhatt i am looking into it
sourabhatt
@sourabhatt
Sep 22 2016 14:18

is there any alternative way for this

<blockquote>
<footer><cite>Sir Donald Bradman</cite></footer>
</blockquote>

JD Tadlock
@jdtdesigns
Sep 22 2016 14:18
@sourabhatt don't really know what you're wanting
1338
@1338
Sep 22 2016 14:18

@sourabhatt Since ul and li elements are display: block by default — give them auto margins and a width that is smaller than their container.

ul {
width: 70%;
margin: auto;
}
If you've changed their display property, or done something that overrides normal alignment rules (such as floating them) then this won't work.

Kevin Mulligan
@kmulligan
Sep 22 2016 14:19

Hmmm

$(document).ready(function() {
  $('#strict').click(function() {
    $('#strictActive').toggleClass('clicked');
    });

This should work to allow me to toggle the CSS on #strictActive, right?
Feel like I am missing something simple: http://codepen.io/kmulligan/pen/ammPvA

JD Tadlock
@jdtdesigns
Sep 22 2016 14:20
@kmulligan why are you wrapping it in doc.ready?
Monesul Haque
@mones-cse
Sep 22 2016 14:20
This message was deleted
JD Tadlock
@jdtdesigns
Sep 22 2016 14:20
doc ready hasn't been needed on codepen for years lol
Monesul Haque
@mones-cse
Sep 22 2016 14:20
blob
@sourabhatt do you want something like this?
sourabhatt
@sourabhatt
Sep 22 2016 14:21
no my friend @mones-cse
Monesul Haque
@mones-cse
Sep 22 2016 14:22
This message was deleted
sourabhatt
@sourabhatt
Sep 22 2016 14:22
i want the points <ul> under the line
Here's a time line of Sachin Tendulkar's Life:
Kevin Mulligan
@kmulligan
Sep 22 2016 14:23
@jdtdesigns I guess that's how I've seen stuff implemented.. can you explain what I should be doing instead and why I don't need doc.ready?
sourabhatt
@sourabhatt
Sep 22 2016 14:23
@1338 i ain't got you please
JD Tadlock
@jdtdesigns
Sep 22 2016 14:24
@kmulligan you're click toggle works
Kevin Mulligan
@kmulligan
Sep 22 2016 14:24
@jdtdesigns it is changing colors for you?
Simon Cordova
@gbsimon87
Sep 22 2016 14:26
Hey guys, using the developer tools on chrome, how can I change an image to have an effect upon hovering?
I seem to get the effect on its initial state, but not on mouse hover...
Kevin Mulligan
@kmulligan
Sep 22 2016 14:26
@jdtdesigns Got it working now. Needed to add !important to the .clicked css
1338
@1338
Sep 22 2016 14:27
@sourabhatt http://jsfiddle.net/8mHeh/1/
Look at this example.
The div align's the text to the left.
and auto's the margin.
Monesul Haque
@mones-cse
Sep 22 2016 14:28
blob
blob
@gbsimon87 are you looking for this ?
Simon Cordova
@gbsimon87
Sep 22 2016 14:29
I found that, but my changes won't go through...
sourabhatt
@sourabhatt
Sep 22 2016 14:29
<style>
ul {
width: 70%;
margin: auto;
}
</style>
this works @1338
thanks folks :)
which link need to be pasted while submitting challenge ?
this one above ?
Monesul Haque
@mones-cse
Sep 22 2016 14:31
nope
1338
@1338
Sep 22 2016 14:31
@sourabhatt
You can also nest your ul in a div with the class name .center and use this css:
.center {
width:200px;
margin:0 auto;
text-align:left;
}
The reason it acts that way is because the <li> tag has a margin build in automatically.
sourabhatt
@sourabhatt
Sep 22 2016 14:33
thanks @mones-cse @1338
CamperBot
@camperbot
Sep 22 2016 14:33
sourabhatt sends brownie points to @mones-cse and @1338 :sparkles: :thumbsup: :sparkles:
:cookie: 126 | @1338 |http://www.freecodecamp.com/1338
:cookie: 394 | @mones-cse |http://www.freecodecamp.com/mones-cse
Janine vN
@janine9vn
Sep 22 2016 14:36
@bvipul wow... that's literally weeks later. I know it's dynamically made, I'm saying why do it that way at all?
sourabhatt
@sourabhatt
Sep 22 2016 14:38
@mones-cse how will i get the link which need to be submitted ?
i made some changes in the code and want me to do the following in order to get the link
can u please describe the steps for this @mones-cse
Monesul Haque
@mones-cse
Sep 22 2016 14:39
blob
@sourabhatt ^ just select Full page
sourabhatt
@sourabhatt
Sep 22 2016 14:41
@mones-cse thanks
CamperBot
@camperbot
Sep 22 2016 14:41
sourabhatt sends brownie points to @mones-cse :sparkles: :thumbsup: :sparkles:
:warning: sourabhatt already gave mones-cse points
Monesul Haque
@mones-cse
Sep 22 2016 14:41
:)
miriam-z
@miriam-z
Sep 22 2016 14:44
@miriam-z
hello! I am using the following library: https://github.com/rendro/countdown
in my front-end project and want to know how to make changes to the countdown?
@miriam-z
when I try to make changes in the js file my ide says that the file belongs to a library and cannot be changed
any suggestions?
I have just come across this:
new Date();
new Date(value);
new Date(dateString);
new Date(year, month[, day[, hour[, minutes[, seconds[, milliseconds]]]]]);
would I add these properties to the current code I have in my html script tag :
<script>
    $(function() {
        $('.countdown').countdown({
            date: "June 7, 2087 15:03:26"
        });
    });
</script>
1338
@1338
Sep 22 2016 14:50
If you have the CDN of the countdown added that should work yes. @miriam-z
miriam-z
@miriam-z
Sep 22 2016 14:51
@1338 thanks for your reply I am using this with bootstrap 4 and jquery already comes with bootstrap 4 so should I be using the cdn or jquery from bootstrap install?
CamperBot
@camperbot
Sep 22 2016 14:51
miriam-z sends brownie points to @1338 :sparkles: :thumbsup: :sparkles:
:cookie: 141 | @1338 |http://www.freecodecamp.com/1338
1338
@1338
Sep 22 2016 14:54

@miriam-z
you need to add this:

<script type="text/javascript" src="/path/to/jquery.countdown.js"></script>
As I believe it does not come standard with jQuery and is a plugin.
So if you have jQuery already add that and it should work.
(note: the page said it is tested with jQuery 1.7.2)

Kevin Anderson
@LemonStain
Sep 22 2016 14:54
Can we paste our code from another program into Codepen for hte challenges?
miriam-z
@miriam-z
Sep 22 2016 14:54
yes i am aware of it being tested with this version of jquery which is why I wondered
Monesul Haque
@mones-cse
Sep 22 2016 14:55
@miriam-z if you are working on code pen
you can add this one
"http://rendro.github.io/countdown/javascripts/jquery.countdown.js"
miriam-z
@miriam-z
Sep 22 2016 14:56
@mones-cse thanks for this i am working on changing the date
CamperBot
@camperbot
Sep 22 2016 14:56
miriam-z sends brownie points to @mones-cse :sparkles: :thumbsup: :sparkles:
:cookie: 395 | @mones-cse |http://www.freecodecamp.com/mones-cse
sourabhatt
@sourabhatt
Sep 22 2016 14:56
https://www.freecodecamp.com/challenges/build-a-personal-portfolio-webpage
can somebody please send me the vimeo link of the youtube video on this challenge
youtube is blocked over here
Monesul Haque
@mones-cse
Sep 22 2016 14:56
@miriam-z i just tried with latest jquery its working
http://codepen.io/m1s/pen/VKPyjo
miriam-z
@miriam-z
Sep 22 2016 14:57
@mones-cse it is working but as I said I am changing the date
Monesul Haque
@mones-cse
Sep 22 2016 14:58
@miriam-z oh got it
1338
@1338
Sep 22 2016 14:59
@sourabhatt
There doesn't seem to be a version avaliable on vimeo.
I can send you the video if needed though.
sourabhatt
@sourabhatt
Sep 22 2016 15:03
@1338 that would be great
@1338 please send
that'll probably work.
Mehdi
@Medi2006
Sep 22 2016 15:06
plz can someone help me with the wikipedia projet i m stuck
http://codepen.io/Medi2006/pen/jrrYZX
i have the error value is not referenced
JD Tadlock
@jdtdesigns
Sep 22 2016 15:08
@Medi2006 Doesn't do anything for me. JS is failing
Monesul Haque
@mones-cse
Sep 22 2016 15:08
@Medi2006 what error value ?
Mehdi
@Medi2006
Sep 22 2016 15:09
in my code it tolds me ReferenceError: value is not defined
JD Tadlock
@jdtdesigns
Sep 22 2016 15:10
@Medi2006 The search doesn't do anything for me.
Mehdi
@Medi2006
Sep 22 2016 15:11
that's my problem i m trying to get the value of the search in a value variable but it's not working
here is the code i m using
$('#val').bind("enterKey",function(e){
var value=$('#val').val();
console.log(value);
});
$('#val').keyup(function(e){
if(e.keyCode == 13)
{
$(this).trigger("enterKey");
}
});
val is the id of the input
Monesul Haque
@mones-cse
Sep 22 2016 15:11
@Medi2006 you use value in local space
$(document).ready(function(){
  var value='';
try this
 var url ='https://www.mediawiki.org/w/api.php?action=opensearch&search='+value+'&format=json&callback=?'
here value key word is undefined
Mehdi
@Medi2006
Sep 22 2016 15:13
@mones-cse i see but why my JS is not working when i type something and hit enter
i have this now
Object { servedby: "mw1206", error: Object }
Monesul Haque
@mones-cse
Sep 22 2016 15:20
this error showing cause you called the api when the page loaded at that particular time variable data has no value
Mehdi
@Medi2006
Sep 22 2016 15:22
so if figure out why value doesnt take my entry when i type something it should work?
do you have an idea why i cant get the value from the user entry?
Charlie Draper
@cdraper99
Sep 22 2016 15:23
hi guys
quick q
i'm trying to find the length of an array within a JSON
the length is 7 key value pairs
but it's giving me a reading of 668!!
Monesul Haque
@mones-cse
Sep 22 2016 15:24
  $('#val').bind("enterKey",function(e){
var value=$('#val').val();
console.log(value);
 });
$('#val').keyup(function(e){
if(e.keyCode == 13)
{
  $(this).trigger("enterKey");
}
});
this portion of you code runing when there is no input field with val id
thats why it is not working
Charlie Draper
@cdraper99
Sep 22 2016 15:24
my JSON object
var famousQuotes = '{"quotes":[' +
'{"author":"Arnie", "quote":"I\'ll be back."},' +
etc
to find the number of pairs in the array
console.log(famousQuotes.length);
Monesul Haque
@mones-cse
Sep 22 2016 15:25
@Medi2006 you need to write a function that hold this portion above
and when search icon clicked called that function
@cdraper99 can you send the full json
?
Charlie Draper
@cdraper99
Sep 22 2016 15:26

var famousQuotes = '{"quotes":[' +
'{"author":"Arnie", "quote":"I\'ll be back."},' +
'{"author":"Kevin Kruse", "quote":"Life isn’t about getting and having, it’s about giving and being."},' +
'{"author":"Napoleon Hill", "quote":"Whatever the mind of man can conceive and believe, it can achieve."},' +
'{"author":"Albert Einstein", "quote":"Strive not to be a success, but rather to be of value."},' +
'{"author":"Florence Nightingale", "quote":"I attribute my success to this: I never gave or took any excuse."},' +
'{"author":"Wayne Gretzky", "quote":"You miss 100% of the shots you don’t take."},' +
'{"author":"Michael Jordan", "quote":"I’ve failed over and over and over again in my life. And that is why I succeed."}]}';

var obj = JSON.parse(famousQuotes);

Monesul Haque
@mones-cse
Sep 22 2016 15:28
@cdraper99 try
obj.quotes.length
it should provide you 7
Charlie Draper
@cdraper99
Sep 22 2016 15:29
@mones-cse you're a genius
thank you!!
Monesul Haque
@mones-cse
Sep 22 2016 15:29
:)
Charlie Draper
@cdraper99
Sep 22 2016 15:29

legend

Monesul Haque
@mones-cse
Sep 22 2016 15:29
happy coding :)
JD Tadlock
@jdtdesigns
Sep 22 2016 15:31
@Medi2006 You're main problem is you are injecting the input html through js and not running the get results code after you inject the html. Therefore the get results function isn't even aware of the input or it's key presses. I would suggest you start thinking functionally when coding. Write every step out in separate functions so your program runs each step at the appropriate time. Here is an example:
http://codepen.io/jdtadlock/pen/VKPyoj?editors=0010
I also put the input element into the html instead of through js. I added a hide class to css to toggle the search and input back and forth. ;)
1338
@1338
Sep 22 2016 15:41
@sourabhatt Did the link I send work?
sourabhatt
@sourabhatt
Sep 22 2016 16:15
@1338 yes that worked
1338
@1338
Sep 22 2016 16:16
Ah okay good. :D
sourabhatt
@sourabhatt
Sep 22 2016 16:16
@1338 sorry for late reply
@1338 thanks :)
CamperBot
@camperbot
Sep 22 2016 16:16
sourabhatt sends brownie points to @1338 :sparkles: :thumbsup: :sparkles:
:cookie: 147 | @1338 |http://www.freecodecamp.com/1338
emamadordev
@emamadordev
Sep 22 2016 16:24
ello
emamadordev
@emamadordev
Sep 22 2016 16:31
hello guys. I'm almost finished with my portfolio site project. (The main parts at least) This took me a few days because i'm still learning and I had to correct a lot of errors. It's simple tell me what you guys think. Also can anyone help me on how to align the submit button at the bottom of the page for smaller screens? https://codepen.io/emmanuelamador/pen/zKKrEa
1338
@1338
Sep 22 2016 16:31
@emamador Can't you just put an "text-center" class on the button?
sourabhatt
@sourabhatt
Sep 22 2016 16:32
@1338 what all we have to use while building portfolio ?
can we use .js too ?
emamadordev
@emamadordev
Sep 22 2016 16:33
@1338 that's the thing. I want to keep the button aligned to the left of the form and not the window. On the full screen version it works well but on smaller screens it gets aligned to the far left of the window.
i guess that would be the other option. to center it.
1338
@1338
Sep 22 2016 16:34
the form in a div and put text align to the left? @emamador
emamadordev
@emamadordev
Sep 22 2016 16:34
but i want to figure out the solution to the problem.
ok hold up
sourabhatt
@sourabhatt
Sep 22 2016 16:34
what should be recommended in order to build portfolio ?
css and js too ??
1338
@1338
Sep 22 2016 16:35
https://www.freecodecamp.com/challenges/build-a-personal-portfolio-webpage
@sourabhatt the challange mentions the use of jQuery so I guess JS must be fair game?
JD Tadlock
@jdtdesigns
Sep 22 2016 16:35
@sourabhatt You don't need js to build a portfolio, but it can help to add interaction if you so choose.
Start watching youtube tutorials and find other means to learn more about html/css/js
you will need every bit of knowledge you can get
emamadordev
@emamadordev
Sep 22 2016 16:36
@sourabhatt idk i just used css and html and bootstrap because that's all i know right now and what i'm familiar with. i'm still learning. i want to implement js though.
JD Tadlock
@jdtdesigns
Sep 22 2016 16:36
@emamador js is intense, but starting with jQuery can help to bring you in without exploding your brain
don't get me wrong though, jQuery can be intense as well
1338
@1338
Sep 22 2016 16:37
@emamador I really like your page so far. It has the style I would use once I get to doing the challange myself. :+1:
Stephen Suratos
@stephenfs
Sep 22 2016 16:40

@emamador Try wrapping your form in a container like this.. and then instead of wrapping the button with an offset do this…

http://codepen.io/ssuratosjr/pen/VKPXpB

emamadordev
@emamadordev
Sep 22 2016 16:41
@jdtdesigns thats probably why they showed us some jquery first here in freecodecamp.
@1338 thanks :) i'm trying to get better at the designing aspects of the site. i always get stuck there.
CamperBot
@camperbot
Sep 22 2016 16:42
emamador sends brownie points to @1338 :sparkles: :thumbsup: :sparkles:
:cookie: 148 | @1338 |http://www.freecodecamp.com/1338
JD Tadlock
@jdtdesigns
Sep 22 2016 16:43
@emamador jQuery is used for DOM manipulation for the most part and makes it easy to make changes to the page. Vanilla js is where you get into actual programming and algorithmic problem solving.
1338
@1338
Sep 22 2016 16:43
Actually what @SteveAmaki showed was better then mine. Use that instead. I'm still learning too. @emamador
JD Tadlock
@jdtdesigns
Sep 22 2016 16:43
There's 10,000 videos for jq, so you have plenty to learn from. ;) @emamador
emamadordev
@emamadordev
Sep 22 2016 16:45
@SteveAmaki ok. let me try that.
hello everyone
Stephen Suratos
@stephenfs
Sep 22 2016 16:50
My general rule for Bootstrap is this.. Never use “col-size-#” outside a container or row.
Hey Vinita.
Vinita Bapna
@VinitaBapna
Sep 22 2016 16:51
hi @SteveAmaki
1338
@1338
Sep 22 2016 16:52
@VinitaBapna your menu button doesn't work when you make the window smaller. Otherwise a nice and colorfull website. :D
Vinita Bapna
@VinitaBapna
Sep 22 2016 16:53
@1338 m also looking for solution
Stephen Suratos
@stephenfs
Sep 22 2016 16:53
@VinitaBapna make sure jQuery is linked properly.
Vinita Bapna
@VinitaBapna
Sep 22 2016 16:53
i haven't read javascript may be i need to do that first
@SteveAmaki i'll check
Stephen Suratos
@stephenfs
Sep 22 2016 16:54
There's no need for javascript.. you can activate jQuery in Codepen.
and Bootstrap should see it automatically.
Vinita Bapna
@VinitaBapna
Sep 22 2016 16:54
thanks let me check
Stephen Suratos
@stephenfs
Sep 22 2016 16:56
Show me your code in Codepen
Stephen Suratos
@stephenfs
Sep 22 2016 17:01
hmm.. weird.
Tyler Moeller
@TylerMoeller
Sep 22 2016 17:04
@VinitaBapna Add bootstrap.min.js below jQuery in your codepen JS settings. Click Run, and then try again.
https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js
That should fix your menu
Stephen Suratos
@stephenfs
Sep 22 2016 17:06
@TylerMoeller How come the jQuery in codepen isnt working?
Yours worked.
Tyler Moeller
@TylerMoeller
Sep 22 2016 17:07
@SteveAmaki The bootstrap mobile menu requires jQuery and bootstrap.js
It's a JS component of bootstrap: http://getbootstrap.com/javascript/
Stephen Suratos
@stephenfs
Sep 22 2016 17:08
OH!!! Bootstrap.js was missing
Tyler Moeller
@TylerMoeller
Sep 22 2016 17:09
Yeah, that's what was missing
Stephen Suratos
@stephenfs
Sep 22 2016 17:09
@TylerMoeller Thanks man.
CamperBot
@camperbot
Sep 22 2016 17:09
steveamaki sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 846 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Sep 22 2016 17:09
No problem
Nicole Horn
@N1CKL3
Sep 22 2016 17:13
Can someone tell me why my Navigation bar is hyperlinked like that? http://codepen.io/n_horn/pen/bwgaXL
Jason Luboff
@JLuboff
Sep 22 2016 17:15
@N1CKL3 What do you mean?
Nicole Horn
@N1CKL3
Sep 22 2016 17:16
@JLuboff My navigation buttons look like they are visibly hyperlinked. They are blue when I classified the color white, and when you hover over them the words are underlined. Makes me think that they are hyperlinked, or they at least have the appearance of being hyperlinked.
I have no idea how this happened. I followed a guide to creating a navigation bar and it should not look like that
Jason Luboff
@JLuboff
Sep 22 2016 17:17
@N1CKL3 Thats becuase they are hyperlinked
anything between <a href="link">Text</a> is a hyerlink
Nicole Horn
@N1CKL3
Sep 22 2016 17:19
@JLuboff Yeah but the examples I saw didn't have the appearance of being hyperlinked. I understand that I am linking the words to a part of my webpage but I don't want the buttons to look like that.
Tyler Moeller
@TylerMoeller
Sep 22 2016 17:19

@N1CKL3 You can modify the color of the links and remove underlines with this CSS:

.topnav a {
  color: white;
}
.topnav a:hover {
  text-decoration: none;
}

You could also use a template for your navbar: https://getbootstrap.com/examples/navbar-fixed-top/

Jason Luboff
@JLuboff
Sep 22 2016 17:20
@N1CKL3 I would add text-decoration: none; to your css for a:hover to get rid of the underline
1338
@1338
Sep 22 2016 17:21
@N1CKL3 You probably also want to put a color under the a:hover in css for it changing to another color.
Stephen Suratos
@stephenfs
Sep 22 2016 17:22
@N1CKL3 I think nicole is trying to get the default Bootstrap styling to work..
not create her own styling.
@N1CKL3 make sure you have the right classes in the right spot..
http://getbootstrap.com/components/#navbar
Nicole Horn
@N1CKL3
Sep 22 2016 17:31
@TylerMoeller @SteveAmaki Thank you! I am going to look through that link you sent me Steve. I got it to work by doing what everyone else said but yeah, it's a lot more steps than I wanted
CamperBot
@camperbot
Sep 22 2016 17:31
n1ckl3 sends brownie points to @tylermoeller and @steveamaki :sparkles: :thumbsup: :sparkles:
:cookie: 204 | @steveamaki |http://www.freecodecamp.com/steveamaki
:cookie: 847 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Stephen Suratos
@stephenfs
Sep 22 2016 17:32
oh good!
Nicole Horn
@N1CKL3
Sep 22 2016 17:36
@SteveAmaki Yeah...I looked up how to create a navigation bar html but I wanted to make it using bootstrap. All of what I just did was pointless....... (╯°□°)╯︵ ┻━┻
Stephen Suratos
@stephenfs
Sep 22 2016 17:37
I wouldnt say it was pointless.. Im sure you learned some stuff along the process.
1338
@1338
Sep 22 2016 17:39
@N1CKL3 https://codepen.io/1338/full/rrjdGW You can start with something like this. Look at all the classes used and look at the bootstrap website to see what they do. :3
Nicole Horn
@N1CKL3
Sep 22 2016 17:42
@1338 Thank you!
CamperBot
@camperbot
Sep 22 2016 17:42
n1ckl3 sends brownie points to @1338 :sparkles: :thumbsup: :sparkles:
:cookie: 149 | @1338 |http://www.freecodecamp.com/1338
Nicole Horn
@N1CKL3
Sep 22 2016 17:43
@SteveAmaki Lol that's me making fun of myself, in an overly dramatic way, for being careless
So every portfolio project I have seen has had JavaScript in it. I followed the order of the sections. JavaScript comes after this. Should I assume that I need to go do that before finishing this project?
1338
@1338
Sep 22 2016 17:46
@N1CKL3 Oh, remove the CDN's from there and use CodePen for it instead. You need the CDN for bootstrap (CSS and JS) as well as jQuery's JS CDN.
I'm using Atom to code then throwing it into codepen.
Tyler Moeller
@TylerMoeller
Sep 22 2016 17:48
@N1CKL3 You don't need to add JavaScript to your portfolio. Most of the JS people use is for smooth scrolling effects or bootstrap's scroll spy initialization. You can always come back to your portfolio project later and update it with new features.
You do, however, need to add the jQuery and Bootstrap.js libraries if you want to use the bootstrap collapsible navbar.
1338
@1338
Sep 22 2016 17:52
@TylerMoeller That is why I said it. I wasn't expecting her to use JS. But it is nice to have that feature and it doesn't require any extra knowledge. Makes you feel like you have delivered a more complete product.
Nicole Horn
@N1CKL3
Sep 22 2016 17:54
@TylerMoeller @1338 Thank you. You guys have been a huge help
CamperBot
@camperbot
Sep 22 2016 17:54
:warning: n1ckl3 already gave tylermoeller points
:warning: n1ckl3 already gave 1338 points
n1ckl3 sends brownie points to @tylermoeller and @1338 :sparkles: :thumbsup: :sparkles:
emamadordev
@emamadordev
Sep 22 2016 18:23
@SteveAmaki hey i tried your code...it didn't work. but I found a simpler solution http://codepen.io/emmanuelamador/pen/zKKrEa I just added the class "col-xs-offset-2" for the smaller screen. anyways, thanks for the help.
CamperBot
@camperbot
Sep 22 2016 18:23
emamador sends brownie points to @steveamaki :sparkles: :thumbsup: :sparkles:
:cookie: 205 | @steveamaki |http://www.freecodecamp.com/steveamaki
emamadordev
@emamadordev
Sep 22 2016 18:26
@N1CKL3 you remind me of julia from justkiddingfilms. heard of them?
Stephen Suratos
@stephenfs
Sep 22 2016 18:26
Glad you found your solution @emamador !
emamadordev
@emamadordev
Sep 22 2016 18:26
@SteveAmaki hey how did you get so good at web design? are you an artist or something?
Stephen Suratos
@stephenfs
Sep 22 2016 18:28
So.. Im a graphic designer.. been doing it for awhile.. i dabbled with code along time ago. back before html5 came out.
so I havea basic understanding of things.
Still working on getting better for sure.
emamadordev
@emamadordev
Sep 22 2016 18:29
@SteveAmaki how did you end up in graphic design? were you always an art kid or something?
Jason Luboff
@JLuboff
Sep 22 2016 18:29
I wanted to be a graphic designer back in college...I had dappled with creating websites in middle/high school....then the counselor at my community college were garbage and were having me take classes that I didnt need...so I ended up in IT support/administration haha
emamadordev
@emamadordev
Sep 22 2016 18:30
@SteveAmaki and do you have any tips? for design?
Stephen Suratos
@stephenfs
Sep 22 2016 18:30
@emamador Yeah I was born and raised in the Philippines. I was surounded by people who worked a lot with their hands.. my grandpa was a carpenter/painter. My other grandpa was a cook. Two of my uncles worked a designer for the department of agriculture. My mom and sister drew well.. so did my uncle.. so yeah. creativity was encouraged.
Nicole Horn
@N1CKL3
Sep 22 2016 18:32
@emamador I don't think I have heard of them
Stephen Suratos
@stephenfs
Sep 22 2016 18:32
so my definition of design changed through out the years. So I guess one tip is.. always keep in mind that design is more than just looks. You design because their is a user.
in terms of getting better as a designer, just the internet man. freaking google everything.
watch videos.subscribe to podcasts
follow your design heroes on social media.
JD Tadlock
@jdtdesigns
Sep 22 2016 18:34
The most important factor is Just Do It. ;)
the more you screw up, the more you learn
Stephen Suratos
@stephenfs
Sep 22 2016 18:34
One great podcast is http://www.travandlos.com/
JD Tadlock
@jdtdesigns
Sep 22 2016 18:34
don't sit around and listen or watch all day
actually do it
Stephen Suratos
@stephenfs
Sep 22 2016 18:34
theyre also on twitter. They’re great guys.
for sure @jdtdesigns doing is definitely vital....which Im sure @emamador is already doing.
emamadordev
@emamadordev
Sep 22 2016 18:35
@SteveAmaki dude thats awesome. Oh, and thanks for the resources.
CamperBot
@camperbot
Sep 22 2016 18:35
emamador sends brownie points to @steveamaki :sparkles: :thumbsup: :sparkles:
:warning: emamador already gave steveamaki points
Stephen Suratos
@stephenfs
Sep 22 2016 18:35
sure thing.
This message was deleted
JD Tadlock
@jdtdesigns
Sep 22 2016 18:37
@SteveAmaki I teach design and code and the main thing I see constantly is the desire and talk, but no action.
emamadordev
@emamadordev
Sep 22 2016 18:38
@jdtdesigns yeah lots of time i start to watch tutorials and then just watch them like i'm watching a movie and then i binge watch cause it's faster to watch then to actually do it.
Stephen Suratos
@stephenfs
Sep 22 2016 18:38
@JLuboff Im sorry to hear that. Im sure IT is a rewarding field as well
1338
@1338
Sep 22 2016 18:38
@jdtdesigns This I do more then I'd like to admit as well.
emamadordev
@emamadordev
Sep 22 2016 18:39
if i really want to learn i figured i have to do so im here now trying to learn.
Stephen Suratos
@stephenfs
Sep 22 2016 18:39
@jdtdesigns I see. I guess them being in your class is a step. lol
emamadordev
@emamadordev
Sep 22 2016 18:39
@SteveAmaki lol
Jason Luboff
@JLuboff
Sep 22 2016 18:39
@SteveAmaki Ya it is. At this point, I'm trying to learn SQL and programming (I like javascript, its the first programming language I've been able to somewhat grasp) just to advance myself in my career.
Stephen Suratos
@stephenfs
Sep 22 2016 18:40
@JLuboff SQL and database in general is my list. Right now, Im trying to get front end down.. then moving to backend and database stuff.
Jason Luboff
@JLuboff
Sep 22 2016 18:41
@SteveAmaki Ya, I'm taking a class for SQL...which actually isn't terribly difficult, albeit, it is all the basics right now. I need to learn to create Front end apps for it though, seeing as how thats the position I will need to fill at my current job
Stephen Suratos
@stephenfs
Sep 22 2016 18:43
@JLuboff nice! is it a class in FreeCodeCamp or somewhere else. Im in a full-stack class right now via Udemy.com.
Jason Luboff
@JLuboff
Sep 22 2016 18:43
@SteveAmaki Its an online class through a local community college, works paying for it :D
Stephen Suratos
@stephenfs
Sep 22 2016 18:44
Nice! free is always good!
Jason Luboff
@JLuboff
Sep 22 2016 18:44
Ya definitely. Now I think I'm going to have to try and learn Visual Basic or something along those lines for the front end :(
Stephen Suratos
@stephenfs
Sep 22 2016 18:45
One thing I found out is that, its very helpful for me to take two different classes of the same thing.. for example.I was taking a Javascript class on Udemy and another Javascript class via Lynda.com.. jus tseing two different take on the matter.
1338
@1338
Sep 22 2016 18:45
When I first learned to use (my)SQL with a front end application in mind. It was just a highscores game for a game that I cough made /cough. Didn't have fancy things like PDO and such.
Jason Luboff
@JLuboff
Sep 22 2016 18:45
Ya I've done the FCC and Codecademy Javascript lessons. I'm stuck on the FCC advanced algorithms though...they're...not easy..
Wanjila Abraham
@awanjila
Sep 22 2016 18:46
Hi guys, am stuck at the second front end project, online portfolio.. am trying to make my div have a negative margin at the top, but it wont budge, http://codepen.io/awanjila/full/LRNwWx/ kidly assit someone, anyone?
Stephen Suratos
@stephenfs
Sep 22 2016 18:49
@awanjila something like this?
http://codepen.io/ssuratosjr/pen/zKNajv
Wanjila Abraham
@awanjila
Sep 22 2016 18:52
@SteveAmaki it should completly feel the top, thanks though, i keep giving it a negative margin but it wouldnt change
CamperBot
@camperbot
Sep 22 2016 18:52
awanjila sends brownie points to @steveamaki :sparkles: :thumbsup: :sparkles:
:cookie: 206 | @steveamaki |http://www.freecodecamp.com/steveamaki
emamadordev
@emamadordev
Sep 22 2016 18:56
@awanjila open @SteveAmaki pen in fullscreen it looks different on here. what do you mean fill the top?
Stephen Suratos
@stephenfs
Sep 22 2016 18:59
Wanjila Abraham
@awanjila
Sep 22 2016 19:03
exactly like that @SteveAmaki and @emamador thank you
CamperBot
@camperbot
Sep 22 2016 19:03
awanjila sends brownie points to @steveamaki and @emamador :sparkles: :thumbsup: :sparkles:
:cookie: 64 | @emamador |http://www.freecodecamp.com/emamador
:warning: awanjila already gave steveamaki points
Stephen Suratos
@stephenfs
Sep 22 2016 19:06
@awanjila great! I just added the "navbar-fixed-top” class on the nav element.
emamadordev
@emamadordev
Sep 22 2016 19:07
@SteveAmaki wow! i didnt even know that was a class.
Stephen Suratos
@stephenfs
Sep 22 2016 19:08
@emamador I didnt either! I just went here. hahaha
https://v4-alpha.getbootstrap.com/components/navbar/
emamadordev
@emamadordev
Sep 22 2016 19:09
@SteveAmaki yeah im looking at all the nav options after i googled the class you mentioned. there's a bunh of nav options!!!
*bunch
Jason Luboff
@JLuboff
Sep 22 2016 19:09
There are a ton of awesome built in classes with bootstrap
javascript elements as well
Stephen Suratos
@stephenfs
Sep 22 2016 19:09
@JLuboff yup.
emamadordev
@emamadordev
Sep 22 2016 19:10
@SteveAmaki @JLuboff damn son. this is awesome. lol
Stephen Suratos
@stephenfs
Sep 22 2016 19:10
I try to stick to the base styling and then edit bit by bit as needed.
1338
@1338
Sep 22 2016 19:11
This might be a dumb question. But how come the background doesn't turn black?
https://codepen.io/1338/full/rrjdGW/
Do I need to overwrite some bootstrap method and if so how does one do that on codepen?
Other then the obvious and ugly style="" in the tag?
JD Tadlock
@jdtdesigns
Sep 22 2016 19:12
@1338 because the container is filling the background
also, you don't put html/head/body tags in the html on codepen
Rimi.
@Codevotee
Sep 22 2016 19:12

@1338 do this

/* Empty CSS file for your own CSS*/

on your CSS sheet

JD Tadlock
@jdtdesigns
Sep 22 2016 19:12
just everything between
Rimi.
@Codevotee
Sep 22 2016 19:12
@1338 then it will work
Stephen Suratos
@stephenfs
Sep 22 2016 19:13

@1338 add

background: black;

to you “container-fluid"

try that
Rimi.
@Codevotee
Sep 22 2016 19:13
@1338 edited my reply ^
@1338 since the "#" is interfering with your CSS
Stephen Suratos
@stephenfs
Sep 22 2016 19:14
@APRim05 is right.
Rimi.
@Codevotee
Sep 22 2016 19:14
@1338 so you have to comment it out
emamadordev
@emamadordev
Sep 22 2016 19:14
@APRim05 what he said erase this line or comment it out.
1338
@1338
Sep 22 2016 19:15
Yeah. just noticed it. That was a bit of a fail on my part. thanks @APRim05 and @SteveAmaki and @jdtdesigns
CamperBot
@camperbot
Sep 22 2016 19:15
1338 sends brownie points to @aprim05 and @steveamaki and @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 207 | @steveamaki |http://www.freecodecamp.com/steveamaki
:cookie: 599 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
:cookie: 150 | @aprim05 |http://www.freecodecamp.com/aprim05
Rimi.
@Codevotee
Sep 22 2016 19:16
@emamador and thanks XD
CamperBot
@camperbot
Sep 22 2016 19:16
aprim05 sends brownie points to @emamador :sparkles: :thumbsup: :sparkles:
:cookie: 65 | @emamador |http://www.freecodecamp.com/emamador
Stephen Suratos
@stephenfs
Sep 22 2016 19:16
cmd / is the shortcut for comment line just an FYI
or ctrl \
emamadordev
@emamadordev
Sep 22 2016 19:16
@APRim05 :) no prob
1338
@1338
Sep 22 2016 19:17
Good to know. I am rather new to codepen. (first day) and haven't been programming for a few years. so kind of getting in the swing again.
Stephen Suratos
@stephenfs
Sep 22 2016 19:17
ctrl /
Rimi.
@Codevotee
Sep 22 2016 19:18
@SteveAmaki is that for codepen?
Stephen Suratos
@stephenfs
Sep 22 2016 19:18
@APRim05 yes
Rimi.
@Codevotee
Sep 22 2016 19:19
@SteveAmaki oh nicee
Stephen Suratos
@stephenfs
Sep 22 2016 19:19
cmd / for mac
ctrl / for pc (obviously)
Michael Davis
@mhdavis
Sep 22 2016 19:19
how do i make images that are wider than they are tall responsive when put into a circle
Stephen Suratos
@stephenfs
Sep 22 2016 19:21
@mhdavis instead of “putting” the image in a circle, just give the image the border-raius of 100%
..or give the circle container/div an overflow:hidden;
..i think
Michael Davis
@mhdavis
Sep 22 2016 19:24
@SteveAmaki I'm trying to keep the image withing a certain size (400x400) but i also don't want the image to get distorted
when i try what you suggested, it does make the image itself circular
but it doesn't keep the dimensions i want
Stephen Suratos
@stephenfs
Sep 22 2016 19:25
Where’s your code?
if you go to the portfolio section on the css
and the portfolio section in the html
its the first entry in the portfolio section of the html
emamadordev
@emamadordev
Sep 22 2016 19:27
@mhdavis very nice site. :)
Michael Davis
@mhdavis
Sep 22 2016 19:27
@emamador thanks; still a work in progress
CamperBot
@camperbot
Sep 22 2016 19:27
mhdavis sends brownie points to @emamador :sparkles: :thumbsup: :sparkles:
:cookie: 66 | @emamador |http://www.freecodecamp.com/emamador
center center is the position of the image
you can adjust that with percentages or text values (left, right, top, bottom)
Michael Davis
@mhdavis
Sep 22 2016 19:29
@jdtdesigns oh right on, you can adjust it in the css, both the width/height and the border radius
Stephen Suratos
@stephenfs
Sep 22 2016 19:31
@mhdavis in the context of your project, I would wrap the image in its own div that is 300x300.
JD Tadlock
@jdtdesigns
Sep 22 2016 19:32
setting an image as a background gives you way more flexibility
background-size will automagically adjust the image to always maintain ratio no matter the size
Stephen Suratos
@stephenfs
Sep 22 2016 19:35
@jdtdesigns yup thats a good option too.
Michael Davis
@mhdavis
Sep 22 2016 19:36
@jdtdesigns is there a way to adjust the image? you have it set as centered, but the image that im using, the person is standing right-of-center
how do you adjust the orientation more precisely?
Michael Davis
@mhdavis
Sep 22 2016 19:39
@jdtdesigns perfect
@jdtdesigns more so out of curiousity, what does the percentage correspond to on the image
in the background-position
JD Tadlock
@jdtdesigns
Sep 22 2016 19:41
@mhdavis it's the x/y offset
with only one number, it's just the x-axis
Stephen Suratos
@stephenfs
Sep 22 2016 19:41
nice @jdtdesigns !
JD Tadlock
@jdtdesigns
Sep 22 2016 19:42
with 2, first is x, second is y
Michael Davis
@mhdavis
Sep 22 2016 19:42
@jdtdesigns so then csss auto detects the image center
JD Tadlock
@jdtdesigns
Sep 22 2016 19:42
yep, with it set to 'center center', the browser will focus on the center of the image automagically
Michael Davis
@mhdavis
Sep 22 2016 19:43
that's pretty neat
JD Tadlock
@jdtdesigns
Sep 22 2016 19:43
css3 is awesome
so many things that you don't think about or even know until you play around
Michael Davis
@mhdavis
Sep 22 2016 19:45
yea fure sure
What if you want to add alt text in case the image doesn't display properly in the browser
I tried it in the html and it overlapped with the image
JD Tadlock
@jdtdesigns
Sep 22 2016 19:47
title attribute @mhdavis ;)
Michael Davis
@mhdavis
Sep 22 2016 19:48
@jdtdesigns thanks still getting used to the technical terms for everything
CamperBot
@camperbot
Sep 22 2016 19:48
mhdavis sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 600 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Sep 22 2016 19:48
it'll never stop so get used to it lol @mhdavis
Michael Davis
@mhdavis
Sep 22 2016 19:48
@jdtdesigns so in the css goes "title attribute: "blah""
JD Tadlock
@jdtdesigns
Sep 22 2016 19:49
in the html
title="some dude"
Stephen Suratos
@stephenfs
Sep 22 2016 19:49
@TDandelion your website link on your profile isnt working..
JD Tadlock
@jdtdesigns
Sep 22 2016 19:49
@SteveAmaki Yeah, coding it in laravel
not done with it ;)
Stephen Suratos
@stephenfs
Sep 22 2016 19:50
gotcha
Michael Davis
@mhdavis
Sep 22 2016 19:50
@jdtdesigns yea it still overlaps the picture in the html for some reason
Sergii Gatezh
@gatezh
Sep 22 2016 19:52
Hello.
Can anybody help me to understand why reset.css effects my font settings?
I linked reset.css file (this one http://meyerweb.com/eric/tools/css/reset/) and then linked my own css file.
When I try to set font in my own css file using * selector – it doesn’t work.
https://codepen.io/Pablo8/pen/kkgjRy
Stephen Suratos
@stephenfs
Sep 22 2016 19:53
@mhdavis Im guessing because the image is set as a background instead of embedding it in an <img> tag.
…not sure.
@mhdavis change the img to div.. like this..
https://codepen.io/ssuratosjr/pen/jrypXr?editors=1100
JD Tadlock
@jdtdesigns
Sep 22 2016 20:00
@mhdavis The title attribute will do that, but it's not like people will be hovering over your images for any good reason. If it's important to have text for the image, that's the best way to do it. Otherwise, I wouldn't even worry about the text.
Alt text is specific for readers for the blind
Salomon
@zarruk
Sep 22 2016 20:01
Can anybody help me find you why div with #wheather_widgetid doesn't change its html text for the json?
http://codepen.io/zarruk/pen/dpNyOj?editors=1010
Stephen Suratos
@stephenfs
Sep 22 2016 20:03
@jdtdesigns but wouldnt you want your site fully accesible to everybody?
JD Tadlock
@jdtdesigns
Sep 22 2016 20:04
@SteveAmaki Your personal profile to show off your work? Not so much lol.
Stephen Suratos
@stephenfs
Sep 22 2016 20:05
hmm..
ok
JD Tadlock
@jdtdesigns
Sep 22 2016 20:07
@zarruk $.getJSON("http://ip-api.com/json", json => console.log(json) )
you just had a closing paren after the url
Michael Davis
@mhdavis
Sep 22 2016 20:08
@jdtdesigns sounds good
JD Tadlock
@jdtdesigns
Sep 22 2016 20:09
@zarruk longhand version
$.getJSON("http://ip-api.com/json", function(json){
      $("#weather_widget").html(JSON.stringify(json));
});
Salomon
@zarruk
Sep 22 2016 20:12
@jdtdesigns oh yes, that works! can you please explain me what would be the difference between what I and you had?
@jdtdesigns btw thanks!
CamperBot
@camperbot
Sep 22 2016 20:12
zarruk sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 601 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Sep 22 2016 20:16
@zarruk
// You had this -- Notice the closing paren after json" and no closing paren after the closing bracket
$.getJSON("http://ip-api.com/json"), function(json){
      $("#weather_widget").html(JSON.stringify(json))
} // need closing paren here and semi-colon
Salomon
@zarruk
Sep 22 2016 20:17
@jdtdesigns yes, I mean. I noticed the syntax difference, but wanna understand why yours work and mine doesnt
JD Tadlock
@jdtdesigns
Sep 22 2016 20:18
@zarruk because those are syntax errors that will cause the code to fail lol
Stephen James
@sjames1958gm
Sep 22 2016 20:18
@zarruk Your code terminated the getJSON, so there was no callback function passed to getJSON
@zarruk The worst part is it wasn't a syntax error from js point of view.
Salomon
@zarruk
Sep 22 2016 20:19
@sjames1958gm yes, i understand! thank you, i think it is a matter of practice
CamperBot
@camperbot
Sep 22 2016 20:19
zarruk sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 3430 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Sep 22 2016 20:21
@zarruk Yep.
Sergii Gatezh
@gatezh
Sep 22 2016 20:22
how does it work?
YTedla95
@YTedla95
Sep 22 2016 20:23
For the tribute page are we not allowed to use style?
His example only showed using one. Can we use more?
Salomon
@zarruk
Sep 22 2016 20:25
@sjames1958gm @jdtdesigns and now, do you know why it is not displaying the json of the Open Weather Map api?
JD Tadlock
@jdtdesigns
Sep 22 2016 20:26
Here's the trick answer @zarruk. You can store an ajax call in a variable to be used later. So the compiler red the getJson as a promise and didn't throw an error when you followed it with a function. Pretty weird and rare occurrence.
Igor Amidzic
@igoramidzic
Sep 22 2016 20:27
Can someone help me with jQuery?
I have a signup form with text boxes for inputs. I want the text box border to be gray at page load, then turn blue on active, and then turn red when clicked out of the box (if box is empty).
Can you just point me to the event I would use? Thank you!
Salomon
@zarruk
Sep 22 2016 20:28
@jdtdesigns how would i do that?
JD Tadlock
@jdtdesigns
Sep 22 2016 20:30
@zarruk You're trying to run asynchronous calls procedurally(one command after another) which won't work.
The best way to go about it is to separate your calls into functions that flow with each other.
Toni Shortsleeve
@KoniKodes
Sep 22 2016 20:34
@jwoo92 Very Nice :-)
Salomon
@zarruk
Sep 22 2016 20:36
@jdtdesigns thank you master. How do I do to obtain the first json first (therefore being able to assign the city name (json.city) to var a) and then afterwards the next json (therefore being able to include a in the url that calls the Open Weather Map api)?
CamperBot
@camperbot
Sep 22 2016 20:36
zarruk sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: zarruk already gave jdtdesigns points
Salomon
@zarruk
Sep 22 2016 20:36
@zarruk Would that be a synchronous call?
Nicole Horn
@N1CKL3
Sep 22 2016 20:39
I've been trying to work this out for the past 40 mins. or so. I am trying to change the colors of my navigation buttons. I have tried forming id tags to change them. I haven't managed to find a place to stick the id tag so that it applies to all 4 of my buttons. I did, however, manage to get the text color to change when I made an id tag specifically for 1 <li> element. I didn't know if someone knew how to target them all with 1 id tag or if I need to make individual id tags. http://codepen.io/n_horn/pen/bwgaXL
Salomon
@zarruk
Sep 22 2016 20:40
@jdtdesigns Oh thank you so much! That makes things much clearer!
CamperBot
@camperbot
Sep 22 2016 20:40
zarruk sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: zarruk already gave jdtdesigns points
Salomon
@zarruk
Sep 22 2016 20:41
@jdtdesigns One question. How I was doing it is an asynchronous call?
Jamie Weston
@monotone2k
Sep 22 2016 20:42
@N1CKL3 Don't use the same id for multiple items. That's when you'd use classes instead.
Apply the same class to multiple <li> tags, then write a style for that class.
JD Tadlock
@jdtdesigns
Sep 22 2016 20:44
@zarruk You were just procedurally writing out the getJson calls one after another. Those calls will connect to the server, ask for the data and then wait for it to come back. The data won't be returned instantly so running the code line by line won't work. JS runs super fast so the server doesn't have time to grab the data and use it before your code has already run. That's why you have to process the data in order of how it's received for it to work.
Salomon
@zarruk
Sep 22 2016 20:44
@jdtdesigns Thank you so much!
CamperBot
@camperbot
Sep 22 2016 20:44
zarruk sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: zarruk already gave jdtdesigns points
Salomon
@zarruk
Sep 22 2016 20:45
@jdtdesigns You can't imagine how much that helped
JD Tadlock
@jdtdesigns
Sep 22 2016 20:45
@zarruk Glad to help ;)
Salomon
@zarruk
Sep 22 2016 20:45
@jdtdesigns Now I'm trying to re write it myself to see if I properly understood the logic
1338
@1338
Sep 22 2016 20:49
@N1CKL3
.NavButtons {
  color: red !important;
}
Tyler Moeller
@TylerMoeller
Sep 22 2016 20:50
@amidzicigor You'll want to look at the focusout event or onblur parameter in HTML.
$('input').focusout(function() {
  $(this).css('border-color', 'red');
})
Nicole Horn
@N1CKL3
Sep 22 2016 20:52
@monotone2k @1338 I tried both things and it still won't change. I can't overwrite the bootstrap defaults for the buttons.
Jamie Weston
@monotone2k
Sep 22 2016 20:53
If you have items which already have classes/ids applied, you need to specifically override them.
I haven't used glyphicons yet... but those are the items you'll need to override.
Jamie Weston
@monotone2k
Sep 22 2016 20:55
Don't overcomplicate things.
1338
@1338
Sep 22 2016 20:57
@monotone2k But what if she is going to use glyphicon more on her page?
Tyler Moeller
@TylerMoeller
Sep 22 2016 20:57
@zarruk You can also use the built in Promise functionality in jQuery .ajax/getJSON calls:
  $.getJSON("http://ip-api.com/json").done(function(json){
    $.getJSON("http://api.openweathermap.org/data/2.5/weather?q="+json.city+"&APPID=1f58400991b966bafb35c7f208b3817d", function(json){
      $("#weather_widget").html(JSON.stringify(json))
         \\ Do something with your weather data
    });
  });
Jamie Weston
@monotone2k
Sep 22 2016 20:57
@1338 I'll counter that with: what if she's not?
Tyler Moeller
@TylerMoeller
Sep 22 2016 20:58
@monotone2k and @1338 Then @N1CKL3 would need to use:
.navbar-default .navbar-nav>li>a {
  color:#2a2a2a;
}
Salomon
@zarruk
Sep 22 2016 20:58
@TylerMoeller I am not familiar with how you did it there
Tyler Moeller
@TylerMoeller
Sep 22 2016 20:58
@zarruk It's adding the .done(function(json) to your .getJSON call.
Nicole Horn
@N1CKL3
Sep 22 2016 20:59
@monotone2k @1338 Thank you, both of you! I wasn't coding it wrong as CSS...I was applying it in the wrong place, which is why it never actually did anything.
CamperBot
@camperbot
Sep 22 2016 20:59
n1ckl3 sends brownie points to @monotone2k and @1338 :sparkles: :thumbsup: :sparkles:
:cookie: 214 | @1338 |http://www.freecodecamp.com/1338
:cookie: 108 | @monotone2k |http://www.freecodecamp.com/monotone2k
Jamie Weston
@monotone2k
Sep 22 2016 21:00
@N1CKL3 No problem. :)
Tyler Moeller
@TylerMoeller
Sep 22 2016 21:01
@zarruk For example:
$.getJSON(url,function(data) {
  // first success
}).done(function() {
  // second success
}).fail(function() {
  // failures
}).always(function() {
  // failures and successes reported here
});
Natasha
@NatashaSetnik
Sep 22 2016 21:02
Hi! Please, check my Random Quote Machine and give me a feedback
Salomon
@zarruk
Sep 22 2016 21:07
@jdtdesigns http://codepen.io/zarruk/pen/dpNyOj?editors=0010 although i did it (i hope) the same as you, it wont work! :worried:
@NatashaSetnik it doesnt tweet the quote
JD Tadlock
@jdtdesigns
Sep 22 2016 21:14
@zarruk you need 'http://' before the api url
Salomon
@zarruk
Sep 22 2016 21:15
@jdtdesigns Oh thanks. For example, those kinds of thing, am I supposed to know them?
CamperBot
@camperbot
Sep 22 2016 21:15
zarruk sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 602 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Utkarsh Bhimte
@Utkarshbhimte
Sep 22 2016 21:18
.dp{
  background-color: #c3c3c3;
  height: 200px;
  border-radius: 5px 5px 0px 0px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-transition: all 2s;
  transition: all 2s;
}

.dp:hover{
  background-size: 300px;
  -webkit-transition: all 2s;
}
Hansi2468
@Hansi2468
Sep 22 2016 21:19

Hi! Is there anyone that can help, please :/ I need strings that is spelled the same way foward as backwards to be true, so that is only characters and numbers
function palindrome(str) {
var str1 = str.toLowerCase();
var str2 = str1.replaceAll("[^a-zA-Z0-9]", "");
var str3 = str2.split("");
var str4 = str3.reverse();
var str5 = str4.join("");

if (str=== str5){
return true;}
if (str != str5) {
return false;

Utkarsh Bhimte
@Utkarshbhimte
Sep 22 2016 21:19
I am having a problem with this code
it changes when I hover but the animation is not working for some reason
Sergii Gatezh
@gatezh
Sep 22 2016 21:25
selective help. well...
Michiel
@MichielHuijse
Sep 22 2016 21:26
@Utkarshbhimte what animation do you meen? do you have a link to codepen?
Utkarsh Bhimte
@Utkarshbhimte
Sep 22 2016 21:27
@MichielHuijse transition
I am tryin to change the background size
Michiel
@MichielHuijse
Sep 22 2016 21:30
Background is always fullscreen. what do you meen.
Also do you work inside github pages to modify your page? Think it is easier to work in codepen.
Michiel
@MichielHuijse
Sep 22 2016 21:36
@NatashaSetnik Hi, I am also busy with this. I used a 2 dimensional array think it is a little shorter and cleaner. http://codepen.io/michiel-huijse/pen/rrWVdO
@NatashaSetnik
 var items = [
       ["jan", "ik hou van alleman"],
       ["piet", "geeft hem niet"],
       ["dolf", "is een wolf"]
     ];
Nicole Horn
@N1CKL3
Sep 22 2016 21:56
Does anyone have a link on how I can get a bootstrap navigation bar to scroll to the content on my webpage? I am having a hard time executing this.
Salomon
@zarruk
Sep 22 2016 21:57
Does anyone know why my html values aren't being replaced as stated in JS? Seconds ago it was but it isn't
http://codepen.io/zarruk/pen/dpNyOj?editors=0010
Never mind, I just found the error!
melisa pettaway
@mpettaw2
Sep 22 2016 22:00
hello all
from line 119 to 138
when how do i get my AI to toggle the class instead of staying there.
i've tried to remove it but it just removes the class from everything.
i am not sure how to do it....
@zarruk i do that too
Daniel Tait
@4xDMG
Sep 22 2016 22:05
@mpettaw2 so you want to remove the 'fil' class from the colored circle thats active?
Justin Woodward
@jwoo92
Sep 22 2016 22:05
@N1CKL3 did you figure out how to yet?
melisa pettaway
@mpettaw2
Sep 22 2016 22:05
yes!
which makes sense now...thank you @4xDMG
Justin Woodward
@jwoo92
Sep 22 2016 22:06
@KoniKodes Thanks! that was a rough draft, it is more complete now on my local computer. I just have not uploaded the updated code.
CamperBot
@camperbot
Sep 22 2016 22:06
jwoo92 sends brownie points to @konikodes :sparkles: :thumbsup: :sparkles:
:cookie: 373 | @konikodes |http://www.freecodecamp.com/konikodes
Daniel Tait
@4xDMG
Sep 22 2016 22:07
@mpettaw2 lol no worries. sounds like you worked it out yourself :)
Ken Haduch
@khaduch
Sep 22 2016 22:09

@N1CKL3 -- it's all a matter of putting anchor tags on the places in the navbar with "href" attributes that link to the ID values in the sections that you want to scroll to. So you might have a "contact" link like this:

<a href="#contactSection">Contact</a>

and in the div or section where you have contact information:

<section id="contactSection">

which ties the two together

Nicole Horn
@N1CKL3
Sep 22 2016 22:11
I did that. That means the only thing I'm missing is the JavaScript? http://codepen.io/n_horn/pen/bwgaXL
@khaduch
@jwoo92 I'm working on it
Ken Haduch
@khaduch
Sep 22 2016 22:15
@N1CKL3 - it should work without any javascript. You don't have any content in your sections, so they are probably all hidden under the navbar?
Justin Woodward
@jwoo92
Sep 22 2016 22:16
@N1CKL3 What exactly are you struggling with and trying to do?
Nicole Horn
@N1CKL3
Sep 22 2016 22:18
@khaduch Hmm I'm going to try and add some padding to my navbar and add a line of text to see what's happening exactly
Ken Haduch
@khaduch
Sep 22 2016 22:19

@N1CKL3 - add this CSS and a little bit of text to each section:

section {
  min-height: 300px;
  background-color: blue;
  padding-top: 60px;

}

You'll see that it scrolls.

Nicole Horn
@N1CKL3
Sep 22 2016 22:19
@jwoo92 I'm trying to create a one page webpage that has a navigation bar to take you to the proper content
Natasha
@NatashaSetnik
Sep 22 2016 22:20
@MichielHuijse thank you
CamperBot
@camperbot
Sep 22 2016 22:20
natashasetnik sends brownie points to @michielhuijse :sparkles: :thumbsup: :sparkles:
:cookie: 268 | @michielhuijse |http://www.freecodecamp.com/michielhuijse
Justin Woodward
@jwoo92
Sep 22 2016 22:21

@N1CKL3 check this out: http://getbootstrap.com/components/

Look at the right and read over nav and navbar.

In codepen, make sure you have bootstrap selected under the HTML settings.

@N1CKL3 I can help you through it, just make an attempt first :)
@N1CKL3 Also by looking over your portfolio, I would suggest building it with everything you want on it first, then it will be easier to finish off the navigation :)
Nicole Horn
@N1CKL3
Sep 22 2016 22:24
@khaduch That did it. I see it scrolling now. You were right. We couldn't see it because the sections were pretty much non-existent with no content. Thank you! Also, you wouldn't happen to know how to override bootstrap to change the navigation bar hover and active. I tried to do it earlier and nothing happened.
CamperBot
@camperbot
Sep 22 2016 22:24
n1ckl3 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1710 | @khaduch |http://www.freecodecamp.com/khaduch
Nicole Horn
@N1CKL3
Sep 22 2016 22:25
@jwoo92 My coding was right, we just couldn't see it scrolling due to lack of content. I was confused because I was under the assumption that I had to use javascript to get the webpage to scroll.
everything I had searched had javascript in it
Justin Woodward
@jwoo92
Sep 22 2016 22:27
@N1CKL3 You will be fine without javascript on this project and you are right, it will be easier to test once you have more content to scroll through.
@N1CKL3 You will begin to work with javascript challenges after you complete the portfolio project. Be ready for the challenge then as it may be difficult at first.
Nicole Horn
@N1CKL3
Sep 22 2016 22:28
@jwoo92 I think in retrospect you are right. I should have taken care of the content first. I even thought about that as I was doing it BUT I've already come so far. I've been working on this 1 nav bar since 11am and I want to finish it lol
Justin Woodward
@jwoo92
Sep 22 2016 22:29
@N1CKL3 I can fully understand how you feel. It is difficult now, but it slowly will make more sense for you as long as you do not give up. I was in your exact position back in march :)
Nicole Horn
@N1CKL3
Sep 22 2016 22:32
@jwoo92 Lol I know a lot of it will become instinct eventually. I'm really enjoying coding so far. I have only been doing it for 7 days now, so I am really new. I'm happy with where I am right now and I'm not going to rush it. Also, could you help me with my last question, please?
I'm trying to override bootstrap defaults. I want to add the hover and active actions to my navigation buttons. I tried doing .active and .hover but it didn't work.
I want the colors to change when you are on the content page and when you are scrolling over a navigation button
Justin Woodward
@jwoo92
Sep 22 2016 22:56
@N1CKL3 Thats awesome, you are doing a great job for only 7 days in! I will send you a private message so I help you with your code without flooding the main chat.
Amit Patel
@AmitP88
Sep 22 2016 23:33
hey guys, I've finally completed my design for my revamped portfolio site: https://amitp88.github.io/New-Portfolio/
I didn't make it mobile first because I wanted the aesthetics to be right
but now I'm starting over developing this site from a mobile-first approach
however, do you think it would be possible to use bootstrap's grid system for this? or should I just rely on media queries?
Monesul Haque
@mones-cse
Sep 22 2016 23:35
@AmitP88 looks like your skill section is showing now :P
Amit Patel
@AmitP88
Sep 22 2016 23:36
@mones-cse lol yup. hopefully in the contacts section only right?
before it was glitching and showing up on the title page =P
Salomon
@zarruk
Sep 22 2016 23:36
Help please: I defined the setBackground()function. After I did this, some of the elements of the page, disappeared. When I erase the setBackground()function, they re appear. Does anybody know why this is happening? http://codepen.io/zarruk/pen/dpNyOj?editors=0010
CamperBot
@camperbot
Sep 22 2016 23:36
no wiki entry for: please i defined the setbackgroundfunction after i did this some of the elements of the page disappeared when i erase the setbackgroundfunction they re appear does anybody know why this is happening httpcodepeniozarrukpendpnyojeditors0010
Monesul Haque
@mones-cse
Sep 22 2016 23:36
nope it only showing in contact section
Amit Patel
@AmitP88
Sep 22 2016 23:37
awesome :)
do you think I would be able to use (should use?) Bootstraps grid system to make it responsive?
or should I just use media queries?
Salomon
@zarruk
Sep 22 2016 23:37
I defined the setBackground()function. After I did this, some of the elements of the page, disappeared. When I erase the setBackground()function, they re appear. Does anybody know why this is happening? http://codepen.io/zarruk/pen/dpNyOj?editors=0010
Monesul Haque
@mones-cse
Sep 22 2016 23:39
@AmitP88 for quick output use bootstrap
and if you want to dive into deep try media queries
@zarruk which element disappeared ?
Amit Patel
@AmitP88
Sep 22 2016 23:40
hmmmm
I mean I want this to be able to look great on any size screen
I dunno if media queries would guarantee that
Monesul Haque
@mones-cse
Sep 22 2016 23:42
if you look into source code of bootstrap you can see they use media query
it just when you use bootstrap grid system you do not need to think of media query
Amit Patel
@AmitP88
Sep 22 2016 23:42
ah ok
hmmm, I guess i'll try media queries first in that case. I tried just implementing the grid system on my current site but it messed everything up
Salomon
@zarruk
Sep 22 2016 23:43
@mones-cse actually I look it is now working. However, please review the setBackground()function. Why is the background not changing to the image pointed there although weather == clouds?
Amit Patel
@AmitP88
Sep 22 2016 23:43
hopefully it'll work out
Monesul Haque
@mones-cse
Sep 22 2016 23:45
@zarruk ok i am looking
Salomon
@zarruk
Sep 22 2016 23:48
@mones-cse thanks
CamperBot
@camperbot
Sep 22 2016 23:48
:cookie: 396 | @mones-cse |http://www.freecodecamp.com/mones-cse
zarruk sends brownie points to @mones-cse :sparkles: :thumbsup: :sparkles:
Monesul Haque
@mones-cse
Sep 22 2016 23:50

wrong

$(".general").css("background-image", url("http://www.familyandhome.org/sites/g/files/g20561/f/clouds.jpg"))

right

 $(".general").css("background-image","url(http://www.familyandhome.org/sites/g/files/g20561/f/clouds.jpg)")
@zarruk url key word should be inside " ''
Rachel Reinheimer
@glgirl28
Sep 22 2016 23:52
@AmitP88 The first page is very clean looking. The link to the repo for each project is very convenient!
@mones-cse still wont work
Amit Patel
@AmitP88
Sep 22 2016 23:53
@glgirl28 thank you! :)
CamperBot
@camperbot
Sep 22 2016 23:53
amitp88 sends brownie points to @glgirl28 :sparkles: :thumbsup: :sparkles:
:cookie: 343 | @glgirl28 |http://www.freecodecamp.com/glgirl28
Abdulrahman Alhadhrami
@alhadhrami
Sep 22 2016 23:57
I'm trying to do the Local Weather project. I use https to get geolocation, but now I can't call the Open weather API because it's not https. What should I do?
Monesul Haque
@mones-cse
Sep 22 2016 23:58
@zarruk inside your setBackground method
variable weather is undefined thats why it is not showing
call setBackground(); after
this line
weather = json.weather[0].main;