@JohnnyZampano : for the "squishing thing," I recommend you either look up a few articles on responsive web design, OR look up how to use twitter bootstrap and it's grid system.
as for the space above your image and image and text, you can debug this issue by trying out chrome developer tools. on google chrome, right click the element and click the inspect option. You should be able to see the classes of the object to the right, which reveal the applied styles and where the styles were applied from(your own styles, or some vendor css). Also, at the bottom of the applied styles, you can see the margin and padding of an element.
johnnyzampano sends brownie points to @jinrawx :sparkles: :thumbsup: :sparkles:
:cookie: 316 | @jinrawx |http://www.freecodecamp.com/jinrawx
offlineUser
, onlineUser
and getStreamer
are just out of scope for your click handlers, since they are defined inside the click handler for the twitch icon...
@jwoo92
$('.online').hide();
$('.online').show();
first will target anything with the online class and hide - the second does the opposite
jwoo92 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1219 | @khaduch |http://www.freecodecamp.com/khaduch
$("#offline").on("click", function() {
$("#streamers").html('');
$(".online").hide();
});
$("#streamers").html('');
jwoo92 sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 536 | @gregatgit |http://www.freecodecamp.com/gregatgit
jwoo92 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:warning: jwoo92 already gave khaduch points
jwoo92 sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:warning: jwoo92 already gave gregatgit points
<body>
tag in the HTML panel, CodePen takes care of that with the template that it uses. (Of course, you can still style it with your body
CSS rule, since that tag will be in the generated page.) Also, your responsive behavior, well, isn't... I didn't try it on a real mobile device, but on a narrowing browser window, things fall apart in the display. On a phone, it doesn't look good in the "portrait" mode, but okay in the "landscape" mode. Just thought I would pass it along - not sure if you are concerned about that at this point, but I think that on the full-screen view, it looks top-notch!
@jwoo92 - yeah, I just keep thinking that depending on who sees your portfolio and tries to view it on a mobile device, potentially, you'd want it to look good there, too.
I haven't even started mine - I spend too much time in the help rooms and doing a few other learning activities... I hope it turns out as nicely as yours!
http://codepen.io/redixhumayun/pen/rLNzpm?editors=0112
Hey, I'm having some trouble getting the weather API to run. I don't seem to be getting a response on the console when I console.log(json) in the above code. I've tried passing my lat and long as both variables and numbers directly. I've signed up for the API key and included it in the API call, and still no luck. Can anybody help me out here?
redixhumayun sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1650 | @mutantspore |http://www.freecodecamp.com/mutantspore
redixhumayun sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:warning: redixhumayun already gave mutantspore points
<div id="buttons">
<div class="btn-group btn-group-lg">
<div class="row">
<button id="all" class="btn btn-info">ALL</button></li>
<button id="online" class="btn btn-success">ONLINE</button></li>
<button id="offline" class="btn btn-danger">OFFLINE</button></li>
</div>
</div>
</div>
<table id="tictac">
<tr id="row1">
<td id="col11" class="col1">
</td>
<td class="col1 col2">
</td>
<td id="col12" class="col1">
</td>
<td class="col1 col4">
</td>
<td id="col13" class="col1">
</td>
</tr>
<tr id="row2">
<td class="row2 col2">
</td>
<td class="row2 col2">
</td>
<td class="row2">
</td>
<td class="row2 col4">
</td>
<td class="row2">
</td>
</tr>
<tr id="row3">
<td id="col21" class="col3">
</td>
<td class="col3 col2">
</td>
<td id="col22" class="col3">
</td>
<td class="col3 col4">
</td>
<td id="col23" class="col3">
</td>
</tr>
<tr id="row3">
<td class="row4">
</td>
<td class="row4 col2">
</td>
<td class="row4">
</td>
<td class="row4 col4">
</td>
<td class="row4">
</td>
</tr>
<tr id="row5">
<td id="col31" class="col5">
</td>
<td class="col5 col2">
</td>
<td id="col32" class="col5">
</td>
<td class="col5 col4">
</td>
<td id="col33" class="col5">
</td>
</tr>
</table>
smrtsmrf sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 537 | @gregatgit |http://www.freecodecamp.com/gregatgit
$(document).ready(function() {
var channels = ["OgamingSC2","sheevergaming", "ESL_SC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];
for (var i = 0; i < channels.length; i++) {
$.getJSON('https://api.twitch.tv/kraken/streams/' + channels[i] + '?callback=?', function(data) {
if (data.stream) {
$('.wrapper li').eq(i).css('background-color', "blue");
} else {
$('.wrapper li').eq(i).css('background-color', "red");
}
});
};
})
var collection = {
2548: {
album: "Slippery When Wet",
artist: "Bon Jovi",
tracks: [
"Let It Rock",
"You Give Love a Bad Name"
]
},
2468: {
album: "1999",
artist: "Prince",
tracks: [
"1999",
"Little Red Corvette"
]
},
1245: {
artist: "Robert Palmer",
tracks: [ ]
},
5439: {
album: "ABBA Gold"
}
function updateRecords(id, prop, value) {
if(value!=="")
{
if(collection[id][prop]!="tracks")
{
collection[id][prop]=value;
}
else{
collection[id].tracks.push(value);
}
}
else {delete collection[id][prop];}
return collection;
}
value !==""
is correct, you should have a similar test of the prop
variable, where you are checking to see if they are working with tracks
. Looks like you are going immediately into the object to check it.
yveselovskyi sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1220 | @khaduch |http://www.freecodecamp.com/khaduch
shivamsonu29 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1221 | @khaduch |http://www.freecodecamp.com/khaduch
yveselovskyi sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:warning: yveselovskyi already gave khaduch points
@nqdai1992 - I just opened this CodePen link, and tried it, and it only seems to be getting one quote - it might be caching the request somewhere? Just on a hunch, I switched to the JSONP format, then next thing they show on the page, made a change to the code to look like this:
$.getJSON("http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&_jsonp=?",function(data){
and it seems to be getting different quotes. Want to see if that works for you?
nqdai1992 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1222 | @khaduch |http://www.freecodecamp.com/khaduch
shamieya sends brownie points to @iadetunji :sparkles: :thumbsup: :sparkles:
:cookie: 133 | @iadetunji |http://www.freecodecamp.com/iadetunji
This task requires us to look at each possible permutation of a string. This can be done using a recursion function, but it is not the only way. A common interview question is building a function which collects all permutations of a string. So there is no shortage of tutorials out there on how to do this, in many different code languages.
:pencil: read more about algorithm no repeats please on the FCC Wiki
var $myCity = $('#myCity');
should put the city in a variable?
sarthakadhikari sends brownie points to @jwoo92 :sparkles: :thumbsup: :sparkles:
:cookie: 335 | @jwoo92 |http://www.freecodecamp.com/jwoo92
sarthakadhikari sends brownie points to @jwoo92 :sparkles: :thumbsup: :sparkles:
:warning: sarthakadhikari already gave jwoo92 points
bravo1c sends brownie points to @sarthakadhikari :sparkles: :thumbsup: :sparkles:
:cookie: 345 | @sarthakadhikari |http://www.freecodecamp.com/sarthakadhikari
bravo1c sends brownie points to @sarthakadhikari :sparkles: :thumbsup: :sparkles:
:warning: bravo1c already gave sarthakadhikari points
$('#results').append(results);
agirlwhocodes sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1062 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
<button id="button" class="btnclick"></button>
Hi all.
Two part question here (re: Tribute project)... trying to select even # child elements of a div (by id) with jQuery -->
$("#my-div:even").css("font-family", "symbol");
<div id="my-div">
<p>Some text I want to apply a font to</p>
<p>Don't apply font to this text though</p>
<br>
<p>Some text I want to apply a font to</p>
<p>Don't apply font to this text though</p>
</div>
My test font 'symbol' is getting applied to all of the p elements of "my-div", not just even ones. What am I doing wrong?
Theory so far is that my current jQuery code is targeting every even #my-div - which makes sense, so how would i target even elements OF #my-div?
Part 2:
The other problem (I think) is that the <br> makes it so that applying to even elements doesnt really work out right.
What I really need to do is something I IMAGINE might look like this below (which actually seems to break jQuery completely in my html page!):$("#my-div").p:nth-of-type(even).css("font-family", "symbol");
i.e. select even child elements of type <p> for id="my-div" and apply css to them.
I have looked at nth-of-type information online, but I don't think I see how to construct the instruction I want properly (plus, since I can't even get the simple 'even' selector to work yet...)
chenry001 sends brownie points to @jspadgett82 :sparkles: :thumbsup: :sparkles:
:cookie: 299 | @jspadgett82 |http://www.freecodecamp.com/jspadgett82
Alright folks. Here’s where I’m at on my quote generator:
http://codepen.io/Jspadgett82/pen/ONvxjG
I’m almost done, at least with the base code so far. I understand what I’ve got so far, (luckily, go me) but I am having trouble getting this tweet button to put the generated quote into a twitter widget. The way I have this written, it’s writing not a number, and if I put it with just randomIndex it writes the number of the array index instead of the words I want it to.
$('#tweetbutton').attr('href', 'https://twitter.com/intent/tweet?text='+ (randomIndex[quotation.quote] + randomIndex[quotation.author])).attr('target', '_blank’);
Can anyone give me some advice or direction on how to change that to make it put the quote and author in the tweet box?
quotation.quote
& quotation.author
. just plug them in , no need to try to do it again$('#tweetbutton').attr('href', 'https://twitter.com/intent/tweet?text='+ quotation.quote + quotation.author).attr('target', '_blank’);
$("#my-div p:nth-child(even)".css("font-family", "symbol");
$('#tasklist ul li div:nth-child(2)')
randomQuote();
inside your doc ready function it will pull in a quote on page load
jspadgett82 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1651 | @mutantspore |http://www.freecodecamp.com/mutantspore
jspadgett82 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:warning: jspadgett82 already gave mutantspore points
.navbar {
margin-bottom: 0px !important;
}
respectthegrind sends brownie points to @mutantspore and @jspadgett82 :sparkles: :thumbsup: :sparkles:
:cookie: 300 | @jspadgett82 |http://www.freecodecamp.com/jspadgett82
:star2: 1652 | @mutantspore |http://www.freecodecamp.com/mutantspore
matthew3454 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1653 | @mutantspore |http://www.freecodecamp.com/mutantspore
if(arr[0][0]===arr[1][1]===arr[2][2]===x||
arr[0][2]===arr[1][1]===arr[2][0]===x) {
alert("X WINS!");
}
Hi, Please test for 10 seconds my little app: https://codepen.io/elminsterrr/full/VjwXLa
I need to know if it is printing your location to HTML [MAP doesn't work]
Your location latitude: x
Your location longitude: y
Your location name: abc
elminsterrr sends brownie points to @aryandua :sparkles: :thumbsup: :sparkles:
:cookie: 329 | @aryandua |http://www.freecodecamp.com/aryandua
html scroll smoothly to anchor
if (arr[i][0] === arr[i][1] === arr[i][2]) {
respectthegrind sends brownie points to @bennett-elder :sparkles: :thumbsup: :sparkles:
:cookie: 242 | @bennett-elder |http://www.freecodecamp.com/bennett-elder
elminsterrr sends brownie points to @bennett-elder :sparkles: :thumbsup: :sparkles:
:cookie: 243 | @bennett-elder |http://www.freecodecamp.com/bennett-elder
http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139
matthew3454 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:warning: matthew3454 already gave mutantspore points
@aryandua look at this very simple example
var x = (5 === 5 === 5);
console.log(x);
that prints out false
to the console as I suspect that it first evaluates 5 === 5 to being true
and then evaluates true
=== 5
giving false
wardy484 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1654 | @mutantspore |http://www.freecodecamp.com/mutantspore
aryandua sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1655 | @mutantspore |http://www.freecodecamp.com/mutantspore
matthew3454 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1656 | @mutantspore |http://www.freecodecamp.com/mutantspore
@respectTheGrind try putting this in your JS
// smooth scrolling of viewport to target
$('a[href^="#"]').click(function(event) {
event.preventDefault();
$('html,body').animate({
scrollTop: $(this.hash).offset().top - 50
}, 900);
});
to get a nice smooth scroll
http://codepen.io/redixhumayun/pen/rLNzpm?editors=1111
I have no idea why the C won't disappear and be replaced by the F when I click on it. I think I have my code set up right. Any help?
matthew3454 sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:cookie: 910 | @dhcodes |http://www.freecodecamp.com/dhcodes
aryandua sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:warning: aryandua already gave mutantspore points
wardy484 sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:warning: wardy484 already gave mutantspore points
Let's use the jQuery selector $(".slot")
to select all of the slots.
Once they are all selected, we can use bracket notation to access each individual slot:
$($(".slot")[0]).html(slotOne);
$($(".slot")[1]).html(slotTwo);
$($(".slot")[2]).html(slotThree);
:pencil: read more about challenge bring your javascript slot machine to life on the FCC Wiki
NonprofitProjects
?? Someone has a question that might be up your alley
tjscollins sends brownie points to @mutantspore :sparkles: :thumbsup: :sparkles:
:star2: 1658 | @mutantspore |http://www.freecodecamp.com/mutantspore
http://codepen.io/redixhumayun/pen/rLNzpm?editors=1111
Hey, can anybody help me out with why my C button won't be hidden after I click on it? I have the following code for that
$(".letter").on("click", function(){
var final_temp = changeTemp();
$(".number").html(final_temp);
if((".letter").css('display') !='none' &&(".letter").css('display') === 'inline-block'){
$(".letter").hide();
$(".letter2").show();