mjcreate sends brownie points to @aszwet1 :sparkles: :thumbsup: :sparkles:
:cookie: 125 | @aszwet1 |http://www.freecodecamp.com/aszwet1
stephepush sends brownie points to @gregatgit :sparkles: :thumbsup: :sparkles:
:cookie: 759 | @gregatgit |http://www.freecodecamp.com/gregatgit
myVar = myVar + 5;
can be replaced with myVar += 5
carina-hu sends brownie points to @maeswilliam :sparkles: :thumbsup: :sparkles:
:cookie: 122 | @maeswilliam |http://www.freecodecamp.com/maeswilliam
c0d0er sends brownie points to @krisvos130 :sparkles: :thumbsup: :sparkles:
:cookie: 490 | @krisvos130 |http://www.freecodecamp.com/krisvos130
c0d0er sends brownie points to @labiej :sparkles: :thumbsup: :sparkles:
:cookie: 441 | @labiej |http://www.freecodecamp.com/labiej
setInterval(func, 1000)
Allows a function to be called once a second and can be your timer.mikail1998 sends brownie points to @zachvalenta :sparkles: :thumbsup: :sparkles:
:cookie: 342 | @zachvalenta |http://www.freecodecamp.com/zachvalenta
var intervalID = setInterval(func, 1000);
....
clearInterval(intervalID);
mikail1998 sends brownie points to @wearenotgroot :sparkles: :thumbsup: :sparkles:
:star2: 1585 | @wearenotgroot |http://www.freecodecamp.com/wearenotgroot
$("#clock").on('click', function(){
var str = $("#pomodoro1").html();
var result = parseInt(str);
setInterval(function(){
//use .text, .html is a bit slow and lag since its rebuilding the html inside that <p>
$("#pomodoro1").text(result--); //<--------result-- so the new value is stored in result
}, 1000);
});
$("#clock").on('click', function(){
var str = $("#pomodoro1").html();
var result = parseInt(str);
function interval (){
$("#pomodoro1").text(result--);
}
var timeOut = setInterval(
interval//<--------result-- so the new value is stored in result
, 1000);
body{
background-color:#D8F9F9
}
.thin-grey-border{
border-radius: 20%;
border-style: groove;
border-width: 10px;
border-color: grey;
}
<div class="result">
isn't centering. https://codepen.io/roastchicken/pen/KrOEZv
display: inline-block
;
after you declaration of background-color:#D8F9F9
- not sure if that would cause a problem?
src
attribute should also be enclosed in quotes (I was just scrolling up and looking at earlier posts.)
@tmag298 - last try... :) the CSS for the img-rounded
class is this:
.img-rounded {
border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px;
border-top-left-radius: 6px;
border-top-right-radius: 6px;
}
and your .thin-grey-border
class definition is this:
.thin-grey-border{
border-radius: 20%;
border-style: groove;
border-width: 10px;
border-color: grey;
}
so you do have a conflict in some of the properties that you are trying to use - the Bootstrap class has a very small radius set on the corners, you have a 20% radius for all corners, so you are most likely overriding the Bootstrap settings. It is perfectly fine to do that if you wish, but it appears that things are working as they should be.
:
after your href:=
attribute setting. That might help... In other words, just href=
display: inline-block
or inline
for both or float: left
for first, there are many possibilities
<a href>
@meetmangukiya ?
<span>
, which is an inline element that allows you to apply different styling to a span of text? Maybe that would be easier to use?
<header><a>
or <h1>Text<a>
<span>
element
<h1>Text<a>
because you cannot always nest any element anywhere - I think that heading tags are one of those places where you cannot (or are not supposed to) nest other elements?
<h1>Heading</h1>
<nav>
<a>anchor 1</a>
<a> anchor2 </a>
</nav>
<h1><a href="">Text</a></h1>
since html 5 even <a href=""><h1></h1></a>
it's ok
khaduch sends brownie points to @alexanderdom :sparkles: :thumbsup: :sparkles:
:cookie: 379 | @alexanderdom |http://www.freecodecamp.com/alexanderdom
<a>
who wraps block elements yes it wasn't @khaduch
Ready Fire Aim!
Ready aim fire :/
Course correction can happen any time!
Ok, I get it, my bad :(
div > header > h1{
/*props*/
}
@meetmangukiya is your html is
<div>
<header>
<h1></h1>
</header>
</div>
?
nope , just
h1{
/*props*/
}
works well
tmag298 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1639 | @khaduch |http://www.freecodecamp.com/khaduch
img-rounded
only does a small radius on the corners. img-circle
would put a 50% radius on the image, which would make it circular. If the image is square, then it would appear as a circle. If the image is rectangular, then it would appear as an ellipse. And you could still use your grey border class, if you remove the border-radius setting.
Hello guys! I'm new with this, and I have been developing a website for a cleint on upwork.com
I wanted to know how do you normally show the result to the client, do you have your own servers + domain, or do you use any web app that you upload the files to?
<!DOCTYPE html>
<html>
<head>
<title>Simon</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" media="screen">
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<div class="holder">
<div class="red"></div>
<div class="blue"></div>
<div class="yellow"></div>
<div class="green"></div>
</div>
<div class="inner">
<div class="row">
<button type="button" name="button" class="btn btn-primary" onclick="start()">Start</button>
<!-- .roundedOne -->
<div class="roundedOne">
<input type="checkbox" value="None" id="roundedOne" name="check" checked />
<label for="roundedOne"></label>
</div>
<!-- end .roundedOne -->
<input type="text" name="count" value="--" disabled="disabled">
</div>
<div class="row">
<center>
<section title=".slideThree">
<!-- .slideThree -->
<div class="slideThree" >
<input type="checkbox" value="None" id="slideThree" name="check" />
<label for="slideThree" ></label>
</div>
<!-- end .slideThree -->
</section>
</center>
</div>
</div>
<script src="http://code.jquery.com/jquery.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
ewathedoer sends brownie points to @drurenia :sparkles: :thumbsup: :sparkles:
:cookie: 309 | @drurenia |http://www.freecodecamp.com/drurenia
@sebtn The reason it keeps doing the break time is because you are always setting duration to the break-length value:
if (timer == 0) {
clearInterval(clock)
var duration = (document.getElementById('break-length').innerHTML)*60
startTimer(duration, display)
clearInterval(clock)
}
Set a variable that will tell you what "mode" the timer is in (break or session) and change the mode every time the timer reaches 0. You can then know whether or not to read document.getElementById('break-length').innerHTML
or document.getElementById('session-length').innerHTML
@sebtn - I'll make a few suggestions, looking at your post.
That is my helpful hints on that - looks like you're getting things up and running?
drurenia sends brownie points to @ewathedoer :sparkles: :thumbsup: :sparkles:
:cookie: 499 | @ewathedoer |http://www.freecodecamp.com/ewathedoer
cya!!
sebtn sends brownie points to @khaduch and @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 794 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
:star2: 1640 | @khaduch |http://www.freecodecamp.com/khaduch
startTimer(duration, display, mode)
.
@sebtn - mainly that you know what it is doing? You might do something like this, as an example:
var session = true; // this means you are in the "session" time
// your code...
if (session) {
// we are in the session time, switch to the break time
timer = breakTime;
session = false; // now it means we are in the break
// start the timer or let it continue running with new count
} else {
timer = sessionTime;
session = true;
// start the timer or let it continue running with the session count
}
a rough idea.
and as @TylerMoeller points out - you want to make sure that the scope is such that you can access it in all of your functions.
Hello. I am having some trouble with my TwitchTV app, in particular, the for loop I am using seems to only be returning data for the LAST variable (twitch username) in my array. This is not making any sense to me. Anyone care to help troubleshoot, I have been over this several times and cannot identify why this is happening. Link to pen below code.
$(document).ready(function() {
var twitchUserArr = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];
for (i = 0; i < (twitchUserArr.length); i++) {
var twitchUser = twitchUserArr[i];
var API = "https://api.twitch.tv/kraken/streams/" + twitchUser + "?callback=?";
var url = "https://www.twitch.tv/" + twitchUser;
$.getJSON(API, function(data) {
if ((data.stream) === null) {
$("#notStreaming").append("<a class=" + "'" + "list-group-item notStreaming" + "'" + " href=" + "'" + url +"'" + "><h3>" + twitchUser + "</h3><h4>" + " status: offline" + "</h4></a>")
} else if ((data.error) === "Not Found") {
$("#accountClosed").append("<a class=" + "'" + "list-group-item accountClosed" + "'" + " href=" + "'" + url +"'" + "><h3>" + twitchUser + "</h3><h4>" + " status: account closed" + "</h4></a>")
} else {
var status = (data.stream.channel.status);
$("#streaming").append("<a class=" + "'" + "list-group-item streaming" + "'" + " href=" + "'" + url +"'" + "><h3>" + twitchUser + "</h3><h4>" + " status: " + status + "</h4></a>")
}
});
}
});
for (i = 0; i < (twitchUserArr.length); i++) {
twitchUserArr.forEach(function(twitchUser) {
)
function spinalCase(str) {
// "It's such a fine line between stupid, and clever."
// --David St. Hubbins
var array = str.split("");
for (i = 0; i < array.length; i++) {
if (array[i] === /[A-Z]/ && array[i-1] !== " ") {
array = array.splice(i - 1, 0, " ");
}
array[i] = array[i].toLowerCase();
if (array[i] === " " || array[i] === "_") {
array[i] = "-";
}
}
console.log(array);
str = array.join("");
return str;
}
spinalCase('This Is Spinal Tap');
danielmw34 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 3132 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
function updateWeather(city,system) {
//connect to open weather map API
var icon;
var apiKey = "3249f284576e7eda04afba6c2277493f";
$.ajax({
dataType: "json",
url: "http://api.openweathermap.org/data/2.5/weather?q=" + city + ",usa&units=" + system + "&APPID=" + apiKey,
type: "GET",
success: function(json) {
alert("This worked. Now use the JSON object.")
}, error: function() {
alert('Error obtaining IP');
}
});
}
json.main.temp
klausmana sends brownie points to @kevincauto :sparkles: :thumbsup: :sparkles:
:cookie: 305 | @kevincauto |http://www.freecodecamp.com/kevincauto
<ul>
<li><a class="active" href="#about">About</a></li>
<li><a href="#recent">Recent</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
<div class="row home-background"></div>
<div class="row recent-background"></div>
<div class="row contact-background"></div>
.row{
height: 500px
}
function Weather(latitude , longtitude){
var apiKey = "fffc77f90fb489748fe36ae1b79ac8b5";
$.ajax ({
dataType : "json",
url : "http://api.openweathermap.org/data/2.5/weather?lat=" + latitude + "&lon=" + longtitude + "&APPID=" + apiKey,
type : "GET",
});
}
subbycoon sends brownie points to @kevincauto :sparkles: :thumbsup: :sparkles:
:cookie: 306 | @kevincauto |http://www.freecodecamp.com/kevincauto
latitude = navigator.geolocation.getCurrentPosition(function(position){
return position.coords.latitude;
});
http://codepen.io/itsstoiven/pen/pyqQqq?editors=0110
if (window.location.protocol !== 'http:') url = 'https://crossorigin.me/' + url;
itsstoiven sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 795 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
$.ajax ({
url : "http://ip-api.com/json"
}).done(function(data) {
alert(data.lat + ',' + data.lon);
}).fail(function(err) {
console.log(err);
});
function Weather(latitude , longtitude){
$.ajax ({
url : "http://ip-api.com/json"
}).done(function(data) {
alert(data.lat + ',' + data.lon);
}).fail(function(err) {
console.log(err);
});
latitude = data.lat;
longtitude = data.lon;
var apiKey = "fffc77f90fb489748fe36ae1b79ac8b5";
$.ajax ({
dataType : "json",
url : "http://api.openweathermap.org/data/2.5/weather?lat=" + latitude + "&lon=" + longtitude + "&APPID=" + apiKey,
type : "GET"
});
}
console.log();
:cookie: 364 | @konikodes |http://www.freecodecamp.com/konikodes
luscariot sends brownie points to @konikodes :sparkles: :thumbsup: :sparkles:
arvendragon sends brownie points to @konikodes :sparkles: :thumbsup: :sparkles:
:cookie: 365 | @konikodes |http://www.freecodecamp.com/konikodes
konikodes sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 796 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
width: 100%;
in that class
<img src="https://d.ibtimes.co.uk/en/full/1467924/aung-san-suu-kyi.jpg" alt="Supporters of Aung San Suu Kyi hold posters bearing her image" class="testing">
in your html and then .testing {width: 100%;}
in your css
<a href="url to your facebook page">Follow me on Facebook</a>
predarobert sends brownie points to @nicholasdshaw :sparkles: :thumbsup: :sparkles:
:cookie: 249 | @nicholasdshaw |http://www.freecodecamp.com/nicholasdshaw
nicholasdshaw sends brownie points to @jluboff :sparkles: :thumbsup: :sparkles:
:cookie: 353 | @jluboff |http://www.freecodecamp.com/jluboff
ezcrowe sends brownie points to @anntol :sparkles: :thumbsup: :sparkles:
:cookie: 364 | @anntol |http://www.freecodecamp.com/anntol
$(".glass").click(function(){
$("input").css("display", "block");
});
ezcrowe sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 798 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
http://
instead of https://
- maybe you should put a reminder note at the top? (I see that @KoniKodes posted this same solution... quite a while ago. I guess I'm way behind on the chat stream! ;) )
tylermoeller sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1641 | @khaduch |http://www.freecodecamp.com/khaduch