|
|
03-04-2010, 07:02 PM
|
Senior Member
GB Guru
|
|
Join Date: Sep 2009
Posts: 180
|
|
Helpful JavaScripts to develop website
Helpful JavaScript for Web development
3D self-revolving cube
This is a spinning three dimensional cube. Eight dots revolve by itself to create a motional cube.... detail at JavaScriptBank.com - 2.000+ free JavaScript codes
How to setup
Step 1: Use JavaScript code below to setup the script
JavaScript
Code:
<SCRIPT language=javascript>
/*
This script downloaded from www.JavaScriptBank.com
Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
*/
<!-- // (c) 2001 Till Nagel, till@netzministerium.de & Rene Sander, rene@netzministerium.de
// ---------------------------------------------------------------------------
// creates cube model with name and (a simple) material
var cubeModel = new Model("cube", new Material("°"));
// defines model points.
// The model's points have to be defined before the respective code is written into the document.
cubeModel.setPoints(createCubeModelPoints());
// ---------------------------------------------------------------------------
// the matrix to transform the model with
var staticRotationMatrix = new Matrix();
staticRotationMatrix.rotateX(0.05);
staticRotationMatrix.rotateY(0.1);
// ---------------------------------------------------------------------------
function initOnLoad() {
fixNetscape();
// assign layer (only for Netscape 4.x, for all other browsers
// this is done automatically when writing the point code)
cubeModel.assignLayers();
// creates and inits matrix to initialize the model
var initMatrix = new Matrix();
initMatrix.scale(50, 50, 50);
// >> begin to work with the model etc.
// initializes model
cubeModel.transform(initMatrix);
// >> first draw of the model (recommended)
cubeModel.draw();
// starts animation
animate();
}
/*
* The main animate method. Calls itself repeatedly.
*/
function animate() {
var delay = 10;
// animates cube model ----------------------------------------
// rotates the cube
cubeModel.transform(staticRotationMatrix);
// updates display
cubeModel.draw();
// calls itself with an delay to decouple client computer speed from the animation speed.
// result: the animation is as fast as possible.
setTimeout("animate()", delay);
}
// ---------------------------------------------------------------------------
function createCubeModelPoints() {
// the cube model
return new Array(
// Point3D( x, y, z, m)
new Point3D( 1, 1, 1, 0),
new Point3D( 1, 1, -1, 0),
new Point3D( 1, -1, 1, 0),
new Point3D( 1, -1, -1, 0),
new Point3D(-1, 1, 1, 0),
new Point3D(-1, 1, -1, 0),
new Point3D(-1, -1, 1, 0),
new Point3D(-1, -1, -1, 0)
);
}
// -->
</SCRIPT>
Step 2: Copy & Paste HTML code below in your BODY section
HTML
Code:
<DIV id=fixnetscape style="POSITION: absolute; VISIBILITY: hidden"></DIV>
<SCRIPT language=JavaScript type=text/javascript>
<!-- // (c) 2001 Till Nagel, till@netzministerium.de & Rene Sander, rene@netzministerium.de
// MANDATORY: INSERTION OF HTML PART INTO PAGE
// creates the HTML code representing the model's points
// NB: This is written directly into the page from within the method
cubeModel.createPointCode();
// -->
</SCRIPT>
Step 3: Download files below
Files
LyrObj.js
3dhtml.js
ColorUtil.js
materials.js
Javascript Music Player - Random Text Generator - Floating Image Script
Quote:
Originally Posted by Copyright
The Site may provide, or third parties may provide, links to non-JavaScriptBank.com Internet World Wide Web sites or resources. Because JavaScriptBank.com has no control over such sites and resources, you acknowledge and agree that JavaScriptBank.com is not responsible for the availability of such external sites or resources, and does not endorse and is not responsible or liable for any content, advertising, products, or other materials on or available from such sites or resources. You further acknowledge and agree that JavaScriptBank.com shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, goods or services available on or through any such site or resource.
|
|
|
Posting Rules
|
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
HTML code is Off
|
|
|
|