martes, 9 de enero de 2024

Otro html

TOCA CON EL DEDO Y DISPARAS BOLAS AZULES




<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Animación de círculos</title>
    <style>
      canvas {
        border: 1px solid black;
      }
    </style>
  </head>
  <body>
    <canvas id="myCanvas" width="200" height="200"></canvas>
    <script>
      const canvas = document.getElementById('myCanvas');
      const ctx = canvas.getContext('2d');

      // Dibuja un cuadrado en el canvas
      ctx.fillStyle = 'red';
      ctx.fillRect(50, 50, 100, 100);

      // Agrega un evento touchstart al canvas
      canvas.addEventListener('touchstart', function(event) {
        // Dibuja círculos en el canvas y los mueve hacia el eje -y-
        let y = 50;
        let radius = 10;
        let intervalId = setInterval(function() {
          ctx.clearRect(0, 0, canvas.width, canvas.height);
          ctx.fillStyle = 'red';
          ctx.fillRect(50, 50, 100, 100);
          ctx.fillStyle = 'blue';
          ctx.beginPath();
          ctx.arc(100, y, radius, 0, 2 * Math.PI);
          ctx.fill();
          y += 10;
          if (y > canvas.height + radius) {
            clearInterval(intervalId);
          }
        }, 50);
      });
    </script>
  </body>
</html>

Animación de círculos
Publicado por en No hay comentarios:

lunes, 8 de enero de 2024

Dispara cudrados toca la pantalla

Toca el cuadrado rojo con el dedo, luego el azul .....y asi sucesibamente........

Click on the red square to see the effect


<!DOCTYPE html>
<html>
<head>
<style>
.container {
  width: 200px;
  height: 200px;
  position: relative;
  background-color: #f1f1f1;
}

.square {
  width: 50px;
  height: 50px;
  position: absolute;
  background-color: red;
  cursor: pointer;
}

.square:hover ~ .moving-square {
  animation: move-up 1s ease-in-out forwards;
}

@keyframes move-up {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-100px);
  }
}

.moving-square {
  width: 50px;
  height: 50px;
  position: absolute;
  background-color: blue;
  top: 200px;
}
</style>
</head>
<body>

<h2>Click on the red square to see the effect</h2>

<div class="container">
  <div class="square"></div>
  <div class="moving-square"></div>
</div>

</body>
</html>

Publicado por en No hay comentarios:

Circulos volando

<!DOCTYPE html>
<html>
<head>
  <style>
    #square {
      width: 200px;
      height: 200px;
      background-color: lightblue;
      position: relative;
    }

    .circle {
      width: 20px;
      height: 20px;
      background-color: white;
      border-radius: 50%;
      position: absolute;
      animation: move 2s ease-in-out infinite;
    }

    @keyframes move {
      0% {
        transform: rotate(0deg) translate(0, 0);
      }
      100% {
        transform: rotate(360deg) translate(100px, 0);
      }
    }
  </style>
</head>
<body>
  <div id="square" ontouchstart="createCircle(event)">
  </div>

  <script>
    function createCircle(event) {
      var x = event.touches[0].clientX;
      var y = event.touches[0].clientY;
      var circle = document.createElement("div");
      circle.classList.add("circle");
      circle.style.left = x + "px";
      circle.style.top = y + "px";
      document.getElementById("square").appendChild(circle);
    }
  </script>
</body>
</html>




TOCA CON EL DEDO REP
PETIDAMENTE LA PANTALLA DEL TELEFONO....EN EL CUADRADO AZUL

Publicado por en No hay comentarios:

domingo, 7 de enero de 2024

Sript para Godot3d 4.2 produce una animacion de giro de todo el contenido del Area3d y borra dos hijos de dicho nodo Area3d;

 extends Area3D


# Called when the node enters the scene tree for the first time.

func _ready():

pass # Replace with function body.



# Called every frame. 'delta' is the elapsed time since the previous frame.

func _process(delta):

pass



func _on_area_entered(area):

get_node("SOLDADOTIESO2VIVO").queue_free()

get_node("CollisionShape3D10 borroestoprueba").queue_free()

$AnimationPlayer.play("PELICULA180")

