without spoiling this excercise for me, can you guys tell me if I'm on the right track...
function titleCase(str) {
var arr = str.split(" ");
for (i = 0; i < arr.length; i++){
arr[i].substring(0,1).toUpperCase();
}
return arr;
}
titleCase("I'm a little tea pot");
function status(stat){
$.getJSON(streamsLink + stat, function(json) {
/*optional stuff to do after success */
$('#'+ stat).text(json.stream.game + ': ' + json.stream.channel.status);
});
}
https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.0/normalize.css
$('#online').click(function() {
console.log(status('esl_sc2'));
you will see you get undefined
dmsalati sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1400 | @sorinr |http://www.freecodecamp.org/sorinr
function status2(stat){
$.getJSON(streamsLink + stat, function(json) {
/*optional stuff to do after success */
return json
});
$('#online').click(function() {
//shows esl_sc2 when online
if (status2('esl_sc2')) {
$('#esl').show();
} else {
$('#esl').hide();
}
//shows FreeCodeCamp when online
if (status2('freecodecamp')) {
$('#fcc').show();
} else {
$('#fcc').hide();
}
//shows loltyler1 when online
if (status2('loltyler1')) {
$('#ty').show();
} else {
$('#ty').hide();
}
//shows cretetion when online
if (status2('cretetion')) {
$('#cret').show();
} else {
$('#cret').hide();
}
});
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Woodturners are Chiselers</title>
<body>
<H1>Woodturners spit sawdust</H1>
<form>
<p>Please Register</p>
<label for="First_Name"> First Name: </label>
<input type=text id="first_name" name="first_name">
<br /><br />
<label for="last_name"> Last Name: </label>
<input type=text id="last_name" name="last_name">
<br /><br />
<label for="eMail"> eMail: </label>
<input type=text id="eMail">
<br /><br />
<label for="password">Password:</label>
<input type="password" id="password" name="password">
<br /><br />
<label for="Confirm_Password"> Confirm Password:</label>
<input type=text id="password" name="password">
<br /><br />
<label for="Date_of_Birth"> Date of Birth: </label>
<input type=date id="Date_of_Birth" name="Date of Birth">
<br />
<br />
<p>Select your gender.</p>
<select name="gender">
<option value="male">Male</option>
<option value="female">Female</option>
<option value="something_else">Something Else</option>
</select>
<br />
<br />
<p>Select your favourite activity</p>
<label for="read">Read</label>
<input type="checkbox" id="read" name="activity" value="read">
<label for="write">Write</label>
<input type="checkbox" id="write" name="activity" value="write">
<label for="eat">Eat</label>
<input type="checkbox" id="eat" name="activity" value="eat">
<label for="sleep">Sleep</label>
<input type="checkbox" id="sleep" name="activity" value="sleep">
<label for="be_merry">Be Merry</label>
<input type="checkbox" id="be_merry" name="activity" value="be_merry">
<br />
<br />
<p>Tell us about yourself.</p>
<textarea name="description"></textarea>
<input type="submit" value="Submit">
<br /><br />
<input type="submit" value="Submit">
</form>
</body>
</head>
</html>
your code in here
and paste you code
</head>
after closing the </body>
tag. it should be before opening the `<body>'
Error: Duplicate ID password.
From line 28, column 9; to line 28, column 55
↩ <input type=text id="password" name="password">↩
Warning: The first occurrence of ID password was here.
From line 24, column 9; to line 24, column 61
↩ <input type="password" id="password" name="password">↩
Warning: The date input type is not supported in all browsers. Please be sure to test, and consider using a polyfill.
From line 32, column 9; to line 32, column 65
↩ <input type=date id="Date_of_Birth" name="Date of Birth">↩
Error: The for attribute of the label element must refer to a non-hidden form control.
From line 11, column 9; to line 11, column 32
↩ <label for="First_Name"> First
Error: The for attribute of the label element must refer to a non-hidden form control.
From line 27, column 9; to line 27, column 38
↩ <label for="Confirm_Password"> Confirm
<label for="someValue"
- the someValue
is supposed to pertain to the ID of a form input. The date
input type might not be supported on all browsers - a "polyfill" is a piece of code that will properly support that type on a browser that doesn't natively support it. ((@sorinr is answering, too, I see... hello Sorin!))
i = i + size
is a good way.
heathercoraje sends brownie points to @bradtaniguchi :sparkles: :thumbsup: :sparkles:
:cookie: 413 | @bradtaniguchi |http://www.freecodecamp.org/bradtaniguchi
autorun
portion of the url, and reload the page... that way you code should not run on mount :)
mustimuu sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3779 | @khaduch |http://www.freecodecamp.org/khaduch
mustimuu sends brownie points to @ezioda004 :sparkles: :thumbsup: :sparkles:
:cookie: 499 | @ezioda004 |http://www.freecodecamp.org/ezioda004
.nav{
display: flex;
justify-content: flex-end;
align-items: flex-end;
}
unorthodoxthing sends brownie points to @marianissimus :sparkles: :thumbsup: :sparkles:
:cookie: 478 | @marianissimus |http://www.freecodecamp.org/marianissimus
unorthodoxthing sends brownie points to @marianissimus :sparkles: :thumbsup: :sparkles:
codernewby sends brownie points to @darrenfj :sparkles: :thumbsup: :sparkles:
:star2: 2416 | @darrenfj |http://www.freecodecamp.org/darrenfj
@ name
me if your need me, I just popped in to say hi and off to work ;)
codernewby sends brownie points to @darrenfj :sparkles: :thumbsup: :sparkles:
``` (shift+enter for line break)
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav mx-auto">
<li class="nav-item active">
<a class="nav-link" href="#"><i class="fab fa-apple appl" style="font-size: 23px;"></i><span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Mac</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">iPad</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">iPhone</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">Music</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Support</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link"></a>
</li>
</ul>
</div>
</nav>
```
justify-content: space-between
So I'm almost done with my project. I'm trying to finish the tic tac toe but I can't get the tie function to work at all to save my life. Any suggestions or comments on why this doesn't work?
function tie() {
if (random === 9) {
console.log("Its a tie");
$("#gameboard").hide();
$("#reload").show();
$("#reload").click(function() {
window.location.href = window.location.href;
});
<div class="navBar">
<li>
<a href="index.htm">Chades Bicycle Company</a>
</li>
<li>
<a href="kco_2_cal.htm">Company Calendar</a>
</li>
<li>
<a href="kco_2_contact.htm">Contact Us</a>
</li>
<li>
<a href="kco_3_abiform.htm">Customer Feedback</a>
</li>
<li id="dropBtn">
<a href="kco_3_buying.htm">Buying Tips</a>
<ul class="hide">
<li>
<a href="">One</a>
</li>
<li>
<a href="">Two</a>
</li>
<li>
<a href="">Three</a>
</li>
<li>
<a href="">Four</a>
</li>
</ul>
</li>
</div>
.navBar {
display: grid;
grid-template-columns: repeat(5, 1fr);
align-items: center;
background-color: #d3d3d3;
height: 34.5px;
margin-bottom: 20px;
font-family: 'Inconsolata', monospace, Helvetica;
}
.navBar li {
text-align: center;
list-style-type: none;
position: relative;
}
.navBar li a {
text-decoration: none;
font-size: 17.6px;
font-weight: bold;
font-family: 'Inconsolata', monospace, Helvetica;
color: #464646;
letter-spacing: 2.3px;
}
.hide {
display: none;
}
#dropBtn:hover .hide {
display: block;
background: chartreuse;
}
align-items: center
from.navBar
it stops doing that. Not sure, but maybe it tries to keep the elements aligned
<li class="nav-item">
<a class="nav-link mac" href="#">Mac</a>
</li>
.mac {
right: 500px !important;
}
white-space: nowrap
aguyinmontreal sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 9068 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
@Garabed96 If you go into the inspector - it appears that the class assigned to the Modal by react-bootstrap is modal-dialog
<div class="modal-dialog"><div class="modal-content" role="document"><div class="modal-header"><button type="button" class="close"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button><h4 class="modal-title">Ketogic Entry</h4></div><div class="modal-body"></div><div class="modal-footer"><button type="button" class="btn btn-default">Close</button><button type="button" class="btn btn-primary">Save changes</button></div></div></div>
This is copied from the chrome inspector
muhammedkarim sends brownie points to @ezioda004 :sparkles: :thumbsup: :sparkles:
:cookie: 500 | @ezioda004 |http://www.freecodecamp.org/ezioda004
muhammedkarim sends brownie points to @gulsvi :sparkles: :thumbsup: :sparkles:
:star2: 2652 | @gulsvi |http://www.freecodecamp.org/gulsvi
const items = JSON.parse(localStorage.getItem('storedKeys')) || []
function storageIndexUpdate(key, value, timeoutID) {
const item = {
key: {
value,
timeoutID
}
}
items.push(item)
localStorage.setItem('storedKeys', JSON.stringify(items))
}
storageIndexUpdate('cat', 'brown', 6)
const item = {};
item[key] = {
value,
timeoutID
};
That results in:
[{'cat':{'value':'brown','timeoutID':6}}]
instead of:
[{"key":{"value":"brown","timeoutID":6}}]
cyberputty sends brownie points to @gulsvi :sparkles: :thumbsup: :sparkles:
:star2: 2653 | @gulsvi |http://www.freecodecamp.org/gulsvi
kingwindie sends brownie points to @h1tag :sparkles: :thumbsup: :sparkles:
:cookie: 933 | @h1tag |http://www.freecodecamp.org/h1tag
leighhobson89 sends brownie points to @gulsvi :sparkles: :thumbsup: :sparkles:
:star2: 2654 | @gulsvi |http://www.freecodecamp.org/gulsvi
function callQuote() {
$.getJSON("https://cors-anywhere.herokuapp.com/http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback=", function(a) {
$("#quote-text").append(a[0].content);
$("#author").append("-- " + a[0].title);
});
}
This function works great when the page first loads through document.ready() - but when I call it with a button click like so:
$('#newQuote').on('click', callQuote());
});
either nothing works, or the API is not calling a fresh quote. As a side note, if I refresh or hard refresh the page, the quote loaded is the same one as last time always...?
leighhobson89 sends brownie points to @tiagocorreiaalmeida :sparkles: :thumbsup: :sparkles:
:cookie: 507 | @tiagocorreiaalmeida |http://www.freecodecamp.org/tiagocorreiaalmeida
0 === 1
is false
´´´
$("#newQuote").on("click", callQuote);
});
});
function callQuote() {
var rand = Math.floor(Math.random() * 40 + 1);
tidyUp();
$.getJSON(
"https://cors-anywhere.herokuapp.com/http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=40&callback=",
function(a) {
$("#quote-text").append(a[rand].content);
$("#author").append("-- " + a[rand].title);
}
);
}
function tidyUp() {
$("#quote-text").html("");
$("#author").html("");
}
´´´
I fixed it as above in the end, by making a small tidy up function and then pulling down more quotes at once and making a random number generator to pick one - that will probably do it! @tiagocorreiaalmeida
@leighhobson89 remove the proxy to cors-anywere.herokuapp.com and use this URL instead:
https://quotesondesign.com/wp-json/posts?filter[orderby]=rand
It just needs to be https
and you had http
$.ajaxSetup({ cache: false });