text: These are chat archives for FreeCodeCamp/HelpFrontEnd
  jttyeung sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
  :warning: jttyeung already gave tylermoeller points
  init_hi_turn(), you are adding another click handler for the
  .classelements. 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 variable
  and 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.
  dfshould 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 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
  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('', 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>' ) }
  c0d0er sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
  col-sm-8,
  col-sm-4, etc?
  xs,
  sm,
  md,
  lgif I remember them all correctly...
  <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.
  class="container"div as the parent for all of your
  rowand
  coldivs. It probably won't work the other way around.
  <style>section from your HTML panel. It might just mess with your page because of the way CodePen loads things...
  <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"...)
  col-sm-6grid. 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?
  <a href="url" target="_blank"> ....</a>
  @media screen and (max-width:400px) { .brand-logo { color: red; } }
  otto-aa sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
  <div class="text-center"
  <div class="text-center">
  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>
  iansmit7 sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
  .nav-pills{
  z-index:1;
  font-size: 20px;
  background-color: saddlebrown;
  margin-bottom: 9%;
  color: white;
  @F22rapt this is the css.nav-pills{
  z-index:1;
  font-size: 20px;
  background-color: saddlebrown;
  margin-bottom: 9%;
  color: white;
  devd01 sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
  @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>
  text-decoration: none;
  #navbar a{ font-size:40px; text-decoration: none; }
  skfwnelf sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
  #navbar-wrapper{ width:100%; height:100px; background-color:white; padding-bottom:20px; opacity:0.7; position:fixed;
  margin: 0;on the body :)
  mangoking-iv sends brownie points to @nitinnair89 and @otto-aa :sparkles: :thumbsup: :sparkles:
  @sycrat hey that's cool! Not about links on codepen: do it like that
  <a href="" target="_blank" alt="blahblah">click here</a>
  TARGET BLANK - it's important otherwise your links will not open
  @pkshreeman Could be an issue with specificity of the elements. Associating the image with a class like this:
  <img src="" class="imageOverlay">
  Then apply these style to that class
  .imageOverlay { position: absolute; top: 120px; left: 135px; }
  sycrat sends brownie points to @kurumkan :sparkles: :thumbsup: :sparkles:
  @sycrat hey that's cool! Not about links on codepen: do it like that
  <a href="" 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. :)
  .imageOverlay{ position: absolute; top: 120px; left: 135px; margin: 0 auto; width: 50%; }
  .imageOverlay{ position: absolute; top: 120px; left: 135px; width: 50%; }
  pkshreeman sends brownie points to @jmstubiera :sparkles: :thumbsup: :sparkles:
  pkshreeman sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
  kenobijr sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
  line-height:25;does not mean you are adding a blank space. It just determines the space between two lines
  Follow the above approach, if you can :)Follow the above approach, if you can :)
  <html><body> <nav> Your navigation things go here </nav> <section> <header>Heading for that section</header> <div>Content</div> </section> </body></html>
  @Y-Taras <p data-See the Pen <a href="">Tic-Tac-Toe</a> by Taras (<a href="">@Y-Taras</a>) on <a href="">CodePen</a>.</p>
  <script async</script>
  @prattheev I want that header to be right upon the table
  <header>
  <h2>Tic Tac Toe Game</h2>
  </header>
  <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>
  y-taras sends brownie points to @prattheev :sparkles: :thumbsup: :sparkles:
  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:
  This is how it looks like :
  @mediarule check that if you resolve those , your progress bar will be gradient colored. And also your
  .progress-barstyles are inside media query .
  @NitinNair89 oh okay is there any UX issue if its greyed out ??
  Less readability
  p1tag instead of
  ptag in HTML and inside your
  ulyou gave a closing
  divremove that.
  divis block level element and two div's like below create two rows
  <div>row 1</div> <div>row 2</div>
  overflow: hiddenit will remove horizontal scroll bars
  body{ overflow: hidden; }
  overflow-x
  overflow:vertical
  body{ overflow-x: hidden; }
  .row { margin-right: 0; margin-left: 0; } .container-fluid { padding-right: 0; padding-left: 0; }
  <section>and give that section
  width:100%?
  headsettings and in
  csspanel settings
  var test;
  declared outsidedeclared outside
  function setTest() { test = 2; }
  textoutside your ajax call before even ajax req completes. so
  testis undefined, this may be correct if i guessed your problem
  shullmb sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
  ricky11 sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
  ricky11 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
  Sorry to popup. I had this in handy - <link href="" rel="stylesheet">
  @ricky11
  ricky11 sends brownie points to @emamador :sparkles: :thumbsup: :sparkles:
  <div data-toggle="something in here" data-target="some other thing in here" etc ></div>?
  <input type='submit'>
  :cookie: 781 | @sorinr |
  ndzhingarova sends brownie points to @nitinnair89 and @sorinr :sparkles: :thumbsup: :sparkles:
  @NitinNair89
  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.
  function weatherApp (){ $.getJSON("", function(a) { $(".appbg").html(a); }); } weatherApp();
  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', "" + searchText + "&limit=8&namespace=0&format=json", true); xhr.send(null); };
  When I go to directly in my browser, it shows an okay json.
  Codepen at
  ndzhingarova sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
  var x = parseInt(comp2); var y = parseInt(comp);
  only displays the last digitonly displays the last digit
  console.log(x); console.log(y);
  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.
  honesty1997 sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
  Reassignment of 'game', which is is a function. Use 'var' or 'let' to declare bindings that may change.
  $("#o h3").click(function() { player = "o"; games(); });
  $("#x h3").click(function() { player = "x"; games(); });
  pkshreeman sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
  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"]);
  amarillia sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
  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.
  code here
  W3.CSS is a modern CSS framework with built-in responsiveness::)