Anaglyph 3D: Present text and images ready for 3D viewing

Recommend this page to a friend!
     
  Info   Example   Demos   View files Files   Download Download   Reputation   Support forum   Blog    
Ratings Unique User Downloads Download Rankings
Not enough user ratingsTotal: 400 All time: 86 This week: 4Up
Version License JavaScript version Categories
anaglyph-3d 1.0BSD License1.0Graphics, 3D
Description 

Author

Arturs Sosins

This object can present text and images ready for 3D viewing.

It can present text inside a given page element to appear with shadow effects in different colors, making it appear with 3D perspective when you use 3D glasses.

The object can also take two perspectives of the same picture and combine them in a canvas object that makes them appear with a 3D perspective.

Picture of Arturs Sosins
  Performance   Level  
Name: Arturs Sosins <contact>
Classes: 51 packages by
Country: United States United States
Age: 36
All time rank: 1
Week rank: 6 Down

Level 4 StarStarStarStar

 Innovation award
Innovation award
Nominee: 8x

Winner: 6x

Example

<!DOCTYPE html>
<!--
/*************************************************************
 * This script is developed by Arturs Sosins aka ar2rsawseen, http://webcodingeasy.com
 * Feel free to distribute and modify code, but keep reference to its creator
 *
 * Anaglyph3D class creates a stereoscopic 3D effect for images or texts 
 * by means of encoding each eye's image using filters of different colors .
 * It is possible to specify color filters for each eye to use, 
 * thus adapting image or text for all type of anaglyphic glasses.
 *
 * For more information, examples and online documentation visit: 
 * http://webcodingeasy.com/Javascript/Apply-anaglyph-3D-filter-using-Javascript
**************************************************************/
-->
<html>
<head>
<style>
p
{
	font-size: 120px;
}
</style>
</head>
<body>
<p id='red_green'>Red Green text</p>
<p id='red_blue'>Red Blue text</p>
<p id='red_cyan'>Red Cyan text</p>
<p id='magenta_green'>Magenta Green text</p>
<p id='magenta_cyan'>Magenta Cyan text</p>
<script type="text/javascript" src="./anaglyph3d.packed.js" ></script>
<script type="text/javascript">
//red green
var rg = new Anaglyph3D({
	left: "red",
	right: "green"
});
rg.text("red_green")

//red blue
var rb = new Anaglyph3D({
	left: "red",
	right: "blue"
}).text("red_blue");

//red cyan
var rc = new Anaglyph3D({
	left: "red",
	right: "cyan"
}).text("red_cyan");

//magenta green
var mg = new Anaglyph3D({
	left: "magenta",
	right: "green"
}).text("magenta_green");

//magenta cyan
var mc = new Anaglyph3D({
	left: "magenta",
	right: "cyan"
}).text("magenta_cyan");
</script>
</body>
</html>

  3d textExternal page   Photo exampleExternal page  
  Files folder image Files (6)  
File Role Description
Plain text file anaglyph3d.js Class Main class source
Plain text file anaglyph3d.packed.js Class Main class packed
Accessible without login Image file 1.jpg Data Left eye image for example
Accessible without login Image file 2.jpg Data Right eye image for example
Accessible without login Plain text file example_photo.html Example Example of 3d photo
Accessible without login Plain text file example_text.html Example Example of 3d text

Downloadanaglyph-3d-2012-09-10.zip 199KB
Downloadanaglyph-3d-2012-09-10.tar.gz 198KB
 Version Control Unique User Downloads Download Rankings  
 0%
Total:400
This week:0
All time:86
This week:4Up

  Applications that use this package  
Documentation and examples

Add link image If you know an application of this package, send a message to the author to add a link here.