In this lab we use JavaScript to make picture appear when you are scrolling down the page. Once again I was watching the video to this because it has every step to do this but hard thing about this lab was that sometimes my code will break and I'll spend my time trying to figure out why it wasn't working and not only to find out that I didn't close the function and then it made me mad because I could have finished this lab long time ago but the lab was easy and I don't see myself using this in the future because it's a lot of work and I don't like I'll be writing article any time soon.
Tuesday, January 16, 2018
Lab 25 Refection
In this lab we had to use JavaScript to make a password like wesbos in my case and then have pics appear this was easy to do because the video show me I need to add function that let me type in the console and once the password is typed it will start making picture appear and this fun to do the hardest part was making sure the code was right and I don't see myself using this in the future.
Tuesday, January 9, 2018
Lab 24 Refection
In this lab i have to use the video player and code it so it has volume and speed up and slow down and i thought this was going to be hard but the javascript for the this was pretty easy as soon as you watch the video and the code i use where
function togglePlay() {
const method = video.paused ? 'play' : 'pause';
video[method]();
}
function updateButton() {
const icon = this.paused ? '►' : '❚ ❚';
console.log(icon);
toggle.textContent = icon;
}
function skip() {
video.currentTime += parseFloat(this.dataset.skip);
}
function handleRangeUpdate() {
video[this.name] = this.value;
}
function handleProgress() {
const percent = (video.currentTime / video.duration) * 100;
progressBar.style.flexBasis = `${percent}%`;
}
function scrub(e) {
const scrubTime = (e.offsetX / progress.offsetWidth) * video.duration;
video.currentTime = scrubTime;
}
this made code keep in track of the video and it speed and it make sure it work.
function togglePlay() {
const method = video.paused ? 'play' : 'pause';
video[method]();
}
function updateButton() {
const icon = this.paused ? '►' : '❚ ❚';
console.log(icon);
toggle.textContent = icon;
}
function skip() {
video.currentTime += parseFloat(this.dataset.skip);
}
function handleRangeUpdate() {
video[this.name] = this.value;
}
function handleProgress() {
const percent = (video.currentTime / video.duration) * 100;
progressBar.style.flexBasis = `${percent}%`;
}
function scrub(e) {
const scrubTime = (e.offsetX / progress.offsetWidth) * video.duration;
video.currentTime = scrubTime;
}
this made code keep in track of the video and it speed and it make sure it work.
Wednesday, January 3, 2018
Lab 23 Refection
In this lab i had to make a check box that let you check of the list many way this lab was easy to do because i followed the video and the it show me that i needed and then i added this checkboxes.forEach(checkbox => {
console.log(checkbox);
if (checkbox === this || checkbox === lastChecked) {
inBetween = !inBetween;
console.log('STarting to check them inbetween!');
}
if (inBetween) {
checkbox.checked = true;
}
});
}
lastChecked = this;
}
checkboxes.forEach(checkbox => checkbox.addEventListener('click', handleCheck));
to my javascript to make to it work and it basically make sure you can you other check commands so you have different ways to use it. I don't see myself using this because it not useful.
console.log(checkbox);
if (checkbox === this || checkbox === lastChecked) {
inBetween = !inBetween;
console.log('STarting to check them inbetween!');
}
if (inBetween) {
checkbox.checked = true;
}
});
}
lastChecked = this;
}
checkboxes.forEach(checkbox => checkbox.addEventListener('click', handleCheck));
to my javascript to make to it work and it basically make sure you can you other check commands so you have different ways to use it. I don't see myself using this because it not useful.
Lab 22 Refection
In this lab we use javascript console to make interaction with the web page, i did this by making the console react to the the text on the page with a page click event on it and then it will add css to the text and you can check the information on the console to make it show the the character into from the stater kit and it show the age of the characters. The part of the lab was making sure the console was right because it hard but i follow the video so i was fine and i don't see myself using this in the future.
Subscribe to:
Posts (Atom)




