arrowstation sends brownie points to @willcodes :sparkles: :thumbsup: :sparkles:
:cookie: 273 | @willcodes |http://www.freecodecamp.com/willcodes
arrowstation sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 691 | @gregatgit |http://www.freecodecamp.com/gregatgit
target='_blank'
in the a href so a new tab opens when you click
window.open('http://twitter.com/share?url=' + loc + '&text=' + title + '&', 'twitterwindow', 'height=450, width=550, top='+($(window).height()/2 - 225) +', left='+$(window).width()/2 +', toolbar=0, location=0, menubar=0, directories=0, scrollbars=0');
Hey guys, I’m suffering from some issues when deploying a page to public domain. Can anyone help me?
I prepared a personal portfolio page as this:
http://codepen.io/yisuang1186/full/JKWqJB/
It looks nice on codepen as well as the local index.html file
However, when I push it to github, it seems I lost all the CSS and BootStrap related styling. It becomes this:
https://yisuang1186.github.io
Anyone knows what’s going on?
tommygebru sends brownie points to @badc0ded :sparkles: :thumbsup: :sparkles:
:cookie: 415 | @badc0ded |http://www.freecodecamp.com/badc0ded
$(function() {
var currentSelect = $("ul a.active");
$(window).scroll(function() {
var scroll = $(window).scrollTop();
if (scroll >= 100) {
currentSelect.removeClass('active');
$("ul a.about").addClass("active");
} else if (scroll>=400){
currentSelect.removeClass('active');
$("ul a.portfolio").addClass("active");
}
});
});
Anyone know why the following code isn't successfully chagning which link has the class "active" based on scroll positions?
$(function() {
var currentSelect = $("ul a.active");
$(window).scroll(function() {
var scroll = $(window).scrollTop();
if (scroll >= 100) {
currentSelect.removeClass('active');
$("ul a.about").addClass("active");
} else if (scroll>=400){
currentSelect.removeClass('active');
$("ul a.portfolio").addClass("active");
}
});
});
var testq1={
movie:"Harry Potter",
author:"J.K. Rowling",
quote:"Happiness can be found, even in the darkest of times, if one only remembers to turn on the light."
};
function showMe(){
document.getElementById("quote-here").innerHTML= Object.keys(testq1)[0];
}
yodermail sends brownie points to @vercaelus :sparkles: :thumbsup: :sparkles:
:cookie: 292 | @vercaelus |http://www.freecodecamp.com/vercaelus
jeanelleyy sends brownie points to @vercaelus :sparkles: :thumbsup: :sparkles:
:cookie: 293 | @vercaelus |http://www.freecodecamp.com/vercaelus
#6: User Story: I can keep chaining mathematical operations together until I hit the equal button, and the calculator will tell me the correct output.
? http://codepen.io/dhuddleston/pen/bZaPwO?editors=0010
eval
uses might confuse users.
movieArray = [testq1, testq2, testq3, etc.];
movieArray[Math.floor(Math.random() * movieArray.length)].movie;
dhuddleston sends brownie points to @vercaelus :sparkles: :thumbsup: :sparkles:
:cookie: 294 | @vercaelus |http://www.freecodecamp.com/vercaelus
movieArray[Math.floor(Math.random() * movieArray.length)]
?
this tells me that it cant read the movie property of undefined. ```var masterArr=[q1,q2,q3,q4,q5,q6,q7,q8,q9,q10,q11,q12];
function showMe(){
document.getElementById("quote-here").innerHTML= masterArr[Math.floor(Math.random()+masterArr.length)].movie;
}```
jeanelleyy sends brownie points to @vercaelus :sparkles: :thumbsup: :sparkles:
:warning: jeanelleyy already gave vercaelus points
http://api.openweathermap.org/data/2.5/weather?
, and then you have to add your API Key to the end of that.
var api = apiURL+"lat="+lat+"&lon="+lon+key;
navigator.geolocation
doesn't always work.
vercaelus sends brownie points to @dhuddleston :sparkles: :thumbsup: :sparkles:
:cookie: 353 | @dhuddleston |http://www.freecodecamp.com/dhuddleston
maddhattertime sends brownie points to @dhuddleston and @vercaelus :sparkles: :thumbsup: :sparkles:
:cookie: 295 | @vercaelus |http://www.freecodecamp.com/vercaelus
:cookie: 354 | @dhuddleston |http://www.freecodecamp.com/dhuddleston
@Lumexralph - I'm not sure if you are experiencing this problem, but geolocation on the newer versions of the Chrome browser requires https://
transport to work. (On Firefox and Safari, I think, it still works on http://
) If you are using the free OpenWeather API, it requires http://
so that is a problem if you are using Chrome (and you cannot predict what the user is using, so you need to make it work somehow.) People have been switching to the IP-based http://ip-api.com/json
to get the location based on the IP address. You could probably incorporate geolocation as a primary source for your location, and fall back to ip-api
if geolocation does not work? Or just use the ip-api
, even though it is probably less accurate.
If you are having another problem, then I'd have to see code...
@Vercaelus - well, mostly you have to know a little bit about the AJAX transaction mechanism. It is, essentially, making a request from a website (specified by a URL) and "waiting" for the response to come back, where the callback function that you create and pass to your ajax call handles the return data.
If you look at the example on the bottom of http://ip-api.com/docs/api:json that page is shows an example with jQuery's $.getJSON
function that shows the basic setup. I was having trouble getting their JSBIN post to run, so I just quickly threw together a codepen project to use the ip-api site: http://codepen.io/khaduch/pen/qNpzGx. If you look at the network traffic in the browser devtools, you can see what all goes on. I hope that helps.
I have to sign off for now, but if you ask questions I'll check in tomorrow morning.
vercaelus sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1446 | @khaduch |http://www.freecodecamp.com/khaduch
position:;
top: 0;
left: 0;
<div class="welcome">
</div>
sorry djidrovo1, you can't send brownie points to yourself! :sparkles: :sparkles:
djidrovo1 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 475 | @sorinr |http://www.freecodecamp.com/sorinr
djidrovo1 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: djidrovo1 already gave sorinr points
@shivam13 https://productforums.google.com/forum/#!topic/drive/yU_yF9SI_z0/discussion
I think this well help
shivam13 sends brownie points to @jdvariadic :sparkles: :thumbsup: :sparkles:
:cookie: 275 | @jdvariadic |http://www.freecodecamp.com/jdvariadic
http://codepen.io/JDVariadic/pen/RRxEdP?editors=1010
I'm starting the random quote project and the code found here won't show the quote in the output section of codepen. Could anyone point out the problem? I know for a fact that the API is giving me data since I tested that earlier.
jdvariadic sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 477 | @sorinr |http://www.freecodecamp.com/sorinr
@sorinr
http://codepen.io/JDVariadic/pen/RRxEdP?editors=1010
The message is not changing
:warning: jdvariadic already gave sorinr points
:cookie: 313 | @freyarhianna |http://www.freecodecamp.com/freyarhianna
jdvariadic sends brownie points to @freyarhianna and @sorinr :sparkles: :thumbsup: :sparkles:
d1sr3 sends brownie points to @freyarhianna :sparkles: :thumbsup: :sparkles:
:cookie: 314 | @freyarhianna |http://www.freecodecamp.com/freyarhianna
01 + 20 + .001 * 0
1 + 20 + .001 * 0
benalron sends brownie points to @freyarhianna :sparkles: :thumbsup: :sparkles:
:cookie: 315 | @freyarhianna |http://www.freecodecamp.com/freyarhianna
var streamer = new Streamer(data1);
?
benalron sends brownie points to @freyarhianna :sparkles: :thumbsup: :sparkles:
:warning: benalron already gave freyarhianna points
//Streamer constructor
function Streamer(resultStream,resultChannel){
this.name = resultChannel.display_name;
this.image = resultChannel.game + ": " + resultChannel.logo;
this.description = resultChannel.status;
this.online = (resultStream.stream != null);
console.log("constructed");
}
wo1v3r sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 480 | @sorinr |http://www.freecodecamp.com/sorinr
//Streamer constructor
function Streamer(resultStream,resultChannel){
this.name = resultChannel.display_name;
this.image = resultChannel.game + ": " + resultChannel.logo;
this.description = resultChannel.status;
this.online = (resultStream.stream != null);
console.log("constructed");
}
Object {
description: "[FR] DH Valencia - Rediffusion - Day3.",
image: "StarCraft II: https://static-cdn.jtvnw.net/jtv_user_pictures/ogamingsc2-profile_image-9021dccf9399929e-300x300.jpeg",
name: "OgamingSC2",
online: true
}
Console
Assets
Comments
Delete
var requestDone = false;
var results = [];
var getResults = function() {
var streamer;
var streamers = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];
streamers.forEach(function(name) {
$.getJSON('https://api.twitch.tv/kraken/channels/'+name+'/?callback=?', function(data1) {
$.getJSON('https://api.twitch.tv/kraken/streams/'+name+'/?callback=?', function(data2) {
streamer = new Streamer(data2, data1);
if(results.push(streamer) == streamers.length){
console.log(results);
requestDone= true;
}
});
});
});
}
loadweather(position.coords.latitude + ',' + position.coords.lognitude);
you are passing one argument but here: function loadweather(location, woeid) {} its expecting two parameters. and what is this:
$.simpleWeather({})` ?
Hey, I'm working on random quote generator. I have a few questions.
Here's my pen (still working on it, so not final version) :
http://codepen.io/a-y-u-s-h/full/pbWRdZ/
I don't want the text on the button to change its color when I hover my mouse over it, or when I click on it, what should I do?
555
and (555)
but NOT (555
and 555)
?
faisal1337 sends brownie points to @benalron :sparkles: :thumbsup: :sparkles:
:cookie: 376 | @benalron |http://www.freecodecamp.com/benalron
```function factorialize(num) {
var array=[];
for (var i=0; i<=num; i++){
array.push(i);
}
var array1=array.reduce(function (previousValue, currentValue){
return previousValue * currentValue;
});
}
factorialize(5);
jumbotron
to be transparent?
```js ⇦ Type 3 backticks and then press [shift + enter ⏎]
(type js or html or css)
<paste your code here>,
then press [shift + enter ⏎]
``` ⇦ Type 3 backticks, then press [enter ⏎]
This an inline `<paste code here>
` code formatting with a single backtick() at _start_ and _end_ around the
code`.
See also: ☛ How to type Backticks | ☯ Compose Mode | ❄ Gitter Formatting Basics
Esc
) on new line.
@willcodes add !important
after your background property.
.jumbotron{
background:rgba(0,0,0,0.4) !important;
}
To override default Bootstrap Styling
function factorialize(num) {
var array=[];
for (var i=1; i<=num; i++){
array.push(i);
}
var array1=array.reduce(function (previousValue, currentValue){
return previousValue * currentValue;
});
return array1;
}
factorialize(5);
console.log(document.getElementById("srch").value);
<div id="srch" value="ikon"></div>
willcodes sends brownie points to @freyarhianna and @benalron :sparkles: :thumbsup: :sparkles:
:cookie: 316 | @freyarhianna |http://www.freecodecamp.com/freyarhianna
:cookie: 377 | @benalron |http://www.freecodecamp.com/benalron
testing backtick
.hid{
animation: fadeOut 1s;
display: none;
}
willcodes sends brownie points to @mattboland :sparkles: :thumbsup: :sparkles:
:cookie: 399 | @mattboland |http://www.freecodecamp.com/mattboland
Hello, this is my pen about the game of life React
http://codepen.io/Spartano/pen/KryEgK?editors=0010
i have an problem
inside nextGrid = () => i am not been able to understand why it doesnt work to go to next state
when i console log it gives me an aray of 5 false
olbap14 sends brownie points to @wo1v3r :sparkles: :thumbsup: :sparkles:
:cookie: 286 | @wo1v3r |http://www.freecodecamp.com/wo1v3r
<div class = "row">
<div class="col-md-5 well message" id="box">
<blockquote class="">
<p>C makes it easy to shoot yourself in the foot; C++ makes it harder, but when you do, it blows away your whole leg.</p>
<footer><cite title="Author">Bjarne Stroustrup</cite></footer>
</blockquote>
<button id = "getMessage" class = "btn btn-primary center-block">New quote</button>
</div>
</div>
olbap14 sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1240 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
<div class="row"><p>lorem ipsum</p><div class="col-md-5 well message"></div></div.
and try give margin to the row and then to the md-5 div
faisal1337 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 484 | @sorinr |http://www.freecodecamp.com/sorinr
erikvlm sends brownie points to @cysonya :sparkles: :thumbsup: :sparkles:
:cookie: 322 | @cysonya |http://www.freecodecamp.com/cysonya
margin-bottom: -70px
something like that to the image
User Story: I can see the weather in my current location.
style="margin-bottom: -70px;"
$.getJSON("http://ip-api.com/json", function(json) {
/* CHANGE LAT AND LONG */
var lat = json.lat;
var long = json.lon;
$("#long").html(Math.floor(long));
$("#lat").html(Math.floor(lat));
wo1v3r sends brownie points to @cysonya and @crumrinecoder :sparkles: :thumbsup: :sparkles:
:cookie: 323 | @cysonya |http://www.freecodecamp.com/cysonya
:cookie: 277 | @crumrinecoder |http://www.freecodecamp.com/crumrinecoder
https://codepen.io/shivam13/pen/yJvLjN?editors=1010
see this @sorinr
function getInfo(){
$.getJSON("http://ip-api.com/json", function(json) {
/* CHANGE LAT AND LONG */
var lat = json.lat;
var long = json.lon;
$("#long").html(Math.floor(long));
$("#lat").html(Math.floor(lat));
});
}
$(document).ready(function() {
getInfo();
});
var loc;
$.getJSON('https://geoip-db.com/json/geoip.php?jsonp=?')
.done (function(location)
{
loc=location.city;
});
$(document).ready(function() {
$.simpleWeather({
location: loc,
woeid: '',
unit: 'f',
success: function(weather) {
var city = weather.city;
var temp = weather.temp + "°"+weather.units.temp;
var wcode = '<img class="weathericon" src="https://googledrive.com/host/0Byi7CVy901YhLXVrTWx6QkZDZzA/'+weather.code+'.svg>';
var wind = '<p>' + weather.wind.speed + '</p><p>' + weather.units.speed + '</p>';
var humidity = weather.humidity + " %";
$(".body").text(city);
$(".temperature").html(temp);
$(".climate_bg").html(wcode);
$(".windspeed").html(wind);
$(".humidity").text(humidity);
},
error: function(error) {
$(".error").html('<p>' + error + '</p>');
}
});
});
why this not gives me proper result after i can get the proper location??
richardhowell879 sends brownie points to @cysonya :sparkles: :thumbsup: :sparkles:
:cookie: 324 | @cysonya |http://www.freecodecamp.com/cysonya
$.getJSON('https://geoip-db.com/json/geoip.php?jsonp=?')
.done (function(location)
{
loc=location.city;
});
within a function like: function getmylocation(){$.getJSON('https://geoip-db.com/json/geoip.php?jsonp=?')
.done (function(location)
{
loc=location.city;
});}
and call it from doc ready like: getmylocation();
var GEOCODING = 'https://crossorigin.me/http://maps.googleapis.com/maps/api/geocode/json?latlng=' + lat + '%2C' + lon + '&language=en';
shivam13 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 485 | @sorinr |http://www.freecodecamp.com/sorinr
lalov1 sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1241 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
$.ajax({ url: 'https://en.wikipedia.org/w/api.php?action=query&format=json&origin=*&prop=extracts&list=search&indexpageids=1&pageids=&redirects=1&callback=&utf8=1&exsentences=1&exlimit=10&exintro=1&exsectionformat=plain&srsearch=' + this.value, success: function(response) { console.log(response); } });
khaduch sends brownie points to @konikodes :sparkles: :thumbsup: :sparkles:
:cookie: 325 | @konikodes |http://www.freecodecamp.com/konikodes
http://ip-api.com/json
site to get location data based on the IP address. It has no commentary, but it shows a $.getJSON
call and how to read the latitude and longitude data. See this link. I won't say that it's self-explanatory, but almost? You can take a look and see - there isn't much there to try and figure out. It is just the latitude and longitude part of the task.
tommygebru sends brownie points to @omgitsnes :sparkles: :thumbsup: :sparkles:
:cookie: 258 | @omgitsnes |http://www.freecodecamp.com/omgitsnes
@sorinr - well, there is certainly an accuracy issue with the IP-based location. But (and I haven't looked at your post yet) I don't know if the goal of this exercise is to be absolutely spot-on with the location. Certainly the parameters of the exercise have changed to some extent, and I would say that the goal of this is to get something that uses a service to get location (you could base it on zipcode or postal code in the US, at least, or inquire for a town - have the user put in a more accurate location point and use that to access a weather site.) And the use the location to get the weather from a weather API site.
So I just used your site, and for my location that I'm currently in, it is off the mark by approximately 40 miles. But I would say that given the available options, it's fine. (Of course, I don't speak for freecodecamp - just my opinion.) The objective should be to learn the way to develop these sites. If you get to a point where it is your job to develop a real site, I would hope that your employer or person contracting our services to fund the proper resources to access an accurate site, using the most secure technology available. Just my opinion!
.row { margin-top: 10px; margin-bottom: 10px; }
or values of your choice, and it should be applied to any div with the .row
class. (Look up methods to customize Bootstrap classes, it should tell you what you need to do if my initial, simple example doesn't work.)
https://twitter.com/intent/tweet?text=
it should show the randomQuote in the input box
tzunun sends brownie points to @cysonya :sparkles: :thumbsup: :sparkles:
:cookie: 326 | @cysonya |http://www.freecodecamp.com/cysonya
var img = "<img src='http://openweathermap.org/img/w/'"+json.weather[0].icon+"'.png' class='img-responsive' alt='Icon of weather'>";
$(img).insertBefore(".temperature");
tzunun sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1226 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
radascript sends brownie points to @dueldrawer8 :sparkles: :thumbsup: :sparkles:
:cookie: 413 | @dueldrawer8 |http://www.freecodecamp.com/dueldrawer8
radascript sends brownie points to @rainz00 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for rainz00
dhuddleston sends brownie points to @hkuz :sparkles: :thumbsup: :sparkles:
:cookie: 423 | @hkuz |http://www.freecodecamp.com/hkuz
Why is my hover not working?
.socButton {
color: #000000;
};
.socButton:hover {
color: #f5f5f5;
};
Here is my pen: https://codepen.io/coder7215/pen/ezdoXr?editors=1100
<a>
inside of the button, which could cause unwanted behavior.