Boas pessoal,
andava a procura de um script que encontrei a pouco no jsfiddle e editei a meu gosto e esta a funcionar pela plataforma mas quando passo para os ficheiros não funciona, alguem me pode ajudar a passar o código para ficheiro físico? acho que o jsfiddle não tem opção de download.
O HTML apresenta as caixas no sitio onde o CSS manda mas não executa o Javascript.
O ficheiro é este: https://jsfiddle.net/RVPF/839us559/2/
O ficheiro que criei foi este:
Código :
Código ajeitado com a ajuda do user KTachyon:
Código :
sou novo por aqui caso tenha algum erro na secção ou por outro motivo peço desde já desculpa e que me indiquem onde postar, obrigado![;)]()
Fico a espera da vossa ajuda, obrigado![:D]()
andava a procura de um script que encontrei a pouco no jsfiddle e editei a meu gosto e esta a funcionar pela plataforma mas quando passo para os ficheiros não funciona, alguem me pode ajudar a passar o código para ficheiro físico? acho que o jsfiddle não tem opção de download.
O HTML apresenta as caixas no sitio onde o CSS manda mas não executa o Javascript.
O ficheiro é este: https://jsfiddle.net/RVPF/839us559/2/
O ficheiro que criei foi este:
Código :
<html>
<head>
<script type="text/Javascript">
$("#R").animate({left: '10%', top: '10%'}, 1000);
$("#V").animate({left: '80%', top: '10%'}, 1000);
$("#P").animate({left: '10%', top: '80%'}, 1000);
$("#F").animate({left: '80%', top: '80%'}, 1000);
</script>
<style type="text/css">
#R {
position:absolute;
top:40%;
left:45%;
}
#V {
position:absolute;
top:40%;
left:55%;
}
#P {
position:absolute;
top:55%;
left:45%;
}
#F {
position:absolute;
top:55%;
left:55%;
}
</style>
</head>
<body>
<div id="R" style="width: 100px; height: 100px; border: solid 1px red; position: absolute;">R</div>
<div id="V" style="width: 100px; height: 100px; border: solid 1px red; position: absolute;">V</div>
<div id="P" style="width: 100px; height: 100px; border: solid 1px red; position: absolute;">P</div>
<div id="F" style="width: 100px; height: 100px; border: solid 1px red; position: absolute;">F</div>
</body>
</html>
<head>
<script type="text/Javascript">
$("#R").animate({left: '10%', top: '10%'}, 1000);
$("#V").animate({left: '80%', top: '10%'}, 1000);
$("#P").animate({left: '10%', top: '80%'}, 1000);
$("#F").animate({left: '80%', top: '80%'}, 1000);
</script>
<style type="text/css">
#R {
position:absolute;
top:40%;
left:45%;
}
#V {
position:absolute;
top:40%;
left:55%;
}
#P {
position:absolute;
top:55%;
left:45%;
}
#F {
position:absolute;
top:55%;
left:55%;
}
</style>
</head>
<body>
<div id="R" style="width: 100px; height: 100px; border: solid 1px red; position: absolute;">R</div>
<div id="V" style="width: 100px; height: 100px; border: solid 1px red; position: absolute;">V</div>
<div id="P" style="width: 100px; height: 100px; border: solid 1px red; position: absolute;">P</div>
<div id="F" style="width: 100px; height: 100px; border: solid 1px red; position: absolute;">F</div>
</body>
</html>
Código ajeitado com a ajuda do user KTachyon:
Código :
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/Javascript">
$(window).load(function() {
$("#R").animate({left: '10%', top: '10%'}, 1000);
$("#V").animate({left: '80%', top: '10%'}, 1000);
$("#P").animate({left: '10%', top: '80%'}, 1000);
$("#F").animate({left: '80%', top: '80%'}, 1000);
});
</script>
<style type="text/css">
#R {
position:absolute;
top:40%;
left:45%;
}
#V {
position:absolute;
top:40%;
left:55%;
}
#P {
position:absolute;
top:55%;
left:45%;
}
#F {
position:absolute;
top:55%;
left:55%;
}
</style>[/font]
[font=arial, helvetica, sans-serif]</head>
<body>
<div id="R" style="width: 100px; height: 100px; border: solid 1px red; position: absolute;">R</div>
<div id="V" style="width: 100px; height: 100px; border: solid 1px red; position: absolute;">V</div>
<div id="P" style="width: 100px; height: 100px; border: solid 1px red; position: absolute;">P</div>
<div id="F" style="width: 100px; height: 100px; border: solid 1px red; position: absolute;">F</div>
</body>
</html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/Javascript">
$(window).load(function() {
$("#R").animate({left: '10%', top: '10%'}, 1000);
$("#V").animate({left: '80%', top: '10%'}, 1000);
$("#P").animate({left: '10%', top: '80%'}, 1000);
$("#F").animate({left: '80%', top: '80%'}, 1000);
});
</script>
<style type="text/css">
#R {
position:absolute;
top:40%;
left:45%;
}
#V {
position:absolute;
top:40%;
left:55%;
}
#P {
position:absolute;
top:55%;
left:45%;
}
#F {
position:absolute;
top:55%;
left:55%;
}
</style>[/font]
[font=arial, helvetica, sans-serif]</head>
<body>
<div id="R" style="width: 100px; height: 100px; border: solid 1px red; position: absolute;">R</div>
<div id="V" style="width: 100px; height: 100px; border: solid 1px red; position: absolute;">V</div>
<div id="P" style="width: 100px; height: 100px; border: solid 1px red; position: absolute;">P</div>
<div id="F" style="width: 100px; height: 100px; border: solid 1px red; position: absolute;">F</div>
</body>
</html>
sou novo por aqui caso tenha algum erro na secção ou por outro motivo peço desde já desculpa e que me indiquem onde postar, obrigado
Fico a espera da vossa ajuda, obrigado
