I have been trying to figure out a way to make a image zoom and pan using javascript. I have tried using all sorts of code from different web sites. I always get errors with finding the ts_zoom and things of that nature. I just don't know if I am not doing something right when using the .js files that you are supposed to reference. I am in great need of help!!!
Tek-Tips is the largest IT community on the Internet today!
Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!
-
Congratulations Rhinorhino on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!
Zoom and pan with javascript
- Thread starter Rollna01
- Start date
- Thread starter
- #2
that is one of the links that I am trying to get my image zooming to replicate. I just can never get my own image to show up.
We can't help you figure out what you're doing wrong if you don't show us what you're doing.
I.e., post some code and tell us what happens when you try it.
Dave
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
...east is east and west is west and if you take cranberries and stew them like applesauce
they taste much more like prunes than rhubarb does![[infinity]](/data/assets/smilies/infinity.gif "[infinity] [infinity]")
I.e., post some code and tell us what happens when you try it.
Dave
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
...east is east and west is west and if you take cranberries and stew them like applesauce
they taste much more like prunes than rhubarb does
- Thread starter
- #4
<html>
<head>
<title>Virtual Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" src = "dynapi.js"></script>
<script language="JavaScript" src = "tsapi.js"></script>
</head>
<body>
<br><br>
<center>
<script language='JavaScript'><!--
var tszoom = new ts_zoom(" tszoom.setBorder(1);
tszoom.setMaxZoom(2);
tszoom.initialRGNN( "0,0,1,1" )
tszoom.addInformation("To Zoom click on the image.\\nTo Pan click and hold the mouse while dragging.");
tszoom.addToPage();
//--></script>
<br>
<table border=0 cellspacing=10><tr><td valign=top>
<br>
<a href="javascript:tszoom.setRGN('.6,.6,.2,.2');">Zoom Target 1</a> | <a href="javascript:tszoom.setRGN('.1,.1,.7,.7');">Zoom Target 2</a><br><br>
<a href="javascript:tszoom.zoomIn();">Zoom In</a> | <a href="javascript:tszoom.zoomOut();">Zoom Out</a> | <a href="javascript:tszoom.reset();">Reset</a>
</td><td valign=top>
<table border=0>
<tr><td valign=center align=center><a href="javascript:tszoom.pan('leftup',1);">*</a></td><td valign=center align=center><a href="javascript:tszoom.pan('up',1);">*</a></td><td valign=center align=center><a href="javascript:tszoom.pan('rightup',1);">*</a></td></tr>
<tr><td valign=center align=center><a href="javascript:tszoom.pan('left',1);">*</a></td><td valign=center align=center>PAN</td><td valign=center align=center><a href="javascript:tszoom.pan('right',1);">*</a></td></tr>
<tr><td valign=center align=center><a href="javascript:tszoom.pan('leftdown',1);">*</a></td><td valign=center align=center><a href="javascript:tszoom.pan('down',1);">*</a></td><td valign=center align=center><a href="javascript:tszoom.pan('rightdown',1);">*</a></td></tr>
</table>
</td></tr></table>
</center>
</body>
</html>
----- this is my code, 1. I can't seem to get the picture to come up in anything but IE. 2. I can't get the full picture to be in the screen when I start viewing the page.
Thanks for the help
<head>
<title>Virtual Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" src = "dynapi.js"></script>
<script language="JavaScript" src = "tsapi.js"></script>
</head>
<body>
<br><br>
<center>
<script language='JavaScript'><!--
var tszoom = new ts_zoom(" tszoom.setBorder(1);
tszoom.setMaxZoom(2);
tszoom.initialRGNN( "0,0,1,1" )
tszoom.addInformation("To Zoom click on the image.\\nTo Pan click and hold the mouse while dragging.");
tszoom.addToPage();
//--></script>
<br>
<table border=0 cellspacing=10><tr><td valign=top>
<br>
<a href="javascript:tszoom.setRGN('.6,.6,.2,.2');">Zoom Target 1</a> | <a href="javascript:tszoom.setRGN('.1,.1,.7,.7');">Zoom Target 2</a><br><br>
<a href="javascript:tszoom.zoomIn();">Zoom In</a> | <a href="javascript:tszoom.zoomOut();">Zoom Out</a> | <a href="javascript:tszoom.reset();">Reset</a>
</td><td valign=top>
<table border=0>
<tr><td valign=center align=center><a href="javascript:tszoom.pan('leftup',1);">*</a></td><td valign=center align=center><a href="javascript:tszoom.pan('up',1);">*</a></td><td valign=center align=center><a href="javascript:tszoom.pan('rightup',1);">*</a></td></tr>
<tr><td valign=center align=center><a href="javascript:tszoom.pan('left',1);">*</a></td><td valign=center align=center>PAN</td><td valign=center align=center><a href="javascript:tszoom.pan('right',1);">*</a></td></tr>
<tr><td valign=center align=center><a href="javascript:tszoom.pan('leftdown',1);">*</a></td><td valign=center align=center><a href="javascript:tszoom.pan('down',1);">*</a></td><td valign=center align=center><a href="javascript:tszoom.pan('rightdown',1);">*</a></td></tr>
</table>
</td></tr></table>
</center>
</body>
</html>
----- this is my code, 1. I can't seem to get the picture to come up in anything but IE. 2. I can't get the full picture to be in the screen when I start viewing the page.
Thanks for the help
BillyRayPreachersSon
Programmer
Rollna01,
Did you solve this in the end?
Dan
[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
Did you solve this in the end?
Dan
[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
- Status
Similar threads
- Locked
- Question