Three test

Developer
Esambino Wei Cheng Hsieh
Size
2,541 Kb
Views
8,096
  1. Three test Previews
  2. Three test HTML Codes
  3. Three test CSS Codes
  4. Three test JS Codes

How do I make an three test?

What is a three test? How do you make a three test? This script and codes were developed by Esambino Wei Cheng Hsieh on 07 January 2023, Saturday.

Three test Previews
IQ Test

Three test - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>three test</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r58/three.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.5/dat.gui.min.js"></script> <script src="js/index.js"></script>
</body>
</html>

Three test - Script Codes CSS Codes

body { background-color: #111; margin: 0px auto; overflow: hidden; text-align: center;
}

Three test - Script Codes JS Codes

var SCREEN_WIDTH = window.innerWidth,	SCREEN_HEIGHT = window.innerHeight,	mouseX = 0, mouseY = 0,	windowHalfX = window.innerWidth / 2,	windowHalfY = window.innerHeight / 2,	SEPARATION = 300,	AMOUNTX = 10,	AMOUNTY = 10,	camera, scene, renderer;	init();	animate();	function init() {	var container, separation = 100, amountX = 50, amountY = 50,	particles, particle;	container = document.createElement('div');	document.body.appendChild(container);	camera = new THREE.PerspectiveCamera( 75, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 10000 );	camera.position.z = 1000;	scene = new THREE.Scene();	renderer = new THREE.CanvasRenderer();	renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );	container.appendChild( renderer.domElement );	// particles	var PI2 = Math.PI * 2;	var material = new THREE.ParticleCanvasMaterial( {	color: 0xffffff,	program: function ( context ) {	context.beginPath();	context.arc( 0, 0, 1, 0, PI2, true );	context.fill();	}	} );	for ( var i = 0; i < 500; i ++ ) {	particle = new THREE.Particle( material );	particle.position.x = Math.random() * 2 - 1;	particle.position.y = Math.random() * 2 - 1;	particle.position.z = Math.random() * 2 - 1;	particle.position.normalize();	particle.position.multiplyScalar( Math.random() * 10 + 550 );	scene.add( particle );	}	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();	}	function render() {	camera.position.x += ( mouseX - camera.position.x ) * .05;	camera.position.y += ( - mouseY + 200 - camera.position.y ) * .05;	camera.lookAt( scene.position );	renderer.render( scene, camera );	}
Three test - Script Codes
Three test - Script Codes
Home Page Home
Developer Esambino Wei Cheng Hsieh
Username Esambino
Uploaded January 07, 2023
Rating 3
Size 2,541 Kb
Views 8,096
Do you need developer help for Three test?

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!

Esambino Wei Cheng Hsieh (Esambino) Script Codes
Name
Scroll
Tribute to Rorschach
My first gsap
Gdf
0000
Css3 slider
Cafe Lakulaku
Blank
Practice hover
Apple iPhone 5s style scrolling
Create amazing marketing copy 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!