#Day2 of #learning_motion_design_for_web

🎨 Videos are the superheroes of content delivery.

🎬 Loading videos from external sources is a breeze with simple embed codes, making it easy to add them to webpages.

💻 If you're self-hosting the videos, you can use the <video> HTML element to add them anywhere on the page.

🔄 You can fine-tune the video functionality by using attributes like autoplay, muted, loop, and controls.

Example Code: Here's an example of using the <video> HTML element with various attributes:

html

<video width="320" height="240" controls autoplay muted loop>
  <source src="movie.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>

Note: The text within the <video> tag ("Your browser does not support the video tag.") will appear if the user's browser does not support the video format.

🌀 Controlling the appearance of the video player can be easily done by using frameworks like Video JS.

📚 You need to always optimize video format and size to ensure faster page loading times.

🎥 In terms of video format, MP4 is a reliable option that is supported by all browsers and media players.

🛠 To compress a video or convert it to a different format, you can use the free app Handbrake.

Keep pushing forward, and let’s continue making progress together. 🚀 The journey never stops! 😎

Good Morning everyone 🌞

Here is what happened yesterday night: I was deep in my coding zone, trying to access a weather API. Everything seems perfect, my code is looking good, but no matter what I try, I keep getting this 404💀 error😤🤒

I double-check my syntax, look up the API documentation, even try a few more error-handling techniques. Still, nothing works. An hour passes by, and I'm on the brink of pulling my hair out in frustration 😁

Then, it hits me could it be something outside my code? I start exploring, and guess what I find? My browser's ad blocker is turned on and it's blocking the API request🤦‍♂️

The ad blocker was silently causing all this trouble while my code was just fine.😅

What a headache 🤕😂

#Day3 of #learning_motion_design_for_web

- not all CSS properties support transitions, like for example background, however, there is a way like using pseudo-elements ::before and ::after. Here is an example:

<div class="box"></div>

.box {
  position: relative;
  width: 200px;
  height: 200px;
}

.box::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: red; 
  transition: background 0.5s ease; 

.box:hover::before {
  background: blue;
}

- not all transitions in a page need the same duration sometimes, using a longer transition among shorter ones can create a very satisfying movement.

- transitions are not limited to hover states. For example, they can be triggered when an element receives a certain class.

let's keep going⚡️

Morning everyone☀️

I've been offline for the past 5 days due to some personal matters that took me away from coding and projects But I'm back now feeling refreshed and full of energy Excited to share some awesome projects with y'all soon.
I'll be making at least 1-2 projects to get back on track with my plan.

Thanks!

Just keep going!!

Even css logo does not know how to center the text correctly inside the div 😂

I'm using the IP Geolocation API for my project to track IP addresses and display user locations, ip addresses, timezone, and ISP However, it's only providing me with the nearest city, often the capital, instead of the precise user location.. Can anyone recommend a more accurate geolocation API that doesn't have this city limitation?

Thanks👍

The only things you need to know about css

For me, the education system kinda takes the fun out of failing. They make you so scared of failing that it kills your creativity and stops you from trying new things. And I’m not just talking about uni—high school was even worse.

If you wanna create something, you need first-principle thinking, and that comes with the cost of failing. Look at SpaceX’s Falcon 9—do you think it landed perfectly on its first try? It took multiple failures and millions of dollars in losses before success.

How are we supposed to not fail and innovate? That’s like chaining someone up and blaming them for not walking.

Just my two cents tho—don’t take it personally 😊🤷‍♂

@selfmadecoder

This is so true

lemme know what u think