A Pen by Kazu

Developer
Size
2,896 Kb
Views
10,120

How do I make an a pen by kazu?

Forked from mprquinn's Pen KrdCH.. What is a a pen by kazu? How do you make a a pen by kazu? This script and codes were developed by Kazu on 28 October 2022, Friday.

A Pen by Kazu Previews

A Pen by Kazu - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>A Pen by Kazu</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <body>
</body> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/three.js/r67/three.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

A Pen by Kazu - Script Codes CSS Codes

body { background-color: #ff0099; margin: 0px; overflow: hidden; font-family:Monospace; font-size:13px; text-align:center; font-weight: bold; text-align:center;
}
div{ background: #ff0099;
}

A Pen by Kazu - Script Codes JS Codes

var container, stats;	var camera, scene, renderer, particles, geometry, materials = [], parameters, i, h, color;	var mouseX = 0, mouseY = 0;	var windowHalfX = window.innerWidth / 2;	var windowHalfY = window.innerHeight / 2;	init();	animate();	function init() {	container = document.createElement( 'div' );	document.body.appendChild( container );	camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 1, 3000 );	camera.position.z = 600;	scene = new THREE.Scene();	scene.fog = new THREE.FogExp2( 0x000000, 0.0025 );	console.log(scene);	geometry = new THREE.Geometry();	for ( i = 0; i < 20000; i ++ ) {	var vertex = new THREE.Face3();	vertex.x = Math.random() * 2000 - 1000;	vertex.y = Math.random() * 2000 - 1000;	vertex.z = Math.random() * 4200 - 69;	geometry.vertices.push( vertex );	}	parameters = [	[ [1, 1, 0.5], 5 ],	[ [0.95, 1, 0.5], 4 ],	[ [0.90, 1, 0.5], 3 ],	[ [0.85, 1, 0.5], 2 ],	[ [0.80, 1, 0.5], 1 ]	];	for ( i = 0; i < parameters.length; i ++ ) {	color = parameters[i][0];	size = parameters[i][1];	materials[i] = new THREE.ParticleSystemMaterial( { size: size } );	particles = new THREE.ParticleSystem( geometry, materials[i] );	particles.rotation.x = Math.random() * 360;	particles.rotation.y = Math.random() * 360;	particles.rotation.z = Math.random() * 360;	scene.add( particles );	}	renderer = new THREE.WebGLRenderer({ clearColor: 0xff0000, clearAlpha: 1 }); renderer.setClearColorHex( 0xff0099, 1 );	renderer.setSize( window.innerWidth, window.innerHeight );	container.appendChild( renderer.domElement );
/*	stats = new Stats();	stats.domElement.style.position = 'absolute';	stats.domElement.style.top = '0px';	container.appendChild( stats.domElement );*/	document.addEventListener( 'mousemove', onDocumentMouseMove, false );	document.addEventListener( 'touchstart', onDocumentTouchStart, false );	document.addEventListener( 'touchmove', onDocumentTouchMove, false );	//	window.addEventListener( 'resize', onWindowResize, false );	}	function onWindowResize() {	windowHalfX = window.innerWidth / 2;	windowHalfY = window.innerHeight / 2;	camera.aspect = window.innerWidth / window.innerHeight;	camera.updateProjectionMatrix();	renderer.setSize( window.innerWidth, window.innerHeight );	}	function onDocumentMouseMove( event ) {	mouseX = event.clientX - windowHalfX;	mouseY = event.clientY - windowHalfY;	}	function onDocumentTouchStart( event ) {	if ( event.touches.length === 1 ) {	event.preventDefault();	mouseX = event.touches[ 0 ].pageX - windowHalfX;	mouseY = event.touches[ 0 ].pageY - windowHalfY;	}	}	function onDocumentTouchMove( event ) {	if ( event.touches.length === 1 ) {	event.preventDefault();	mouseX = event.touches[ 0 ].pageX - windowHalfX;	mouseY = event.touches[ 0 ].pageY - windowHalfY;	}	}	//	function animate() {	requestAnimationFrame( animate );	render();	stats.update();	}	function render() {	var time = Date.now() * 0.00005;	camera.position.x += ( mouseX - camera.position.x ) * 0.05;	camera.position.y += ( - mouseY - camera.position.y ) * 0.05;	camera.lookAt( scene.position );	for ( i = 0; i < scene.children.length; i ++ ) {	var object = scene.children[ i ];	if ( object instanceof THREE.ParticleSystem ) {	object.rotation.y = time * ( i < 4 ? i + 1 : - ( i + 1 ) );	}	}	for ( i = 0; i < materials.length; i ++ ) {	color = parameters[i][0];	h = ( 360 * ( color[0] + time ) % 360 ) / 360;	materials[i].color.setHSL( 255, 255, 255 );	}	renderer.render( scene, camera );	}
A Pen by Kazu - Script Codes
A Pen by Kazu - Script Codes
Home Page Home
Developer Kazu
Username carmerano
Uploaded October 28, 2022
Rating 3
Size 2,896 Kb
Views 10,120
Do you need developer help for A Pen by Kazu?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Kazu (carmerano) Script Codes
Create amazing love letters with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!