<!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>
|
Download
