DIR : /home/kozerus/public_html/wz/wz_trans.html
/home/kozerus/public_html/wz
<html>
<head>
<title>ce object proof of concept</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="/js/wz/newwalterzorn.css">
<style type="text/css">
<!--
body {
padding:40px;
}
-->
</style>
<script language="JavaScript" type="text/JavaScript">
<!--
debug = 0;
function toggle(){
debug = !debug;
}
//-->
</script>
</head>
<body>
<script language="JavaScript" src="/js/wz/wz_dragdrop.js" type="text/JavaScript"></script>
<script language="JavaScript" src="/js/wz/wz_library.js" type="text/JavaScript"></script>
<div id="Bloque" style="position:absolute; left:200px; top:225px; width:88px; height:83px; z-index:1; background-color: #000099; layer-background-color: #000099; border: 1px none #000000;"></div>
<p align="center">
<br>
<big><b>Timed Smooth Transitions</b></big>
<br>
An additional JavaScript module written by <b>Carlos Chiari</b>
</p>
<p align="center">
<a href="demos.htm" target="_top">Back, Zurück</a>
</p>
<table width="500" border="0" cellpadding="6" cellspacing="0">
<tr>
<td>
Click on "getValues" to retrieve the current size and position of the darkblue draggable layer.
Fill in the desired values and click on "Transform" to resize or move the layer.
</td>
</tr>
<tr>
<td>
<form name="form1" method="post" action="">
<table width="113" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="center"> </td>
<td align="center"> </td>
</tr>
<tr>
<td align="center"><strong>x</strong></td>
<td align="center"> <input name="x" type="text" id="x" size="5"></td>
</tr>
<tr>
<td align="center"><strong>y</strong></td>
<td align="center"> <input name="y" type="text" id="y" size="5"></td>
</tr>
<tr>
<td align="center"> </td>
<td align="center"> </td>
</tr>
<tr>
<td align="center"><strong>w</strong></td>
<td align="center"> <input name="w" type="text" id="w" size="5"></td>
</tr>
<tr>
<td align="center"><strong>h</strong></td>
<td align="center"> <input name="h" type="text" id="h" size="5"></td>
</tr>
<tr>
<td align="center"> </td>
<td align="center"> </td>
</tr>
<tr>
<td align="center"><div align="right">
<input name="debug" type="checkbox" id="debug" value="1" onChange="toggle();">
</div></td>
<td align="center"><strong><font color="#000000" size="2" face="Verdana, Arial, Helvetica, sans-serif">debug?</font></strong></td>
</tr>
<tr>
<td colspan="2" align="center">
<table>
<tr>
<td><input type="button" class="bt2" onClick="o= dd.elements['Bloque']; document.forms[0].x.value=o.x; document.forms[0].y.value=o.y;document.forms[0].w.value=o.w;document.forms[0].h.value=o.h" value="getValues"></td>
</tr>
<tr>
<td colspan="2"><input type="button" class="bt2" onClick="executeTest();" value="Transform"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>
</form>
</td>
</tr>
<tr>
<td>
<big><b>How to Include</b></big>
<br>
It's recommended to include this library for timed smooth transitions, ce_wz_library.js, immediately after wz_dragdrop.js, and both these <b>immediately after the opening <body> tag</b>.
</td>
</tr>
<tr>
<td>
<br> <br> <br>
<big><b>Download</b></big>
<br>
Module for timed smooth transitions, ce_wz_library.js:
<br>
<a href="ce_wz_library.zip">ce_wz_library.zip</a>
<br>
<br>
DHTML & Drag&Drop Library (if you have not yet downloaded it):
<br>
<a href="../../scripts/wz_dragdrop.zip">wz_dragdrop.zip</a>
</td>
</tr>
</table>
<script type="text/javascript">
<!--
SET_DHTML('Bloque'+CURSOR_MOVE+RESIZABLE);
//-->
</script>
</body>
</html>
//
koh5_pano
Drag mouse to navigate.
Navigation
- Left/Right Mouse drag: Changes camera heading.
- Up/Sown Mouse drag: Changes camera pitch.
- Scroll wheel: Changes camera field of view.
- I-Key: Displays Info panel with canvas size, image size and FPS.
17.Aug.2010, Martin Wengenmayer