• Revista PROGRAMAR: Já está disponível a edição #53 da revista programar. Faz já o download aqui!

asworm

mover de imagens

11 mensagens neste tópico

Boas... estou por aqui porque entretanto comecei a estudar javaScript, e tenho a seguinte duvida...

tenho uma imagem e queria que ela se movesse, ja tentei de tudo mas nao consigo chegar la...

document.img1.style.left=1000+"px";

tenho uma alert antes desta instrição e devolve sempre 100px...

gostava de saber porque razão nao está a atribuir o valor pretendido...

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Boas,

esse img1 duvido que funcione .. tens de fazer algo do género :

document.getElementById('img1').style.left=1000+"px";

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

e se o img1 ja for o id?

é que eu declarei o img1 como o id e nao como name para nao ter de usar o getelementbyid... mas secalhar tou a fazer mal...

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

e se o img1 ja for o id?

é que eu declarei o img1 como o id e nao como name para nao ter de usar o getelementbyid... mas secalhar tou a fazer mal...

Nesse caso o document não lá está a fazer nada

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

imagina que crias que essa imagem tivesse um efeito de movimento...

como o farias?

id="img1" name="moldura1"

desculpa a pergunta mas estou mesmo encrencado

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

estas a ver o site dos system of a down?

www.systemofadown.com

clicas em entrar e tal e quando mudas de separador uma imagem de fundo movimenta-se...

era isso mais ou memos, ,dar uma sensacao de movimento...

vou ver agora o link que me mandas-te

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Mas aquilo é 1 imagem só, e o que faz é rodar para os lados .. É mesmo isso que queres? Se for isso podes usar o jQuery ou outra framework que ja teem suporte para isso nativo

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

tipo...

a imagem mexe-se...

é isto que quero... mas nao percebo a programacao que la esta...

é tudo bué esquesito...

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
</head>
<script>
<!-- Beginning of JavaScript -

// CREDITS:
// Image-Runner by Urs Dudli and Peter Gehrig
// Copyright (c) 2000 Peter Gehrig and Urs Dudli. All rights reserved.
// Permission given to use the script provided that this notice remains as is.
// Additional scripts can be found at http://www.24fun.ch.
// info@24fun.ch
// 2/10/2000

// IMPORTANT:
// If you add this script to a script-library or script-archive
// you have to add a link to http://www.24fun.ch on the webpage
// where this script will be running.

// CONFIGURATION:
// You need only one image besides the script. You don't have
// to slice the image yourself! The script will do this job for you.
// Configure the script as follows:
// 1. 	Copy and paste the two script-blocks into your HTML-file:
// 		The first script-block should be inside the head-zone of your HTML-file.
//		The second script-block should be inside the body-zone.
// 2.	Put your image in the same directory as the HTML-file.
// 3. 	Configure the variables below:

// The width of your image (pixels)
var imgwidth=500

// The height of your image (pixels)
var imgheight=200

// The URL of the sliced image
var imgurl="ny9200.jpg"

// Final horizontal position of the image: distance to the left margin of the window
var x_finalpos=5

// Final vertical position of the image: distance to the top margin of the window
var y_finalpos=5

// Number of slices
var imgslices=20

// Speed of slices
var step=50
var pause=20

// Do not change the variables below
var marginright
var width_slice=Math.floor(imgwidth/imgslices)
var cliptop=0
var clipbottom=imgheight
var clipleft=0
var clipright=width_slice
var spannummer=0
var spannrbefore=0

function initiate() {
if (document.all) {
	moveslices_IE()
}
}

function moveslices_IE() {
var thisspan=eval("document.all.span"+spannummer+".style")
if (thisspan.posLeft>x_finalpos-width_slice) {
	thisspan.posLeft-=step
	var timer=setTimeout("moveslices_IE()",pause)
}
else if (spannummer<imgslices-1) {
	clearTimeout(timer)
	thisspan.posLeft=x_finalpos
	spannummer++
	var timer=setTimeout("moveslices_IE()",pause)
}
else {
	thisspan.posLeft=x_finalpos
	clearTimeout(timer)
}
}

// - End of JavaScript - -->
</script>
<body>
<body  onLoad="initiate()">

<script>
<!-- Beginning of JavaScript -
for (i=0;i<=imgslices-1;i++) {
marginright=screen.width+50
    document.write("<span id='span"+i+"' style='position:absolute;visibility:visible; left:"+marginright+"px;top:"+y_finalpos+"px;clip:rect("+cliptop+"px "+clipright+"px "+clipbottom+"px "+clipleft+"px)'>")
document.write("<img src='"+imgurl+"'>")
    document.write("</span>")
clipleft+=width_slice
clipright+=width_slice
}
// - End of JavaScript - -->
</script>
<p>
</body>

</html>

será queé preciso isto tudo para mudar a posicao da imagem?

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Sim, podes sempre encurtar fazendo à tua maneira e tirando os comentários e algum excesso de código que possa haver, mas basicamente é isso.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Crie uma conta ou ligue-se para comentar

Só membros podem comentar

Criar nova conta

Registe para ter uma conta na nossa comunidade. É fácil!


Registar nova conta

Entra

Já tem conta? Inicie sessão aqui.


Entrar Agora