@TylerMoeller oh, wow. I think you just saved me a ton of hours of head banging against the wall. Thank you!
jttyeung sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:warning: jttyeung already gave tylermoeller points
Hey there.
Got a confusing problem with my Tic Tac Toe project:
I want to code a dumb AI and smart one, to start I coded a simple function which does a random move on AI´s turn. It works, but only on the AI´s first move. On the second turn , the AI does 2 moves. On the third turn, the AI does 3 moves and so on....
I just can´t find the error, would be great if someone could help me!
Thank you in advance!
Here´s my pen:
http://codepen.io/kenobijr/pen/ozJorK
Got a confusing problem with my Tic Tac Toe project:
I want to code a dumb AI and smart one, to start I coded a simple function which does a random move on AI´s turn. It works, but only on the AI´s first move. On the second turn , the AI does 2 moves. On the third turn, the AI does 3 moves and so on....
I just can´t find the error, would be great if someone could help me!
Thank you in advance!
Here´s my pen:
http://codepen.io/kenobijr/pen/ozJorK
@kenobijr - I'm wondering if you might be adding click handlers in a way that multiple handlers get added? I'm trying to look at your code, not figuring it out just yet...
@kenobijr - I think that's it - every time you invoke
init_hi_turn(), you are adding another click handler for the .class elements. If you just condition it so that you add the click handler only one time, it seems to clear up that problem. To test it, I just added a flag variable that is global, and initialize it to false. Just before setting the click handler, test that flag, if it is false, add the handler, then set that variable to true. Problem solved!
@kenobijr - the snippets of code that I added:
var clickAdded = false; // the global variableand this around the click handler code:
//get HI choice
if ( ! clickAdded ) {
$(".cell").click(function(){
if (game.turn === "HI" && game.status === "running"){
var position = Number($(this).attr("data-pos"));
$(".cell").removeClass("click_now");
// add x or o on ui and board
if (game.ai_is_x){
$(this).text("O");
game.board[position] = "O";
advance_turn();
} else {
$(this).text("X");
game.board[position] = "X";
advance_turn();
}
}
});
clickAdded = true;
}
i wrote this to test if javascript was working but it doesn't work. Do any of you guys see something wrong with this code?
var df=1;
function checker() {
if (df==1) {
return true;
} else {
return false;
}
}
checker();It's not picking up that df is a variable.
var df=1;
function checker(df){ return df == 1; }
function checker(df){ return df == 1; }
your problem has to do with local vs global variables
@emamador - well, it seems that your variable
df should be a variable that is in scope for your function? Why do you think, @pbgnz that it shouldn't? I haven't tried this yet in a browser...
@emamador - running this in the firebug console in firefox, it looks like it works? I can change the value of the global variable, and it seems to respond correctly?
it works my bad
ok yeah i called df within the function and now it recognizes that it's a variable. thanks..but in onsole shouldn't it return true?
it did
wait the way that i had it fat first was right? right?
@emamador - I also saw it return true. Which console are you looking at?
the console on chrome
i guess something is wrong with my browser
im on codepen.io
try writting your function in one line
@emamador - within the Chrome devtools? Or the console that is available under CodePen's UI? That one doesn't always show everything...
function checker(){ if (df ==1) return true; return false;
ok it works thanks guys.
:+1:
if i put return true; does that show up in console? or do i have to put return console.log (true) ?
@emamador - if you look in the devtools, and actually run your script through the devtools console, you'll see it report "true" or "false", but in CodePen, I found that I had to put a console.log statement there.
hey guys, I'm designing a website for a restaurant starting with the mobile view. I'm wondering if it would be a good idea to just have images of each dish for the menu section, and just have each image stack on top of each other with the name of the dish over the image, then having the descriptions appear as modals when the user taps on the images. btw, the menu has 12 main dishes, 4 desserts, and 4 unique drinks
@khaduch wow i didn't even know you can run the scripts directly into the chrome console. yeah i find that you have to pt console.log anyways thanks
emamador sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1812 | @khaduch |http://www.freecodecamp.com/khaduch
@emamador - I like the firefox / firebug console for that - it opens a separate pane that you can put your code into and edit, and even "pretty print" it to format it. That's useful sometimes. But console.log is definitely more reliable, and looking at the developer console is the best way to make sure you see it.
I've tried using the "row" and "col-x-*" code to align my text and photo but it doesnt line up and I can't see why. Help?
@joyinthenow can you share your code with us?
@khaduch cool. i'll make sure to checkout firefox's console later.
@emamador , there is a devtools built into Firefox, and FireBug is a separate plugin. FireBug is what i usually use on Firefox. Just to clarify...
This message was deleted
@mhdavis did you get it figured out?
@joyinthenow - can you post your URL for your project?
@mhdavis
function main() {
// this won't work because these variables will only be available inside this function
// move them outside all your functions at the top of your code
var author;
var quote;
// you can still set them inside this like you're doing
$.getJSON('http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&jsonp=?&lang=en', function (data) {
author = data.quoteAuthor ? data.quoteAuthor : 'Unknown';
quote = data.quoteText;
});
// this won't work because like my animation shows you have to either set the html inside the getJSON or call a function that sets the
// the html from inside the getJSON
// You can use .done() or .on('done', setHTML) at the end of the getJSON as well
$('#quote').html(
'<p>"' + quote + '"</p>' +
'<span>- ' + author + '</span>'
)
}
@jdtdesigns thanks
c0d0er sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 714 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
@mhdavis Here's the animation again http://jsbin.com/yevovuv/6/edit?output
@emamador @khaduch
Sorry I was off trying to figure things out but I will totally take the help!
https://codepen.io/joyinthenow/pen/ozPgrr
Sorry I was off trying to figure things out but I will totally take the help!
https://codepen.io/joyinthenow/pen/ozPgrr
@joyinthenow @joyinthenow - so what's your question on that again? (OK, I started looking at the code)
@joyinthenow - bootstrap column classes are
col-sm-8, col-sm-4, etc? xs, sm, md, lg if I remember them all correctly...
@joyinthenow - also, if you are doing multiple classes, like you have here:
Also, I think that you should have your
<h1 class="text-center" class="col-s-8" >, it should be written as <h1 class="text-center col-sm-8" >, with a correction to the class for the column. Each class in the same attribute, space-separated.Also, I think that you should have your
class="container" div as the parent for all of your row and col divs. It probably won't work the other way around.
@joyinthenow - also, on CodePen, all of your CSS classes should be in the "CSS" panel - remove that
<style> section from your HTML panel. It might just mess with your page because of the way CodePen loads things...
@joyinthenow - also, it might be better to make all of your column elements in <div> elements, with the column classes added to those, and then put your other elements, like the
<h1> nested inside of those divs. It might avoid some other problems, such as conflicting style settings on the <h1> compared to the column class settings? (I'm not sure that there are, but that's a "for instance"...)
khaduch @khaduch - signing off for the night...
Can I get to learn the Back End part before finishing my FrontEnd learning?
Because I think there are too many algorithm challenges. A little bit tedious...
Because I think there are too many algorithm challenges. A little bit tedious...
Thanks!!
@skfwnelf - I think that you can mix things up, just so you get all of the requirements completed by the end of the program? Sometimes it's good to switch to other things for a while...
Hello! Good Morning! :)
Hi all. i am working on my tribute page. I have two images on the same row using
col-sm-6 grid. I am trying to put captions underneath each image. I've been adding these tags immediately after '<img>', <div class="caption text-center">. But does not seem to work. It looks okay in mobile but on desktop the caption slides over on top of the 2nd image . Any suggestions?
hi I'm trying to make a Wikipedia View and for some reason my getJSON request isn't getting through all the time what am i doing wrong?
currently i have this
var url= "https://en.wikipedia.org/w/api.php?action=query&list=search&srsearch=test&format=json&callback=?";
//console.log(url);
var req=$.getJSON(url);
//console.log(url);
var req=$.getJSON(url);
req.done(function(data){....}
Whether city name displaying properly in this?
http://codepen.io/ArvindGilkinja/pen/JRkrgz
http://codepen.io/ArvindGilkinja/pen/JRkrgz
@eextreme post the codepen?
@ArvindGilkinja yes
never mind, i figured it out.
Hello World
welcome to FreeCodeCamp @jbkwizera!
I know this my sound trivial, but I just want to know: How do you write a code (like here) so that it comes looking like a real code...with black background and all that?
ahoy!
would anyone look at my..uhm tribute project and give me some feedback? I'm not 100% sure what I'm doing as I've defiently never done something like this before
Never mind guys, I learned it
@F22rapt I think it looks okay. Everything is technically okay. Unless you would want to make it a little fancy...like picture size, font-style...
I was considering that. just don't think i want to sink that much into it
oh wiat if orgot a couple thign s:o
how do i make anchored links open in different tabs?
got it.
:)
Links that open in a new tab:
<a href="url" target="_blank"> ....</a>
@F22rapt i would give to the div class text-left some padding like padding: 20px; or so
Guys, what is wrong with this media query? Just testing some stuffs.. I want to change the color of div with class brand-logo on screen sizes below 400px.
@media screen and (max-width:400px) {
.brand-logo {
color: red;
}
}
@NitinNair89 here some ref that may help u: https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
Thanks @sorinr I think i figured it out.. the brand-logo had an "id" as well.. so i applied the query to ID and it worked :P
Thank you @sorinr
hey guys, I'm currently working on the building a portfolio challenge. I started mine from absolutely nothing but it is asking for navigation buttons which I haven't learned on how to make yet.. how do I complete this without looking at someone else's code.
Where's the camperbot? :P
don't look at the code @marcs12 but read-search-ask :)
google is a hell of a drug :D
for navigation, as a beginner you only need to use <ul> and a couple of <li> tags
I'm on that one myself nitin..i litterly just don't know what i should do for layout..
you can also use <a> for navigation :)
opps..wrong name. but whatever
so where you'd stuck at?
Anyone has suggestions for what else I could do?
I am messing around with animations and stuff, but my inspiraton is ceasing ^^
https://codepen.io/A_A/full/XjyqaJ
I am messing around with animations and stuff, but my inspiraton is ceasing ^^
https://codepen.io/A_A/full/XjyqaJ
it only rotates @Otto-AA ? Here's your motivation - https://material.uplabs.com/posts/google-design-icon-animation
@NitinNair89 its free today. took a day off :)
LOL
More inspirations - https://material.uplabs.com/posts/c/resources/animation
hey so now that I'm on the profolio project I'm a little stuck, Since I have nothing to add to it, I can't invinsion a layout
@F22rapt but you can add info about you, portfolio with just some placeholders where you can add later more info, a contact section, whatever you want on that page
@NitinNair89 No, you have to click on it ^_^
@NitinNair89 Guess I should make that more obvious
Good one @Otto-AA Sorry I did not interact with your code at first! I liked the animations.. Good job! :D
headers are supposed to be a large font by default right? or am i mistaken..because mines is tiny
@F22rapt probably the HTML or CSS is messing the size?
i only have the one line so far lol. its preplexing me
@F22rapt well, compared with the paragraph it should be big
/bigger
@NitinNair89 Thanks for the animation-link :)
otto-aa sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 289 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
@F22rapt code pls?
I hope you are using between <h1> and <h6> inclusive.. anything else will be treated as a normal para
the <div> didn't close proper before <h1>
<div class="text-center"
should be
<div class="text-center">
notice the ">" after quotation
facepalm i make that mistake all the time. i shuda knwon
:hamster:
right..now..what else does one need.
is there a good image you might recoomend to use as a palceholder?
try lorem pixel website
Hey Guys!!
I'm designing my portfolio and I don't understand how can I insert my own image into the code!!
I tried pulling from dropbox but the image doesn't load!!
Please help!!
I'm designing my portfolio and I don't understand how can I insert my own image into the code!!
I tried pulling from dropbox but the image doesn't load!!
Please help!!
A quick question - How do i change the font style of a <span> within the .brand-logo having the class as "desc"?
.brand-logo {
font-family: 'Rochester', cursive;
}
.desc {
font-family: monospace;
font-size: 15px;
}The above code does not work. Here's the HTML:
<a href="#" class="brand-logo center" id="fLogo">
Brand Logo goes here
<span class="hide-on-small-only" class="desc">Small description goes here</span>
</a>
@DevD01 Check the image URL. Code please?
give proper image URL
This is the image URL :
https://www.dropbox.com/s/fuft8qbg5wolpbc/BeautyPlus_20161020211147_save.jpg?dl=0
https://www.dropbox.com/s/fuft8qbg5wolpbc/BeautyPlus_20161020211147_save.jpg?dl=0
@NitinNair89 So I want to insert this into my code!! I tried to insert it as well but the image doesn't load!!
hi guys.. question. why are my thumbnails, images, and blocks overlapping my fixed nabber?
bar*
here is my pen http://codepen.io/iansmit7/pen/kkAqvQ
suggestions would be much appreciated :pray:
NAV Bar problem
@iansmit7 try:
.nav-pills{
z-index:1;
}
@NitinNair89 thanks! so that z-index meansit overlaps everything?
iansmit7 sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 290 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
@iansmit7 while ya wait for that to be figured out..tell me, the top bar with the buttons, how did you create those? I feel like i missed a lesson or two there. Is it a colored well or..
@iansmit7 Yes, z-index means the 3rd axis (X and Y are the first two). It determines how far or near the objects are.
this the css
.nav-pills{
z-index:1;
font-size: 20px;
background-color: saddlebrown;
margin-bottom: 9%;
color: white;
A positive value = the element is near (overlap other elements.
A negative value = the element is far (overlapped by other elements)
A negative value = the element is far (overlapped by other elements)
@F22rapt
@F22rapt this is the css.nav-pills{
z-index:1;
font-size: 20px;
background-color: saddlebrown;
margin-bottom: 9%;
color: white;
Hey guys
did a miss a lesson on that..
@NitinNair89 Thanks!! I got it!! The solution was to add raw=1 at the end of the link, anyone having the same trouble can do this now!! :)
devd01 sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 291 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
Hi there @MangoKing-IV :)
@F22rapt this is html<div class="pageOne text-center">
<ul class="nav nav-pills">
<li><a href="#">Ian Smit</a></li>
<li class="pull-right"><a href="#">Contact</a></li>
<li class="pull-right"><a href="#">Portfolio</a></li>
<li class="pull-right"><a href="#">About Me</a></li></ul>
Good job @DevD01 :+1:
Hey @NitinNair89 seeing you again !
:)
I finally got some practice done with navbars and made this
But how can i remove the lines under the list items
Also I was trying to make the navbar in fixed position
@F22rapt oh i just looked that up on google. cause im currently on my portfolio page had no idea how to put a nav bar. i think it was on w3schools
but once i do that it shifts to the left
Good start @MangoKing-IV :) Try this:
to your links
text-decoration: none;to your links
ok thanks.
I tried but it doesnt seem to work
I used it for both <a> and <li>
it's for <a>
maybe you put the code in wrong place
#navbar a{
font-size:40px;
text-decoration: none;
}
OH WOW simple mistake, i wrote decoration"s"
LOL
part of programming :)
Also, do you know how I would be able to have the navbar wrapper's position fixed in the same position
as i scroll down
@khaduch thank you for your advice
skfwnelf sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1816 | @khaduch |http://www.freecodecamp.com/khaduch
@MangoKing-IV
position: fixed?
i got this to work before by make position:fixed; in css
yes that worked, but it causes the wrapper to be shifted to the left
@MangoKing-IV Then add
left: 12.5%;
Which causes the original settings of margin-left and margin-right : auto; to be changed
why did you give margins?
#navbar-wrapper{
width:100%;
height:100px;
background-color:white;
padding-bottom:20px;
opacity:0.7;
position:fixed;
it worked A_A :)
Ill also try your way nitin
I gave it margins to the wrapper so it can be fit inside the outer navbar
which i made the photo to
um, margins..if not treated carefully will cause lot of problems in future. :)
@MangoKing-IV Oh, and just a tip: I'd use
margin: 0; on the body :)
I am trying to understand how to layer elements, and is failing miserably. I am trying to build four buttons, and layer a image over it.
Thanks @NitinNair89 and @Otto-AA
mangoking-iv sends brownie points to @nitinnair89 and @otto-aa :sparkles: :thumbsup: :sparkles:
:cookie: 317 | @otto-aa |http://www.freecodecamp.com/otto-aa
:cookie: 292 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
Similar to layering elements, why is my navbar going behind the images in this pen
@MangoKing-IV you need to use z-index
@pkshreeman Were you trying to do it like this?
This message was deleted
With the black one as the overlay?
@jmstubiera Yes sir!
@pkshreeman I gave that a shot with both the id reference and img element reference and it didnt seem to work
@MangoKing-IV yeah...I was checking out your codepen...when I changed the nav's index, it wouldn't go over the images...and got blocked in.
I wonder if it's <div> issue
@pkshreeman You can apply an absolute positioning to the image so that it won't affect the buttons and setting positions for both top and left. Tried it like this via inspect
Hey guys! I think I've finished my first project, the tribute page! Would anybody care to give some feedback if they have a sec? https://codepen.io/sycrat/full/JRZwxW/
@jmstubiera that's odd..if I write that in css, it doesn't work.
Now I lost my original background image for my navbar
can someone help me figure out how to get it back
@sycrat hey that's cool! Not about links on codepen: do it like that
<a href="http://somecoolshit.com" target="_blank" alt="blahblah">click here</a>TARGET BLANK - it's important otherwise your links will not open
Okay I just got it back by removing the margin:0; in the body
Why did cause the issue ?
@pkshreeman Could be an issue with specificity of the elements. Associating the image with a class like this:
<img src="https://raw.githubusercontent.com/pkshreeman/pkshreeman.github.io/master/Blackcircle.png" class="imageOverlay">Then apply these style to that class
.imageOverlay {
position: absolute;
top: 120px;
left: 135px;
}
Ah, thanks @kurumkan , looks like I missed it on my github link!
sycrat sends brownie points to @kurumkan :sparkles: :thumbsup: :sparkles:
:cookie: 357 | @kurumkan |http://www.freecodecamp.com/kurumkan
@sycrat hey that's cool! Not about links on codepen: do it like that
<a href="http://somecoolshit.com" target="_blank" alt="blahblah">click here</a>TARGET BLANK - it's important otherwise your links will not open
browser will try to open the link in the same page unless the "target" value is explicitly specified. Hence, codepen might block any external links while the browser attempts to open it inside codepen itself. :)
you can test it by using the link to your codepen settings or profile page.. it will open inside your codepen itself :P
so it will be a codepen inside a codepen! :D
@jmstubiera I'm stumped. It didn't work. You can open my codepen by clicking on it, and modify it and see what works.
@pkshreeman what's wrong?
@NitinNair89 can't force the image of black circle to be overimposed these four buttons.
@jmstubiera if you don't want problem with your images from github you must use http://rawgit.com/
@jmstubiera so in your case https://rawgit.com/pkshreeman/pkshreeman.github.io/master/Blackcircle.png
@pkshreeman You can check it now, you have a typo. :)
@pkshreeman Try this:
.imageOverlay{
position: absolute;
top: 120px;
left: 135px;
margin: 0 auto;
width: 50%;
}.imageOverlay{
position: absolute;
top: 120px;
left: 135px;
width: 50%;
}
Thank you @jmstubiera @NitinNair89 ! Sigh...so stupid of me..
Interestingly, buttons no longer work.
Thank you @jmstubiera
pkshreeman sends brownie points to @jmstubiera :sparkles: :thumbsup: :sparkles:
:cookie: 95 | @jmstubiera |http://www.freecodecamp.com/jmstubiera
thank you @NitinNair89
pkshreeman sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 293 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
Dunno why that didn't work first time...
@khaduch Thank you so much, sir!!!! i went sleeping, because i thought nobody will answer me. I tried find the error for hours
kenobijr sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1817 | @khaduch |http://www.freecodecamp.com/khaduch
Hello, Sorry my PC crashed
i am building a landing page for my portfolio.. what things should I put in?
about/projects/contact - is it enough?
who knows. we're only hoomans
@NitinNair89 probably your skills - as a separated section=)
i thought i will put it inside about
mmm how do i change the size of a navigation bar and its items?
i'm not seeing any easy to udnerstand answers on google
What did you try in your code?
li a {
font-size: 30px;
}
hm..how does that work?
as in..what is the.."a"
a is the anchor element that you are using inside your <li>
the CSS selector for tags are their tag names. So for <a>, it will be a, for <span> it will be span, etc.
the font-size gets applied to all anchors inside the <li> tag. That's how the above code works
since <li> is a tag, so its CSS selector would be just 'li'.
the CSS selector for classes is a 'period' ( . ) and for IDs is a 'hash' ( # )
mkay mkay
yikes i need a second monitor. all these dman tabs open xD
:D
ought move my tower and just pop my little ole tv up here lol
poor mans creativity
still stuck on my landing page.. i am bad in writing although i have a blog :(
I dunno how to appeal my visitors .. LOL!
can anyone help me with my tic tac toe game project the problem is that my signs are beign overridden
Please select option 1 and X
https://codepen.io/Mohammad_Hasham/full/rryQmV/
Please select option 1 and X
https://codepen.io/Mohammad_Hasham/full/rryQmV/
in this case, potential employers :P
Get rid of the alerts.. and maybe maintain an array of available spaces
I didn't see your code yet, but I guess it is randomly putting up the value. So..
nitin, obviously your landing page needs boobies.
is this alright if i don't use minimax algorithm for tic tac toe game and instead use if else statements as i am finding it really difficult ?
@NitinNair89
@MohammadHasham I am not sure. I didn't even reach that challenge.. Sorry! I hope someone who has completed it can help you better :)
@F22rapt Bad joke.. LOL!
This message was deleted
uhm to maintain font size of H1-H3 elements..would i need to use like a div..
Why did you copy the entire source @Baby007mix ?
@F22rapt No
i dontk know...
shouldn't i?
you should not..you won't learn otherwise
Are you doing FCC challenges @Baby007mix ?
nope! just my own thing!
Try FCC then. You will learn better! :)
nailed it..
or W3schools also had good tutorials! :)
w3 is what i keep pulling up ..
I just wanted to understand why my navigation bar is not displaying I am trying to understand the different nav bars. it says try it! so I am!
Why don't you try the code for navigation only and remove everything else?
okay. thanks for your constructive feedback.
:)
so, How does this look for just a blank slate to be filled in for the portfolio? http://codepen.io/f22rapt/full/xEmZKN/
nav does not look good
change the color scheme
eeee...colors...
seriously xD i'd spend hours on this before getting it prutty
haha
which challenge are you on?
the portfolio..i'm just about done as you can see..as i have nothing to slap in it i figured just partitioning out some space would suffice
mention about the tribute page you did before portfolio
don't keep it blank
don't keep the..port blank or the tribute blank? xD
portfolio
This is mine. I won't update it any longer though. :P
http://codepen.io/Nitin-Chandran-Nair/full/pbPLVk
http://codepen.io/Nitin-Chandran-Nair/full/pbPLVk
alright..well then. I shall press on
ooh i like the scrolling image..Think ill see if i can't do that.
It's all thanks to animate.css
;)
i seriously think ima try to use my tv as another monitor xD
so, where would i be pulling these images from?
which images
?
place holder images. I mean..i wouldn't be using a src would i?
yes..src
bah. complicated..
nope it isn't
says you :o:
<.>
like there are ways i can just stright up copy the code for it..but i wana actually understand it lol
that's a good sign
i think at this stage, being able to code HTML and CSS, and knowing how to add images, various tags, etc.. is more than sufficient
So don't think much, move ahead
still a little hard to get it to work around what i have if i don't know whats going on
hmm
like i know that because i inserted this below everything it appears below my contacts but thats obviously not where i want it
because you put it after your </body> closing tag
place the code where you want it exactly
adding
line-height:25; does not mean you are adding a blank space. It just determines the space between two lines
so i suggest, make your code a simple and easy one.. the JS looks complicated for someone who is at the portfolio challenge. But, if you wrote it yourself, then that's well and good. Work on your HTML part
that was total copy/paste.
well instead of line height then, would i need to use like...margin top and margin bottom?..or is that padding..mmm
none of them
you add a simple <div> and put some height and width between each heading tags
Hi guys, can someone give me a hand?
:hand:
I want to 'expand' the div size
increase height and width
Like the second section , which has another color
But if i expand i have to put like 500px, is it ok?
I mean,is it a good practice?
the portfolio section?
why don't put 100% width?
I'll try
but its 100% related to what?
Good animations
100% to the browser window.. the viewable size
Let me try
I added width 100% to the div css but doesnt make any change.
which div width you want to expand?
I want to get white until the end of the thumbnails
the #thumbnail div i want to expand
Sorry, #portfolio
but it is already 100%
But the color of the div doesnt go until the bottom
Oh, its the height, not the width
:laughing:
thank you mate, ill keep working on this :)
hmmm I'm not aware of this div statement you were speaking of. I'm seeing many different ways to seperate/space out the headings but nothing that seems to be what you were talking about
what i meant was to follow a standard HTML format :)
still lost <.> apologies
:P
<html><body>
<nav>
Your navigation things go here
</nav>
<section>
<header>Heading for that section</header>
<div>Content</div>
</section>
</body></html>
so your about, portfolio, contact will have their own <section> tags and <header> as well
I will be right back in few minutes.
Hello everyone!
Is there any way to center the title of the game "TicTAcToE" right upon the table
https://codepen.io/Y-Taras/full/rrkKWz/
Is there any way to center the title of the game "TicTAcToE" right upon the table
https://codepen.io/Y-Taras/full/rrkKWz/
the title is centered.
what does that div do..
oh wait i get it..but why not a p?
@F22rapt that div will hold contents. You can put a p inside div :)
would that be to..i guess seclude it so its not unintentionally affected by other things then?
probably
with that you have full control on your HTML elements
i reckon
@NitinNair89 i'm talking about header
@Y-Taras <p data-height="265" data-theme-id="0" data-slug-hash="rrkKWz" data-default-tab="js,result" data-user="Y-Taras" data-embed-version="2" class="codepen">See the Pen <a href="http://codepen.io/Y-Taras/pen/rrkKWz/">Tic-Tac-Toe</a> by Taras (<a href="http://codepen.io/Y-Taras">@Y-Taras</a>) on <a href="http://codepen.io">CodePen</a>.</p>
<script async src="//assets.codepen.io/assets/embed/ei.js"></script>
@prattheev I want that header to be right upon the table
<header>
<h2>Tic Tac Toe Game</h2>
</header>
I think you didn't understand what i wanted to say @Y-Taras
The title "Tic..." is already aligned to the center. The table is aligned a little to the left because of "Choose to play"
move the choose to play thing just below the title..if you want :)
<div>
<h2 style="text-align:center">Tic Tac Toe Game</h2>
<table class="gameTable">
<tr>
<td id="a1"></td>
<td id="a2"></td>
<td id="a3"></td>
</tr>
<tr>
<td id="b1"></td>
<td id="b2"></td>
<td id="b3"></td>
</tr>
<tr>
<td id="c1"></td>
<td id="c2"></td>
<td id="c3"></td>
</tr>
</table>
</div>
I guess this would do good instead of header @Y-Taras
grouping the title and table is the best way to do it
@prattheev thanks, I also thought about that way, but didn't want to change html code)
y-taras sends brownie points to @prattheev :sparkles: :thumbsup: :sparkles:
:cookie: 8 | @prattheev |http://www.freecodecamp.com/prattheev
so..for my portfolio just what the fudge should i slip into my "about" section..I'm pretty dense at this yet
just few things about you, what you love, etc. maybe your skillset, experience and stuff
I have none of that lol.
Where you live, educational qualifications
not a single one xD
I'm as fresh as a middle school student
LOL. That's great
You should put it. School name, what subjects u like, why u chose web design, etc.
Trust me, i am as good as you when it comes to describing ourselves :P
"hi I like anime and i'm tired of working 10hr shifts. so plz- I will code for love"
I have been coding my portfolio 2 days and it is still blank :laughing:
that's hilarious @F22rapt :P
I'm a pretty decent writer, but always the first few words just get me for hours at a time
do you blog?
no. I think i would like to though
you said it yourself - pretty decent writer :)
will blog for money
Hmm good
:)
:+1:
you know what..I'm totally popin my tv on my desk and using it as a second monitor..yep
haha
they'r eabout the same size even
:P
Hello World!
welcome to FreeCodeCamp @NitinNair89!
:P
Hello World!
welcome to FreeCodeCamp @NitinNair89!
:laughing:
wake up guys
Hello!
yaaaaawn hi hi
was having such a lovely dream..
hahaha
Hi guys I'm working on personal portfolio and I've got problem with gradient in my progress bar
This is how I want to look like: http://codepen.io/dawidb/pen/amPgaQ
This is how it looks like : http://codepen.io/dawidb/pen/dpGbVB
Good one @Dawidby Gradient looks fine to me
this color scheme is just awful http://codepen.io/f22rapt/full/xEmZKN/
I can't even with myself
Then don't use it :smile:
I see that gradient progress bar in 2nd link is blue ... and I want to be gradient one :)
didn't get you
both pens are yours, what issue are you facing?
yes, both are mine, 1st link is the gradient bar that I want to put into my personal portfolio .. after copying working gradient into portfolio it doesn't work :<
you gave the gradient different.. as a background
the gradient works with your about border
@Dawidby in 2nd codepen you did not close some braces properly before your
@media rule check that if you resolve those , your progress bar will be gradient colored. And also your .progress-bar styles are inside media query .
uuuh..Its..on the tip of my puny brain..
Hi @vinaypuppal :)
@F22rapt where is the tip of the brain located? the top?
I don't even know
@NitinNair89 Hi
@vinaypuppal I was thinking maybe on click your active nav can be dark opaque background and white text
have you tried that already?
@F22rapt according to google image search, it's the front of the brain. 
@NitinNair89 sorry I did not understand your question properly??
for your website @vinaypuppal
so..I'm trying to make a word wrap for my p statement inside of my div...only examples i'm pulling up are using div though..but i ahve more than one div..
This message was deleted
This message was deleted
on click, the text is grayed out
so wanted to tell you
@F22rapt didn't get your question
I'm just trying to make a word wrap for my paragraph.
@NitinNair89 oh okay is there any UX issue if its greyed out ??
less readability
word wrap as in?
word break.. to shorten the width
tried padding?
@F22rapt tried css word-wrap? http://www.w3schools.com/cssref/tryit.asp?filename=trycss3_word-wrap
no..<.>
"{" is an unexpected token..
@NitinNair89 tag people when replying I am not understanding to whom your replying .
whats your suggestion for this :point_up: October 22, 2016 7:32 PM
whats your suggestion for this :point_up: October 22, 2016 7:32 PM
@NitinNair89 oh okay is there any UX issue if its greyed out ??
Less readability
@F22rapt some issue with braces in your code
grrrr
@NitinNair89 since the background is colored i did not find any good color to use so i used grey to indicate active page. And suggestions which color would be more readable
nope wait i know whats up..heh
how can i split my HTMlL page like a newspaper?
i want to write in sections
@F22rapt you have
p1 tag instead of p tag in HTML and inside your ul you gave a closing div remove that.
follow HTML5 guidelines @osaidAz
i want to have 2 raws in the same page
@NitinNair89 really man -_-
@osaidAz check bootstrap tutorial from Tutorial Republic
try it once, then if stuck, we are there to help you :)
i want in HTML not bootstrap
Bootstrap is a responsive framework which will make work easier for you. If you want it plain, then code gets a little complex
@vinaypuppal THE GREATEST!
@osaidAz do you mean you want two columns or newspaper folding effect??
@vinaypuppal Good job Pal, all working good!
@Dawidby :smile:
Hey guys, i have a trouble with this
In the second section (portfolio) you can scroll to the right and see its not fully white..
Its supposed to be 100% of the width of the screen
@vinaypuppal yes i want 2 columns
not columns , raws
i want 2 raws in my page
he means 'rows' @vinaypuppal
@osaidAz rows?? what are raws??
omg
bye , thanks for nothing
so my section tag seems to be broken for me.uhm..
<div class="text-center">
<section>
<h2> About</h2>
<div>
<p class="text">Hello I am an aspiring web developer. I've chosen this field to find a career in something interesting and get out of the usual nine to five. I hope to use my skillset to make a difference in the companies or communities I work for. </p>
</div>
</section>
<section>
<h3> Contact</h3>
<div>
<p>buuuuu</p>
</div>
</section>
</div>
</div>
</div>
<section>
<h2> About</h2>
<div>
<p class="text">Hello I am an aspiring web developer. I've chosen this field to find a career in something interesting and get out of the usual nine to five. I hope to use my skillset to make a difference in the companies or communities I work for. </p>
</div>
</section>
<section>
<h3> Contact</h3>
<div>
<p>buuuuu</p>
</div>
</section>
</div>
</div>
</div>
my text thats in the ABout is appearing beneath everything..
@osaidAz
div is block level element and two div's like below create two rows <div>row 1</div>
<div>row 2</div>
Any idea?
@F22rapt please use the 'analyze html' option
<.> didn't tell me anything relevent to the problem..pointed out osme other things i can adress though..
@gastikirs on body add
overflow: hidden it will remove horizontal scroll bars body{
overflow: hidden;
}
@vinaypuppal I agree, but I feel something with his grid is wrong, checking that
@vinaypuppal It also removes the up and down bar
@NitinNair89 yeah i did not find whats wrong so i suggested that
@gastikirs sorry its
overflow-x
@vinaypuppal And i need to scroll, theres content
he needs the scrollbar, try
overflow:vertical
@gastikirs add
overflow-x: hidden
or overflow:scroll
yeah, i forgot :P
Its not working anyway. I still have the 'yellow' line in the right side of the website
it's not the yellow line, it's your background color
Yeah, i know. But i dont understand why
The div is supposed to have 100% of the width
@gastikirs did you save your pen after adding , i still see horizontal scrollbar
body{
overflow-x: hidden;
}
sigh. ima just tear some of my code down..
Sorry, i did it on my localhost.
Ill do it there, but you will see its not working
There
@gastikirs yes if you add you wont see that yellow background you were seeing before
Well, apparently in codepen its working
But in my localhost, which i have the exact same code, its not
I still see the background
good luck @F22rapt
Ah, wait. I know why. Forgot to copy the navbar
@gastikirs okay update your pen with navbar we will check again
Check now
@gastikirs i still see old page only
cna you add a class to <section>?
or will it have to be div
You dont see the navbar?
got it..
@gastikirs yes repost your pen link again here that may help to make we are viewing same pen
@F22rapt you can add class to almost all the elements
@gastikirs If i remember, this issue wasn't there few hours back right?
im trying to build my own portfolio but confused chosing the style
i need help choosing the style, which one you guys prefer?
(A)http://s1113.photobucket.com/user/khoirihendra/media/a_zps4rxpu1dq.png.html
or
(B)http://s1113.photobucket.com/user/khoirihendra/media/b_zps5f9jn9zy.png.html
i need help choosing the style, which one you guys prefer?
(A)http://s1113.photobucket.com/user/khoirihendra/media/a_zps4rxpu1dq.png.html
or
(B)http://s1113.photobucket.com/user/khoirihendra/media/b_zps5f9jn9zy.png.html
@NitinNair89 Its similar. I have big problems understanding this thing
@gastikirs i don't see horizontal scroll in the above pen with navbar you shared. Is the same code you have locally??
@khoirihendra I'd legit just go with which one you think would be easier to pull off lol
@vinaypuppal There isnt horizontal scroll
both easier :
But you can scroll anyway with the scroll click (3rd click) and see that is not good
the only difference is the navigation @khoirihendra
@NitinNair89 yeah, thats one got me confused
build both, present it as viewer's choice
@khoirihendra
@gastikirs okay understood, give a min i need to check your html grid structure
bah time to admit defeat and make out with the bed..catcha fellas later
cya @F22rapt :sleeping:
@gastikirs I was not able to find whats causing that but you can solve by overriding few bootstrap styles.
.row {
margin-right: 0;
margin-left: 0;
}
.container-fluid {
padding-right: 0;
padding-left: 0;
}
@vinaypuppal Can you please take a look at his pen settings?
@gastikirs Have you tried wrapping the portfolio with
<section> and give that section width:100% ?
@NitinNair89 yeah he added bootstrap two times and one
head settings and in css panel settings
is that the cause @vinaypuppal
@NitinNair89 no i removed one and checked but still same problem
Ill try that @NitinNair89
Stills the same
And removed the bootstrap in head setting
ok. :(
@vinaypuppal help pls
@gastikirs I dont see that yellow background when horizontally scrolled in below pen https://codepen.io/vinaypuppal/full/dpabkd/
Looks solved
What did you do?
@gastikirs i just added what i suggested you before here :point_up: October 22, 2016 8:24 PM
I see
But isnt a bad practice to overwrite boostrap style?
nope @gastikirs If you're good at bootstrap, you're free to customize (if you know what's where and how it works). That's the motive of open-source! :)
Thanks :)
Hi there!
I am working on the Weather App project and seem to be having a scoping issue that doesn't make sense to me
Is anyone available to take a look?
@shullmb Wassup! :) What's the error?
Alright, here goes....
in theory, I can create a variable
var test;
then i can set this variable inside a function
so?
is the variable declared inside the function or outside?
@shullmb
function setTest() {
test = 2;
}set inside
nope, won't work I guess. unless the function and the variable fall inside the <script> tag
@shullmb AJAX call is ASync so any code below your ajax call runs before you got data. may be your using
text outside your ajax call before even ajax req completes. so test is undefined, this may be correct if i guessed your problem
thanks @vinaypuppal
shullmb sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 634 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
pass that variable as an argument to setTest() then you can do whatever you want with that variable :D
that is likely it
hi all.. the Jquery tutorial, which jquery version does it use? also does it use jqueryui or just jquery. for some reason the class animated bouce does not work in my projects... wonder if its because jquery version or do i need to add jqueryui cdn?
this is my original pen...http://codepen.io/shullmb/pen/pEkqxN
I was unhappy with the nested AJAX calls, so I set out to clean it up and broke everything here http://codepen.io/shullmb/pen/XjoogL/
I was unhappy with the nested AJAX calls, so I set out to clean it up and broke everything here http://codepen.io/shullmb/pen/XjoogL/
@ricky11 you need to animate.css for animations to work. Fcc tutorial already includes it but in your own projects you need to add it. And it's not jquery issue
@vinaypuppal what is the cdn for the animate.css? isn't it https://code.jquery.com/jquery-3.1.0.slim.min.js
Sorry to popup. I had this in handy - <link href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.css" rel="stylesheet">
@ricky11
@shullmb oh your using slim version of jquery try full version of jquery if you want jquery animations which are different from animate.css
@vinaypuppal @NitinNair89 does fcc teach us this , dont see it anywhere.
@shullmb if you have nested callbacks then try promise version of jquery Ajax syntax
I'll look into that
thank you!
@ricky11 no. You can just look it up on github . The doc is quite good
@NitinNair89 yes i got you, but i wish for beginners it would be nice if FCC told us about the src for jquery and that we need to add the css src as well. -- im looking at jquery.org to figure it out now thanks.
ricky11 sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 294 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
jquery and animate.css is different. Don't get confused please :)
just search animate.css on google, u will get it's doc on github
@NitinNair89 oh.... it is indeed confusing becasue FCC starts the jquery course with "Now we're ready to learn jQuery" then it tells us to addClass("animate bounce"); how is one suppose to know that animate is not part of jquery??
@ricky11 in the challenges the animate.css lib is already loaded. the idea is to learn how to add a class to an html element using jquery. that two classes "animate bounce" where chosen just for the learner to immediately visualize what happens when you add a class
@sorinr -- Thanks for your explanation. but one would assume that this css is built in to jquery lib that has been added by FCC. so when we create a project ourselves after adding in jquery , we only then learn that animate bouche is not part of jquery and requires another animate.css library which FCC fails to inform us about.. but i guess that is what gitter is for.. i just wish it would explain the backend a bit more. -- also why teach us animate.css there are many animations built in to jquery itself not the minified version.
ricky11 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 780 | @sorinr |http://www.freecodecamp.com/sorinr
@sorinr is perfectly right! :)
@NitinNair89 fcc does indeed say jquery is loaded, but it does not say animated.css is loaded.
@ricky11 animate.css makes developers life a lot easier
because for a perfect animation using CSS, there's lot of codes.. and with this file, you only need to add classes to the elements you want to animate. I use it in almost all of my projects :)
yes, you are right. But as @sorinr said, just focus on jquery methods - addClass, removeClass, etc.
it's not about animate.css :)
@NitinNair89 yes i see. projects can get bloated very quickly with so many libraries.
@ricky11 jquery has some animation functions incorporated. here some ref: https://api.jquery.com/category/effects/
@NitinNair89 okay so now im going to locate a cdn for animate add at the link.
@NitinNair89 i discovered animate.css recently. it is a godsend.
@ricky11 but the exercise was to learn to add/remove classes using jquery
@emamador so you were not confused when adding jquery and the animate bounce did not work
Sorry to popup. I had this in handy - <link href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.css" rel="stylesheet">
@ricky11
@sorinr yes it was more about add/remove classes, but similar to bootstrap, it was very clear that we needed bootstrap.js and bootstrap.css.. it wasn't clear with animate.. but i guess i should have figured it out that animated is a class that is either in bootstrap.css or somewhere else.
@NitinNair89 wow 74kb file
@NitinNair89 huge just for a few css animations.
@ricky11 no because when i was messing with codepen.io settings I saw that under add external css Animate.css was an option. And i know that if its an external css file then its something seperate. I also know this because fcc taught us the same with the bootstrap. that you add it as an external source.
@ricky11 not few mate, there's loads of it
@emamador yes im not using codpen but normal atom ide editor, i also thought perhaps animate bounce are bootstrap css classes. as we were not taught animate.css -- anyway i will drop it and move on. thanks all.
ricky11 sends brownie points to @emamador :sparkles: :thumbsup: :sparkles:
:cookie: 211 | @emamador |http://www.freecodecamp.com/emamador
Hello! I am working on a single webpage myself, after I made the First FrontEndProjects. I have an issue with data attributes. And I have hard time even defining it for search in google
error?
@ndzhingarova what issue do u have with data attributes?
they do not work and they do not even look active, like class or type
it is html5, i have bootstrap and jquery links
@ndzhingarova when using data attributes in html there is javascript you have to write to interpret them. here some quick examples: http://www.w3schools.com/tags/att_global_data.asp
I'm working on the weather app. why doesn't json load? chome console message: http://i.share.pho.to/6df924bb_o.png
@emamador try to add "&callback=?" to your json url
I am not sure I got the idea. I have next attributes: data-toggle, data-target, data-ride, data-slide-to
@ndzhingarova can u post the codepen link?
my syntax is as on the example
it is not codepen
it is on my comp, where could i upload it?
@emamador how are you calling json?
@ndzhingarova Um, what error are you facing?
@ndzhingarova so you have something like
<div data-toggle="something in here" data-target="some other thing in here" etc ></div> ?
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
and one carousel: <div id="myCarousel" class="carousel slide" data-ride="carousel">
id, class are active
I do it on notepad++ and id, class type got red
data atributes do not
don't rely on notepad++ syntax coloring
your code is not working?
the navbar does not look ok
I just started the carousel. Actually it is not done yet. But i saw it here too
@ndzhingarova have you added bootstrap links (css and js) to your html page?
Hi FCC. I'm trying to finish my tribute page challenge, but I've run into a wall recently. I can't manage to 1) Put my text and images into columns 2) Put my first image into a background page and have go down locked 3) Fonts aren't getting updated.
yes, two in the <head> for ccs and team. And Jquery and js in the end of the <body>
@NitinNair89 doesn't work its refusing the connection ove https
How do i make submit buttons?
@emamador have you tried with http?
@magnus195 submit buttons can be made with
<input type='submit'>
@NitinNair89 @sorinr Ok, thank you for your time. Obviously this will be difficult to communicate. I will finish the carousel and see if it works. Then I will upload somewhere and post a link. So we could be on one page
:cookie: 781 | @sorinr |http://www.freecodecamp.com/sorinr
ndzhingarova sends brownie points to @nitinnair89 and @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 295 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
@ndzhingarova Can send image of your code?
that is the beginning and the navbar
get rid of the integrity.. Show me the jquery and the bootstrap js imports please?
@ndzhingarova Also check this - http://getbootstrap.com/getting-started/#template
It has sample templates you can refer
@ndzhingarova Check this too - http://getbootstrap.com/components/ for all components
imports look good @ndzhingarova :)
@NitinNair89 http://i.share.pho.to/d69f6f7a_o.png
so I have to use https but if i do the api doesn't work. it's something with the api itself because it says Err connection refused.
I rewrote it from bootstrap page, i copied it
but how are you calling the url @emamador ?
can show us the code?
ok @ndzhingarova then why doesn't it work? have you checked browser console?
do you mean the inspector tool(mozilla)?
Yep
be right back after dinner guys! :)
@NitinNair89 ok, not quite sure what to look for here :)
@NitinNair89
function weatherApp (){
$.getJSON("http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139&APPID=d20ca486d73723c50174e1b7564caf53", function(a) {
$(".appbg").html(a);
});
}
weatherApp();
@emamador I used the HTTP version only.. and nothing is wrong with your URL. If you paste it in your browser, you will get weather data
problem might be in your javascript
@ndzhingarova You will see some red colored errors in your console when you run your code
@ndzhingarova do uhave on your file whats below "<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->" ? and in the same order as per http://getbootstrap.com/getting-started/#template
@sorinr Check the screenshots above.
@NitinNair89 yea. then there is some bad or incomplete navbar
yep, that's what i think
@NitinNair89 the part with ajax is missing
but i have different one with jquery
@ndzhingarova why do you need ajax? You just need the right versions from cdn..
Hey People
What's Up?
@NitinNair89 I do not have this one: <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
About what they're talking here?
you need to ask about @someone!
I have : <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
can anyone help me a little but in the design of the qute machine?
@ndzhingarova Try that then
Hello @aviTwito How are you?? Late today?
http://codepen.io/avitt/pen/ORBxXL
when i look at this on the phone the center box is to small and the text and button slide out
when i look at this on the phone the center box is to small and the text and button slide out
@MarcusVRdoN @ndzhingarova Ran into a problem trying to run bootstrap code in her local system.
@NitinNair89 hi im fine how are you?
@aviTwito I am fine too! Have you made your code responsive?
@NitinNair89 didnt had time to work on it since we last did it togehter
also the link was n good it always brought the same quote but i left it for now
also the link was n good it always brought the same quote but i left it for now
Then can't do anything about your code not rendering properly in small devices.. @aviTwito
but if it meets the requirement, then proceed ahead
@NitinNair89 Hmm... Ok! I'll be watching to see if I can contribute something!
@NitinNair89 but it suppose to be respnsive. i used % for the size and im using boostrap
agreed, but you did not use classes for small devices - col-xs and col-sm
@NitinNair89 oh that right
Why is the responseText always just ""?
var searchArticles = function(searchText){
//console.log("searching");
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if (xhr.readyState == XMLHttpRequest.DONE){
console.log("yay");
console.log(xhr.responseText);
}
};
xhr.open('GET', "https://en.wikipedia.org/w/api.php?action=opensearch&search=" + searchText + "&limit=8&namespace=0&format=json", true);
xhr.send(null);
};When I go to https://en.wikipedia.org/w/api.php?action=opensearch&search=anime&limit=8&namespace=0&format=json directly in my browser, it shows an okay json.
Codepen at http://codepen.io/porygonj/pen/KrOBZv/?editors=1111
@NitinNair89 still no change on the hone screen
@aviTwito just adding the classes won't work. You need to understand how the grid actually works
@NitinNair89 Meanwhile i copied carousel. It shows the pictures one after the other in a column
col-*-12 means occupy 12 columns in a row @aviTwito
@ndzhingarova maybe you need to initialize carousel? Anything in the doc?
I say this because I use Materializecss.com and carousel needs initialization to work :D
initialize is? :(
@NitinNair89 i know that iv`e read all about it here: http://getbootstrap.com/
http://getbootstrap.com/css/#grid to be precized
http://getbootstrap.com/css/#grid to be precized
no buddy. Read this - http://www.tutorialrepublic.com/twitter-bootstrap-tutorial/bootstrap-grid-system.php @aviTwito
Trust me, i didn't find any better tutorial - took me 5 days to learn it from there, and I am proud that i can atleast create average layouts in bootstrap grid.
look at the 2nd link
ok ill read it too
:)
but anyways, col-xs-12 means i want it to take the all row, right?
@NitinNair89 I have to leave. Thank you for your time!
:warning: ndzhingarova already gave nitinnair89 points
ndzhingarova sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
@ndzhingarova see you tomorrow! :)
@aviTwito yes
are you sure it related to the col class and not something else i massed up?
the reason the text and button all massed up in small screen
in full screen as well @aviTwito
it's all happening due to position:absolute and margin setups :(
@porygonj add &origin=* to the url
@NitinNair89 oh ok i tought i related to this. i just wanted the box to be centered in any screen and took some code from an answer on stackoverflow
Hello guys~ Need some help here.
I am working on the javascript calculator.
This is my codepen.
That's ok @aviTwito At this point, you only need the basics and knowledge of ajax calls. :)
The problem is after i click equal.
Although it prints the right result.
what do u mean by ajax calls? @NitinNair89
@aviTwito I meant API calls through AJAX or JSON whichever
But when i want to click on other numbers key to restart
It only lets me input one number....
@NitinNair89 oh ok
Don't quite know why it happened....
@aviTwito http://english.ajax.nl/streams/ajax-now.htm here Ajax
ill get back to it
@NitinNair89 but the json api we used was no good i need to find new ne
@Honesty1997 I didn't get any errors. I executed three operations and it worked
@aviTwito oh ok, plenty available on the net :)
After you click on equal
you just randomly click some number key
I did, 5-4=, 7-4= and 3-4=
all worked correct
i did not use "AC" button
@Honesty1997
Yeah
Try click several numbers
like 9999 ?
Yeah
After click on equal
it stores only the last digit
?
Yes.....
Tried to figure out
And it kind of crushed now..
@Honesty1997 Does this work proper?
var x = parseInt(comp2);
var y = parseInt(comp);
comp2 and comp and arrays, right?
console.log(x);
console.log(y);
oh i see....
I just casually delete the join function
I now add it on
The calculator can work fine when doing first computation.
ok
I did not do any calculations now, entered number and pressed =
to check the console
So I've been working on tic tac toe, and I can get it so that the player can choose the number of players, and I copied the code for the x's or o's, but that doesn't work.
Oh i found the problem!
I forgot to change the count variable named compute!
It works fine now!
that's awesome!
@NitinNair89 Thanks!
honesty1997 sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 296 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
I didn't help at all @Honesty1997 :)
Haha still thanks for replying and reviewing my project!
haha @Honesty1997 :)
@Cameron-Burkholder the JS Analysis shows this -
Reassignment of 'game', which is is a function. Use 'var' or 'let' to declare bindings that may change.
that's because you declared 'game' variable outside the function, so inside the function it will be 'undefined'
Maybe that's why the rest of the Javascript code is not functioning
@NitinNair89 I looked through the XMLHttpRequest docs, but I don't see anything that contradicts what I'm already doing. Is there some glaring issue that should have been obvious if I looked through the docs?
I am not sure @porygonj I never tried using XMLHttpRequest for API calls in my projects. Have you tried the same with JSON on .ajax() calls?
Game should be a global variable, so I renamed my function and nested my other .click triggers to make less functions, but still nothing.
@NitinNair89 I haven't tried it with an ajax() call, but I'll go try that.
@Cameron-Burkholder Put this outside the main function but inside the doc.ready():
$("#o h3").click(function() {
player = "o";
games();
});
same for:
$("#x h3").click(function() {
player = "x";
games();
});
rest you can format, since I am not sure exactly when you want to call these functions as I saw them in multiple places.
If needed, use the same function but with different arguments. And based on those arguments, you can decide what to execute..
@porygonj All the best! :)
http://codepen.io/pkshreeman/pen/RGEVkY?editors=1111 Can someone help me with audio. I don't think it's working.
@NitinNair89 good morning!
@pkshreeman It's night here! Good Morning!
Did you try the <embed> tag?
@NitinNair89 :) Yeah, I remember...you said good morning other time when it was midnight.... No. I am not familiar with <embed> looking into it.
hehe.. where are you currently?
I am in India
california
hmm, that's why the timing difference :P
yep..it's 11:14AM here.
11:44PM here
really? 12 hours exact.
12:30
right?
Here? it's 11:15AM
11:45 - 11:15 = ?
:grin:
lol.
well, technically that's :30
:P
@NitinNair89 thanks...I used <audio> as that seem to be HTML5-ish now. Although I am not sure why the one i used didn't work...oh well. Now, time to make arrays for the game...
pkshreeman sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 297 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
:)
Good one.
Don't thank me, i did nothing
Hi,
Can somebody help me please what am I doing wrong? It seems my code always true and not working for the false cases.
function mutation(arr) {
//create two variables for the first string and the second string
//lowercase them
//split each arrays to letters
firstArray= arr[0].toLowerCase().split('');
targetArray=arr[1].toLowerCase().split('');
//looping through the array
//check if the letters in the target string are in the first string, order doesn't matter
for (var i = 0; i<firstArray.length; i++){
for (var j = 0; j<targetArray.length; j++){
if (j!==i){
return false;
}
else{
return true;
}
}
}
//return firstArray + ", " + targetArray;
}
mutation(["Mary", "Aarmy"]);
in your code, even if one letter from target is found in first, it will return true
@NitinNair89 So it doesn't check through all the letters that is the problem?
instead of using return statements, set some flag or switch. Then based on that flag or switch return true or flase
yes, once the code hits "return" it stops processing and control goes back to caller
so, the rest of the code is ignored
Okay, thanks @NitinNair89
amarillia sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 298 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
ok then, i hope others are online. It's late here. Let me know if it works! Cya
Bye @NitinNair89
Hi all
hey
How can i adjust the thumbnail size to 100% of the column?
Nvm i got it hah
Guys, 2 questions:
How can i center the text in the thumbnail? Like center in the middle, not just left to right
How can i center the text in the thumbnail? Like center in the middle, not just left to right
And i cant add new content to the last div (contact) .. i still dont understand why
In a new row, under the social media icons
@gastikirs text-center to the row
Has anyone completed tic tac toe, or can help me with it?
Not working @RuinIsProbablyTaken
I have code that should run you through two sets of buttons, the first set sets the number of players, and the second lets you choose if you want to be x or o. The first set works properly, but the second set doesn't do anything that its supposed to on click.
@gastikirs working for me
@RuinIsProbablyTaken he probably wants it to be vertically centered
@gastikirs https://codepen.io/RuinIsProbablyTaken/pen/QKYbob forked, look at the first row
@kat-mag I'm more thinking that he wants to center the image as well or center the text so it's centered as opposed to the page not the columns it takes up
@Cameron-Burkholder nvm didn't look carefully enough
@Cameron-Burkholder it works, it sets the player variable. I don't understand what's the problem here
@RuinIsProbablyTaken I meant the 'coming soon' text inside the thumbnail
Anyway im going to sleep. I'll continue tomorrow :)
I can't figure out how to run jquery on clicking an input type thing (like a checkbox or radio)
@gastikirs Add padding around the text, so to the parent element. You can't center vertically in any other way.
@xSnowpeltx Pen?
@xSnowpeltx add jquery to ur settings
omg i cant believe i forgot to do that
:)
everything works now c:
@xSnowpeltx change the col classes inside the .center row to xs instead of md
but I'm making it for a normal screen...
they won't overlap on smaller displays then
@xSnowpeltx xs goes from smallest to largest
so that will work for smalls and large
ah ok
I know this may not be the most straight forward approach to this challenge but here is my code for Title Case a Sentence.. I think there may be a bug because I return the correct output for every scenario but it won't pass me. Can anyone help? function titleCase(str) {
var strArray = str.split(" ");
var word;
var rest;
var build = "";
for(i = 0; i < strArray.length; i++){
word = strArray[i].substring(0,1);
word = word.toUpperCase();
rest = strArray[i].substring(1, strArray[i].length);
rest = rest.toLowerCase();
build += word + rest + " ";
}
return build;
}
var strArray = str.split(" ");
var word;
var rest;
var build = "";
for(i = 0; i < strArray.length; i++){
word = strArray[i].substring(0,1);
word = word.toUpperCase();
rest = strArray[i].substring(1, strArray[i].length);
rest = rest.toLowerCase();
build += word + rest + " ";
}
return build;
}
@ssgriffen any chance you could format that to make it easier to read?
@karpimpski hey I figured it out I'm adding a space after the last word whichh is fuc*ed
@ssgriffen no just add ``` before and after your code
code here
This message was deleted
@ssgriffen wow, I just re-read it and completely didn't realize you meant you had it figured out. nice work!
ahoy there
this is confusing
wow you really do this on your own
thats good because i felt i was just doing the challenges and not learning
is there a difference between w3-container and just container?
or maybe thats just a product of what i'm reading
@F22rapt w3-container
mmm what is W3 though..like..just..uh
@F22rapt
W3.CSS is a modern CSS framework with built-in responsiveness: :)
mmm no chang in my text..surely i can adjust the margins and paddings though..right..