Newsgroup: it.comp.lang.javascript
Titolo: immagine scoperta dal mouse

Cerco uno script che faccia questa cosa complicata.
Ho un'immagine e inizialmente e' coperta, passandoci il mouse sopra
vorrei che si scoprisse passo passo.
Come esempio prendete il gratta e vinci !
In google non so che parole cercare !
Aiuto !

tipo questo esempio, ma e' fatto in java
http://www.collaborando.it/files/java/gratta_e_vinci/gratta_e_vinci.htm

 
http://www.collaborando.it/files/java/gratta_e_vinci/gratta_e_vinci.htm
Se si tratta di "scoprire pian piano un'immagine quando il mouse ci passa
sopra", ma modello "slide" per intenderci, si puo' fare.
Ma per avere un effetto del tipo di cui hai postato il link adesso, devi
affidarti a java o flash. 
-- 
ZER0://coder.gfxer.web-designer/
~ Alcune persone sono ancora vive per il semplice motivo che e'
illegale ucciderle.

affidarti a java o flash. 
Qualcosa si puo' fare anche in Javascript, anche se forse i risultati
non sono allo stesso livello di quello che si puo' ottenere con Java.
Per esempio:
<html>
<head>
<style type="text/css">
.c{
  position:absolute;
  top:0px;
  left:0px;
  width:11px;
  height:11px;
  background-color:white;
  z-index:2;
}
.c1{
  position:absolute;
  top:0px;
  left:0px;
  width:100px;
  height:100px;
  background-color: trasparent;
  z-index:1;
}
.img{
  position:absolute;
  top:0px;
  left:0px;
  width:100px;
  height:100px;
  border:2px solid black;
  background-color: green;
  color:white;
  z-index:0;
}
</style>
<script type="text/javascript">
var ie = document.all;
var ns6 = document.getElementById && !document.all;
var nc=20; // nr. quadrati che ricoprono l'immagine
var ds=100; // dimensione immagine
var cs=ds/nc; // dimensione singolo quadrato
var mouseisdown=false;
function hide(x,y){
 var el=document.getElementById(x+","+y);
 if(el != null){
	el.style.display="none";
 }
}
function hideblock(x,y){
 for(j=(x-1);j<=(x+1);j++){
 	for(i=(y-1);i<=(y+1);i++){
		hide(j,i);
	}
 }
 hide(x-2,y);
 hide(x+2,y);
 hide(x,y+2);
 hide(x,y-2);
}
function gratta(event){ 
 var firedobj = ns6 ? event.target : event.srcElement;
 var topelement = ns6 ? "HTML" : "BODY";
 while (firedobj.tagName != topelement && firedobj.className != "c1"){
	firedobj = ns6 ? firedobj.parentNode : firedobj.parentElement;
 }
 if (firedobj.className == "c1"){
	x = ns6 ? event.clientX : event.clientX;
	y = ns6 ? event.clientY : event.clientY;
	xe=parseInt(x/cs);
	ye=parseInt(y/cs);
	hideblock(xe, ye);
	return true;
 }
 return false;
}
function mmove(ev){
 if (!ie && !ns6) return;
 if (mouseisdown){
	 if (gratta(ns6 ? ev : event)){
		return false;
	}
 }
}
function mdown(ev){
 if (!ie && !ns6) return;
 if (gratta(ns6 ? ev : event)){
	mouseisdown=true;
	return false;
 }
}
function ricopri(){
 for(var j=0;j<nc;j++){
	for(var i=0;i<nc;i++){
		c=document.getElementById(i+","+j);
		c.style.display="block";
	}
 }
}
function init(){
 var c1=document.getElementById("c1");
 for(var j=0;j<nc;j++){
 for(var i=0;i<nc;i++){
	c=document.createElement("div");
	c1.appendChild(c);
	c.className="c";
	c.style.left=i*cs+"px";
	c.style.top=j*cs+"px";
	c.style.width=parseInt(cs+1)+"px";
	c.style.height=parseInt(cs+1)+"px";
 
c.id
=i+","+j;
 }
 }
}
document.onmousedown = mdown;
document.onmousemove = mmove;
document.onmouseup = new Function("mouseisdown = false;");
</script>
</head>
<body onload="init();">
<div class="img">
<br/>
--You--<br/>
<br/>
--Lose--<br/>
</div>
<div class="c1" id="c1"></div>
<div><br/><br/><br/><br/><br/><br/>
Fare click con il mouse qui sopra<br/>
<a href="#" onclick="ricopri();return false;">ricopri</a>
</div>
</body>
</html>
Funziona con Mozilla 1.7 e IE 6.0
'bye

 Funziona con Mozilla 1.7 e IE 6.0
Si, ma qui siamo quasi ai livelli in cui mi mettevo a fare un poligono in
wireframe che ruotava in JS, o lo SCUMM: si puo' fare? Si. Ma ha senso solo
come esercizio di stile, in fondo. Si "piegano" e si "forzano" tecnologie
per fargli fare qualcosa per le quali non sono preposte.. E questo e'
"figo", ma non "pratico".
Soprattutto quando vi sono tecnologie proposte per questi scopi e ti danno
una maggiore compatibilita' (vedasi Flash, ad esempio).
Un po' come chi vuole fare, lato client, quello che andrebbe fatto lato
server.. o viceversa.
"The right tool for the right job".
Il tutto, ben inteso, IMVHO.
-- 
ZER0://coder.gfxer.web-designer/
~ "L'arte non riproduce cio' che e' visibile,ma rende visibile cio' che
non sempre lo e'" (Paul Klee)