Maison > interface Web > js tutoriel > Objectif de Girlfriend en utilisant le codage HTML, CSS et Javascript

Objectif de Girlfriend en utilisant le codage HTML, CSS et Javascript

Barbara Streisand
Libérer: 2025-01-04 09:06:40
original
717 Les gens l'ont consulté

Purpose to Girlfriend using coding html css and javascript

Suivez-nous sur Instagram, partagez et suivez, aimez-nous pour obtenir plus de contenu de ce genre. Le code de la bobine ci-dessus est :

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Propose</title>
  <link rel="stylesheet" href="style.css">
  <link rel="shortcut icon" type="image/jpg" href="heart.png" />
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet"
    integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
</head>

<body>
  <div>



<p>const parentElement = document.getElementById("parentElement");<br>
const showMassage = document.getElementById("showMassage");<br>
const changeColor = document.body.style;</p>

<p>propose = () => {<br>
  parentElement.style.display = "none";<br>
  showMessage.style.display = "block";<br>
  changeColor.background =<br>
    "linear-gradient(116.82deg, #ff94e7 0%, #27cbff 100%)";<br>
};

<p>var textWrapper = document.querySelector(".ml6 .letters");<br>
textWrapper.innerHTML = textWrapper.textContent.replace(<br>
  /\S/g,<br>
  "$&"<br>
);</p>

<p>anime<br>
  .timeline({ loop: true })<br>
  .add({<br>
    targets: ".ml6 .letter",<br>
    translateY: ["1.1em", 0],<br>
    translateZ: 0,<br>
    duration: 750,<br>
    delay: (el, i) => 50 * i,<br>
  })<br>
  .add({<br>
    targets: ".ml6",<br>
    opacity: 0,<br>
    duration: 1000,<br>
    easing: "easeOutExpo",<br>
    delay: 1000,<br>
  });<br>
</p>

<pre class="brush:php;toolbar:false">
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:dev.to
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal