Posts

Showing posts from February, 2024

"Mesmerizing Animated Ball Reels | HTML, CSS, JavaScript Animation Tutorial"

<!DOCTYPE html> <html lang="en"> <head>   <meta charset="UTF-8">   <meta name="viewport" content="width=device-width, initial-scale=1.0">   <title>Animated Ball</title>   <style>     body {       margin: 0;       overflow: hidden;     }     #ball {       width: 50px;       height: 50px;       background-color: #3498db;       border-radius: 50%;       position: absolute;     }   </style> </head> <body> <div id="ball"></div> <script>   document.addEventListener('DOMContentLoaded', function () {     const ball = document.getElementById('ball');     const screenWidth = window.innerWidth;     const screenHeight = window.innerHeight;     const ballSize = 50;     let x = screenWidth / 2 - b...
Post a Comment
Read more

"Create a Stylish Spinner with Balls using HTML, CSS, and JavaScript | Web Development Tutorial"

 <!DOCTYPE html> <html lang="en"> <head>   <meta charset="UTF-8">   <meta name="viewport" content="width=device-width, initial-scale=1.0">   <title>Spinner with Balls</title>   <style>     body {       display: flex;       justify-content: center;       align-items: center;       height: 100vh;       margin: 0;     }     .spinner {       position: relative;       width: 80px;       height: 80px;       animation: spin 1s linear infinite;     }     .ball {       position: absolute;       width: 20px;       height: 20px;       background-color: #3498db; /* Blue */       border-radius: 50%;     }     .ball1 { top: 0; left: 50%; transform: trans...
Post a Comment
Read more

"Create a Spinning Earth Animation | HTML, CSS, JavaScript Tutorial"

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Spinning Earth</title> <style> body { margin: 0; display: flex; justify-content: center; align-items: center; height: 100vh; background-color: #000; } #earth { width: 200px; height: 200px; border-radius: 50%; background-image: url('https://upload.wikimedia.org/wikipedia/commons/thumb/9/97/The_Earth_seen_from_Apollo_17.jpg/640px-The_Earth_seen_from_Apollo_17.jpg'); background-size: cover; animation: spin 10s linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } </style> </head> <body> <div id="earth"></div> <script> // You can add...
Post a Comment
Read more

Building a Simple Guessing Game in Python

Building a Simple Guessing Game in Python Introduction: Python is a versatile programming language that allows you to create a wide range of applications, from web development to game development. In this blog post, we'll walk through the process of creating a small and simple guessing game using Python. This game is designed for beginners and serves as a great starting point for understanding basic Python syntax and logic. The Guessing Game: Our game revolves around the classic concept of guessing a randomly generated number within a specified range. The player has a limited number of attempts to guess the correct number, and the game provides feedback after each attempt. Code Breakdown: Let's break down the key components of the Python code for our guessing game: Random Number Generation: We use the random module to generate a random number between 1 and 10, which serves as the target for the player to guess. Shubham Code  import random def guessing_game():     # Genera...
Post a Comment
Read more