------------------------------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------------------
Explicacion:
 Tenemos un Area3d con una animacion de giro, cuando algo toca ese area3d, produce la animacion y a su vez borra dos nodos hijos de esta area3d el SOLDADOTIESO2VIVO y CollisionShape3D10 borroestoprueba

El func _on_area_entered(area): para que funcione se a de poner desde SEÑAL que esta en Nodos al lado del Inspector parte derecha de Godot..........


(hay que tener cuidado al duplicar archivos , por ejemplo si se pone este script en un Area3d que falta o tiene otro nombre por ejemplo el nodo hijo get_node("CollisionShape3D10 borroestoprueba").........pongamos no esta, o tiene otro nombre el juego funciona, pero al colisionar y estar incorrecto se cuelga el juego..................porque no encuentra esos archivos....



Publicado por en No hay comentarios:

Script para godot3d 4.2, Un Area3d tiene una animacion que se activa, y un nodo hijo de otro tipo que se borra;

 extends Area3D


# Called when the node enters the scene tree for the first time.

func _ready():

pass # Replace with function body.



# Called every frame. 'delta' is the elapsed time since the previous frame.

func _process(delta):

pass



func _on_area_entered(area):

get_node("SOLDADOTIESO2VIVO").queue_free()

$AnimationPlayer.play("PELICULA180")

----------------------------------------------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------


explicacion: cuando algo entra en Area3D el area entera gira porque hice una animacion que grave , y a la vez un nodo hijo llamado get_node("SOLDADOTIESO2VIVO") es borrado por la linea .queue_free()


Publicado por en No hay comentarios:
Etiquetas:game maker, unity, blender , ,

viernes, 5 de enero de 2024

2 pruebas

PASA LA FLECHA DEL RATON POR ENCIMA SI LO VES EN PC TOCA CON EL DEDO SI LO VES EN TELEFONO MOVIL














PASA LA FLECHA DEL RATON POR ENCIMA SI LO VES EN PC TOCA CON EL DEDO SI LO VES EN TELEFONO MOVIL<html>
<head>
  <style>
    .circle {
      width: 100px;
      height: 100px;
      border-radius: 50%;
      background-color: red;
      position: relative;
    }

    .circle:hover .inner-circle {
      animation: grow 1s forwards;
    }

    .inner-circle {
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background-color: white;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }

    @keyframes grow {
      from {
        transform: scale(0);
      }
      to {
        transform: scale(1);
      }
    }
  </style>
</head>
<body>
  <div class="circle">
    <div class="inner-circle"></div>
  </div>
</body>
</html>
Publicado por en No hay comentarios:

Juego pruebas

import pygame pygame.init() screen = pygame.display.set_mode((400, 400)) squareX = 50 squareY = 50 circleX = 50 circleY = 50 while True: for event in pygame.event.get(): if event.type == pygame.QUIT: pygame.quit() quit() if event.type == pygame.MOUSEBUTTONDOWN: if squareX < mouse[0] < squareX + 50 and squareY < mouse[1] < squareY + 50: circleX = squareX + 25 circleY = squareY + 25 screen.fill((255, 255, 255)) pygame.draw.rect(screen, (0, 0, 0), (squareX, squareY, 50, 50)) pygame.draw.circle(screen, (0, 0, 0), (circleX, circleY), 25) circleY -= 1 pygame.display.update() let squareX = 50; let squareY = 50; let circleX = 50; let circleY = 50; function setup() { createCanvas(400, 400); } function draw() { background(220); rect(squareX, squareY, 50, 50); circle(circleX, circleY, 25); circleY -= 1; } function mousePressed() { if (mouseX > squareX && mouseX < squareX + 50 && mouseY > squareY && mouseY < squareY + 50) { circleX = squareX + 25; circleY = squareY + 25; } }let squareX = 50;
let squareY = 50;
let circleX = 50;
let circleY = 50;

function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(220);
  rect(squareX, squareY, 50, 50);
  circle(circleX, circleY, 25);
  circleY -= 1;
}

function mousePressed() {
  if (mouseX > squareX && mouseX < squareX + 50 && mouseY > squareY && mouseY < squareY + 50) {
    circleX = squareX + 25;
    circleY = squareY + 25;
  }
}

Publicado por en No hay comentarios:
Suscribirse a: Entradas (Atom)