Effetto lente di ingrandimento
ero interessato a tale javascript
Codice HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<style>
input,select{font-family:verdana;font-size:8pt}
</style>
<script language=javascript>
!--
var img = new Image()
var tinggi = 50
var lebar = 50
var zoom = 1
var flag=false
var lebarX = screen.width
var tinggiY = screen.height
img.src = "prova.gif"
document.write("<span id=span1 onmousemove=show() style=\"position:relative;height:" + img.height + ";width:" + img.width + ";\">")
document.write("<div id=id2 style=\"position:absolute;height:" + img.height + ";width:" + img.width + ";left:0;top:0;\">")
document.write("<img src=" + img.src + " style=\"filter:alpha(opacity=30)\">")
document.write("</div>")
document.write("<div id=id1 style=\"overflow:hidden;position:absolute;height:" + img.height + ";width:" + img.width + ";left:0;top:0;clip:rect(0 " + lebar + " " + tinggi + " 0)\">")
document.write("<img src=" + img.src + " height=" + img.height*zoom + " width=" + img.width*zoom + ">")
document.write("</div>")
document.write("</span>")
function ganti(what){
var angka = new Array();
angka[1] = 1
angka[2] = 1.5
angka[3] = 2
angka[4] = 3
if(what=='luas'){
if (form1.lkotak.selectedIndex) tinggi = lebar = form1.lkotak.selectedIndex * 50
}
if(what=='zoom'){
if (form1.bzoom.selectedIndex) zoom = angka[form1.bzoom.selectedIndex]
document.images(1).height = img.height*zoom
document.images(1).width = img.width*zoom
}
}
function show(){
var x = window.event.clientX + document.body.scrollLeft
var y = window.event.clientY + document.body.scrollTop
if(!flag){
document.all.span1.style.visibility = "visible"
document.all.id1.style.left=-x*(zoom-1)
document.all.id1.style.top=-y*(zoom-1)
document.all.id1.style.clip="rect(" + eval(y*zoom-tinggi/2) + " " + eval(x*zoom+lebar/2) + " " + eval(y*zoom+tinggi/2) + " " + eval(x*zoom-lebar/2) + ")"
document.all.id1.style.height = img.height - parseInt(document.all.id1.style.top)
document.all.id1.style.width = img.width - parseInt(document.all.id1.style.left)
}
}
-->
</script>
<!-- and put this on the BODY section -->
<body topmargin=0 leftmargin=0>
<p align=center>
<font face=verdana size=1>
<form name=form1>
<select name=lkotak onchange=ganti('luas')>
<option>--Luas Kotak--</option>
<option>50x50</option>
<option>100x100</option>
<option>150x150</option>
<option>200x200</option>
</select>
<select name=bzoom onchange=ganti('zoom')>
<option>--Zoom--</option>
<option>1x</option>
<option>1.5x</option>
<option>2x</option>
<option>3x</option>
</select>
</form>
</font>
</body>
http://www.allwebfree.it/listascript/34.html
Con ie funziona ma ci sono problemi coi colori con firefox non funziona :(
ne ho trovato 1 altro ancora + interessante avete idea di come possa essere realizzato?? :
http://www.museotaranto.it/necropoli/necropoli.html