Themabewertung:
  • 0 Bewertung(en) - 0 im Durchschnitt
  • 1
  • 2
  • 3
  • 4
  • 5
particle.js
#1
Du brauchst doch nur den Code von Codepen nehmen und deine Eingaben da rein schreiben.
Und nicht vergessen den body schwarz machen sonst sieht man das bei deinen angaben nicht
**Link entfernt, weil Seite nicht mehr erreichbar **
PHP-Code:
<!DOCTYPE HTML>
<
html>
 
   <head>
 
       <title>B A D E S P E A K</title>
 
       <meta charset="utf-8" />
 
       <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
 
    
        
<link rel="stylesheet" href="assets/css/main.css" />
 
       <noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
 
 
        
<style>
 
       body{
 
       background:black;
 
       }
 
       </style>
 
       <body>
 
       <div id="particles-js"></div>
 
               <script src="https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></script>
 
                <script src="https://threejs.org/examples/js/libs/stats.min.js"></script      
          
      
<script>
 
   
particlesJS
("particles-js", {
 
 "particles": {
 
   "number": {
 
     "value"80,
 
     "density": {
 
       "enable"true,
 
       "value_area"800
      
}
 
   },
 
   "color": {
 
     "value""#ffffff"
 
   },
 
   "shape": {
 
     "type""circle",
 
     "stroke": {
 
       "width"0,
 
       "color""#000000"
 
     },
 
     "polygon": {
 
       "nb_sides"5
      
},
 
     "image": {
 
       "src""img/github.svg",
 
       "width"100,
 
       "height"100
      
}
 
   },
 
   "opacity": {
 
     "value"0.5,
 
     "random"false,
 
     "anim": {
 
       "enable"false,
 
       "speed"1,
 
       "opacity_min"0.1,
 
       "sync"false
      
}
 
   },
 
   "size": {
 
     "value"10,
 
     "random"true,
 
     "anim": {
 
       "enable"false,
 
       "speed"80,
 
       "size_min"0.1,
 
       "sync"false
      
}
 
   },
 
   "line_linked": {
 
     "enable"true,
 
     "distance"300,
 
     "color""#ffffff",
 
     "opacity"0.4,
 
     "width"2
    
},
 
   "move": {
 
     "enable"true,
 
     "speed"12,
 
     "direction""none",
 
     "random"false,
 
     "straight"false,
 
     "out_mode""out",
 
     "bounce"false,
 
     "attract": {
 
       "enable"false,
 
       "rotateX"600,
 
       "rotateY"1200
      
}
 
   }
 
 },
 
 "interactivity": {
 
   "detect_on""canvas",
 
   "events": {
 
     "onhover": {
 
       "enable"false,
 
       "mode""repulse"
 
     },
 
     "onclick": {
 
       "enable"true,
 
       "mode""push"
 
     },
 
     "resize"true
    
},
 
   "modes": {
 
     "grab": {
 
       "distance"800,
 
       "line_linked": {
 
         "opacity"1
        
}
 
     },
 
     "bubble": {
 
       "distance"800,
 
       "size"80,
 
       "duration"2,
 
       "opacity"0.8,
 
       "speed"3
      
},
 
     "repulse": {
 
       "distance"400,
 
       "duration"0.4
      
},
 
     "push": {
 
       "particles_nb"4
      
},
 
     "remove": {
 
       "particles_nb"2
      
}
 
   }
 
 },
 
 "retina_detect"true
});
 
 
         </script>
 
       </body


Zitieren


Gehe zu:


Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste