Effetto transizione su immagini

federosso

Nuovo Utente
7 Feb 2006
2
0
0
è 2 giorni che sono dietro ad uno script ma non riesco a venirne fuori..
Premetto che javascript non è il mio punto forte.

Il problema è sulle virgolette
Ho scaricato uno script che mi pemette di ruotare le immagini
il problema è nato quando ho deciso di far aprire una finestra ridimensionata sull'immagine cliccata

allego il file per farti meglio un'idea:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Ristorante La Rambla</title>
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-color: #FFCC00;
}
-->
</style></head>
<body>
<script language="JavaScript1.2">

var slideshow_width='150px'
var slideshow_height='113px'
var pause=3000
//var slidebgcolor="#ffffff"
var slidebgcolor="#FFCC00"


var dropimages=new Array()
dropimages[0]="images/foto/small/staff_small.jpg"
dropimages[1]="images/foto/small/gruppo_small.jpg"
//dropimages[2]="test/03.gif"

var droplinks=new Array()
droplinks[0]="images/foto/big/staff_big.jpg"
droplinks[1]="images/foto/big/gruppo_big.jpg"
//droplinks[2]=""

var preloadedimages=new Array()
for (p=0;p<dropimages.length;p++)
{
preloadedimages[p]=new Image()
preloadedimages[p].src=dropimages[p]
}

var ie4=document.all
var dom=document.getElementById



if (ie4||dom)
document.write('<div style="position:relative;width:'+slideshow_width+';height:'+slideshow_height+';overflow:hidden"><div id="canvas0" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';background-color:'+slidebgcolor+';left:-'+slideshow_width+'"></div><div id="canvas1" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';background-color:'+slidebgcolor+';left:-'+slideshow_width+'"></div></div>')
else

// document.write('<a href="javascript:rotatelink()" onClick="javascript:popup()"><img name="defaultslide" src="'+dropimages[0]+'" border=0></a>')

document.write('<a href="javascript:rotatelink()"><img name="defaultslide" src="'+dropimages[0]+'" border=0></a>')

var curpos=parseInt(slideshow_width)*(-1)
var degree=10
var curcanvas="canvas0"
var curimageindex=linkindex=0
var nextimageindex=1


function movepic()
{
if (curpos<0)
{
curpos=Math.min(curpos+degree,0)
tempobj.style.left=curpos+"px"
}
else
{
clearInterval(dropslide)
nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1"
tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas)
var slideimage='<img src="'+dropimages[curimageindex]+'" border=0>'


// ---------------------- CODICE INCRIMINATO!!!-----------------------------

// funziona in parte
// lo script sottostante funziona solo che mi sbaglia a ingrandire le immagini: ipotizzando di avere l'immagine staff_small.jpg cliccandoci sopra non mi apre
staff_big.jpg ma mi apre un altra foto gruppo_big.jpg
tempobj.innerHTML=(droplinks[curimageindex]!="")? '<a href="'+droplinks[curimageindex]+'" target="_blank" onClick="javascript:popup()">'+slideimage+'</a>' : slideimage


// ho provato a metterci le mani ma con scarsi risultati
// tempobj.innerHTML=(droplinks[curimageindex]!="")? '<a href="#" onClick="window.open("+droplinks[curimageindex]+",width="640", height="480");">'+slideimage+'</a>' : slideimage

//tempobj.innerHTML=(droplinks[curimageindex]!="")? '<a href="#" onClick='+"window.open('','','');"+'>'+slideimage+'</a>' : slideimage

// -------------------------------------------------------------------------





nextimageindex=(nextimageindex<dropimages.length-1)? nextimageindex+1 : 0
setTimeout("rotateimage()",pause)
}
}

function rotateimage()
{
if (ie4||dom)
{
resetit(curcanvas)
var crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)
crossobj.style.zIndex++
var temp='setInterval("movepic()",50)'
dropslide=eval(temp)
curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0"
}
else
document.images.defaultslide.src=dropimages[curimageindex]
linkindex=curimageindex
curimageindex=(curimageindex<dropimages.length-1)? curimageindex+1 : 0
}

function rotatelink()
{
if (droplinks[linkindex]!="")
window.location=droplinks[linkindex]
}

function resetit(what)
{
curpos=parseInt(slideshow_width)*(-1)
var crossobj=ie4? eval("document.all."+what) : document.getElementById(what)
crossobj.style.left=curpos+"px"
}


// funzione applicata all'avvio della pagina
function startit()
{
var crossobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)
crossobj.innerHTML='<a href="'+droplinks[curimageindex]+'" target="_blank"><img src="'+dropimages[curimageindex]+'" border=0></a>'
// crossobj.innerHTML='<a href="#" onClick="javascript:popup()"><img src="'+dropimages[curimageindex]+'" border=0></a>'
rotateimage()
}

function popup()
{
var w = 640;
var h = 480;
var l = Math.floor((screen.width-w)/2);
var t = Math.floor((screen.height-h)/2);
window.open(""+droplinks[curimageindex]+"","","width=" + w + ",height=" + h + ",top=" + t + ",left=" + l);
}


if (ie4||dom)
window.onload=startit
else
setInterval("rotateimage()",pause)



</script>

</body>
</html>


Ti ringrazio in anticipo..
Ciao Federosso
 
Discussioni simili
Autore Titolo Forum Risposte Data
J Aggiunta di un effetto di transizione al plugin Quick Pager jQuery 0
V Applicare un effetto di transizione tra due activity Sviluppo app per Android 1
G Eliminare l'effetto refresh di una pagina internet PHP 8
E telecamera effetto nebbia IP Cam e Videosorveglianza 0
S [Photoshop] Nome di questo effetto (vedi foto) Photoshop 1
S [HTML] Effetto su testo da togliere HTML e CSS 0
F [Photoshop] Effetto "vetro" Photoshop 1
A [Photoshop] come poter realizzare il seguente "effetto" Photoshop 4
P [Photoshop CC] Come posso creare quest'effetto - cerchi concentrici Windows e Software 6
P [Photoshop] Effetto ombra Photoshop 1
R [HTML] Effetto carousel di testo su immagine fissa HTML e CSS 2
trattorino [Javascript] effetto carino sul click mi aiutate? Javascript 1
Andrea_Ventura [HTML] Problemi con effetto hover HTML e CSS 5
M [Photoshop] Come posso creare questo effetto ? Photoshop 2
T [Javascript] identico carousel con effetto fade: in una pagina va in un'altra no, mistero? Javascript 3
I Effetto glowing su immagine con GIMP Webdesign e Grafica 0
MimmoMandrillo [Photoshop] Che effetto è questo? Photoshop 3
R [Photoshop] Come creare questo effetto (v.immagine)?(sovrapposizione immagini in modo uniforme) Photoshop 2
D [Photoshop] Come arrivare a questo effetto? Photoshop 4
S [Photoshop] aiuto effetto glitch scanner (scanner art) Photoshop 1
A Effetto hue-rotate con javascript Javascript 2
elpirata Creare scritte flash effetto dinamico Flash 2
A [HTML] Menu con effetto slide down HTML e CSS 0
M [HTML] Slideshow immagini con effetto FADE HTML e CSS 2
F [HTML] Navbar interferisce con codice per effetto parallax HTML e CSS 2
D effetto con adobe muse Windows e Software 1
X [Photoshop] Cercasi strumento per ottenere un semplice effetto. Photoshop 6
F [HTML] Effetto fade su ogni immagine contenute in uno slider HTML e CSS 16
S [HTML] Effetto hover in un div HTML e CSS 6
M [Photoshop] come realizzare un effetto speciale? Photoshop 1
D [HTML] Sfondo-Background fisso ma non troppo con effetto in movimento HTML e CSS 4
R [HTML] Pulsante con effetto dissolvenza (fading) HTML e CSS 10
trattorino [Javascript] caricamento immagine con effetto fade Javascript 1
R Effetto sul testo Javascript 3
K Effetto psichedelico Flash 0
G Effetto mosso tipo calce. Photoshop 1
P Effetto spruzzo di profumo Photoshop 1
L effetto galleria popup (immagini) jQuery 1
M effetto del testo css HTML e CSS 1
Z Effetto pennello con Flash Flash 0
P Visualizzare video mp4 con effetto lightbox jQuery 1
L Effetto fade a div Javascript 1
L Effetto hover con jquery jQuery 2
F effetto movimento immagini jquery jQuery 3
matteoraggi Come si fa a ricreare l'effetto dei pesciolini? WordPress 3
F Effetto comparsa header Javascript 2
F mappa jquery con effetto hover + fancybox Javascript 1
F Come si chiama questo effetto hover? Javascript 1
J effetto sliding dors come cover per entrare in un sito JQ Javascript 0
D Effetto foto come quella di Mika Photoshop 1

Discussioni simili