adamfaraj sends brownie points to @jtan3 :sparkles: :thumbsup: :sparkles:
:cookie: 462 | @jtan3 |http://www.freecodecamp.com/jtan3
x140hu4 sends brownie points to @masd925 :sparkles: :thumbsup: :sparkles:
:star2: 4542 | @masd925 |http://www.freecodecamp.com/masd925
float: left;
on your .sidebar
you can see your nav’s drop shadow
.modal-box {
width: 70%;
margin: 100px 15%;
}
also you might wanna remove the max-width restriction
modal-box
to container modal-box
.modal-box
.modal-body
because thats where the text is
alteducation sends brownie points to @ashwins93 :sparkles: :thumbsup: :sparkles:
:cookie: 379 | @ashwins93 |http://www.freecodecamp.com/ashwins93
$('.cards').fadeOut()
and then ('#specifccontent').fadeIn()
<div class="col-12 col-sm-9 col-md-6 col-lg-4"
What that code means is that the column will be displayed with a width of
12 columns in very small devices
9 columns on small devices
6 columns on medium devices
4 columns on large devices
col-sm-12
to the div that contains 3 images together
neeldvirus sends brownie points to @adamfaraj :sparkles: :thumbsup: :sparkles:
:cookie: 290 | @adamfaraj |http://www.freecodecamp.com/adamfaraj
toDisplay
function is not on the global scope and those onclick calls cannot call it.
rscales02 sends brownie points to @masd925 :sparkles: :thumbsup: :sparkles:
:star2: 4543 | @masd925 |http://www.freecodecamp.com/masd925
onclick
in my html?
document.getElementByClass('keys').addEventListener('click', toDisplay(9))
?
id
for each separate button and a different event handler?
getElementsByClassName
and it returns an array-like object that has those elements as elements. You can loop it and assign event handlers to those elements. Even better is to add the click handler to the mother element if possible and inside the callback check what child element (button) was clicked.
rscales02 sends brownie points to @masd925 :sparkles: :thumbsup: :sparkles:
so add an event listener like
document.getElementByClass('keys').addEventListener('click', toDisplay(9))
?
the second argument to a listener should be a callback
okay so i started my "simon game" project and i wanna ask if i should have the #innerCirlce
's div inside the #outerCircle
's div. And what difference will it make?
hi there! could someone help me? I'm trying to make my navbar menu items at the top align to the right but it won't let me when i justify-content-end (bootstrap). here is the link to my site
and here is the code for my navbar
<nav class="navbar navbar-expand-lg fixed-top">
<!-- logo -->
<a class="navbar-brand" href="#"><img src="logo.png" width="30" height="30" class="icon-img d-inline-block align-top" alt="logo"></a>
<!-- hamburger button -->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo02" aria-controls="navbarTogglerDemo02" aria-expanded="false" aria-label="Toggle navigation">
<i class="fa fa-bars" aria-hidden="true"></i>
</button>
<div class="collapse navbar-collapse navbar-right" id="navbarTogglerDemo02">
<ul class="navbar-nav mr-auto mt-2 mt-lg-0 justify-content-end">
<li class="nav-item">
<a class="nav-link" href="#home">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#projects">Projects</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#contact">Contact</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://juliscodingadventure.wordpress.com/" target="_blank">Blog</a>
</li>
</ul>
</div>
</nav>
<!-- navbar end -->
function updateInventory(arr1, arr2) {
// All inventory must be accounted for or you're fired!
var v = arr1;
for(var i = 0; i < arr2.length; i++){
if(arr2[i][1] == arr1[i][1]){
v.push([arr1[i][0] + arr2[i][0], arr1[i][1]]);
} else {
v.push(arr2[i]);
}
}
return v;
}
// Example inventory lists
var curInv = [
[21, "Bowling Ball"],
[2, "Dirty Sock"],
[1, "Hair Pin"],
[5, "Microphone"]
];
var newInv = [
[2, "Hair Pin"],
[3, "Half-Eaten Apple"],
[67, "Bowling Ball"],
[7, "Toothpaste"]
];
updateInventory(curInv, newInv);
.navbar-nav{
width: 100%;
}
julicheng sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1342 | @sorinr |http://www.freecodecamp.com/sorinr
.thumbnail {
...
transition: all 600ms cubic-bezier(0.39, 0.575, 0.565, 1);
}
.thumbnail:hover {
...
transform: scale(1.6);
z-index: 5;
}
how can i align those squares to be in an order:
1 2
3 4 ??
@sorinr well my final destination is to make them look like those colors in the "simon game" project. thats what im working on now.
When I return an object using AJAX call, it returned undefined. Why is that?
function loadSunTime() {
var URL = "https://api.wunderground.com/api/800715b6ce08dbb1/astronomy/q/IL/Rockford.json"
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if(this.readyState == 4 && this.status == 200) {
return JSON.parse(this.responseText);
}
}
xhttp.open("GET", URL, true);
xhttp.send();
}
//ignore the parameter for getWeatherData()
function getWeatherData(jsonObject) {
var sunJsonObject = loadSunTime();
console.log("Sun object: " + sunJsonObject);
}
Here is the link to codepen: https://codepen.io/quickspeedy/pen/XeomjK
loadSunTime
is already handled and left when your data arrives. Also your console.log
in getWeatherData
already happened at the point when you get your data
quickspeedy sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
:star2: 1369 | @alpox |http://www.freecodecamp.com/alpox
quickspeedy sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
function getDataDelayed(cb) {
// Simulate delayed action. Takes 2 seconds
setTimeout(function() {
cb("hey, this is data!");
}, 2000);
}
function print(received) {
console.log(received);
}
getDataDelayed(print); // Logs "hey, this is data!" after 2 seconds
getDataDelayed(print)
work? Seems to me that print
is a function and you didn't use getDataDelayed(print())
with a parenthesis?
print
(yea you can see the function name as a variable in which the function is stored) is passed to getDataDelayed
as an argument.
getDataDelayed
, the function is available under the name cb
(The first argument where i passed the function)
actual function call
with the ()
paranthesis
cb("hey, this is data!")
quickspeedy sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
filter
, reduce
or map
already, you've already seen callbacks. Because you kind of give them callbacks as argument :-)
@AlexxMart
Hello guys, I've been struggling with the challenge "Inventory Update". I've run a loop to add the items to the new inventory but when it finds an existing item is not just adding the amounts as it should, but it adds the whole item as if it doesn't exist
my code:
function updateInventory(arr1, arr2) {
// All inventory must be accounted for or you're fired!
var v = arr1;
for(var i = 0; i < arr2.length; i++){
if(arr2[i][1] == arr1[i][1]){
v.push([arr1[i][0] + arr2[i][0], arr1[i][1]]);
} else {
v.push(arr2[i]);
}
}
return v;
}
// Example inventory lists
var curInv = [
[21, "Bowling Ball"],
[2, "Dirty Sock"],
[1, "Hair Pin"],
[5, "Microphone"]
];
var newInv = [
[2, "Hair Pin"],
[3, "Half-Eaten Apple"],
[67, "Bowling Ball"],
[7, "Toothpaste"]
];
updateInventory(curInv, newInv);
I tried adding just the name of the items to a new array, but then I don't know how to add the stock of each item once the names have been sorted. Because when the amount is added, ".sort()" doesn't work anymore
array[i][0]
to compare if the name of the new inventory matches the one already in the array