<!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=utf-8" />
<title>Immagine in movimento</title>
<style type="text/css">
body{ background:rgb(255,220,220)}
#container{ position:relative; margin:20px auto; width:350px; height:250px; /*border:1px solid;*/ }
#box{ position: absolute; top:0; left:0; width:350px; height:250px; overflow: hidden; }
</style>
<script type="text/javascript" src="jquery-1.7.1.min.js"> </script>
<script type="text/javascript" src="Muovi_Img.js"> </script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery(function($){
$("#box").MuoviImg(6000); // the argument set the movement-speed of the image
});
});
</script>
</head>
<body>
<h2>Immagine in movimento</h2>
<p>
You can set the movement speed of the image in the only one parameter. <br />
Try to put the mouse on the image. <b>You need jQuery library</b>
</p>
<div id="container">
<div id="box"> <img src="Image.jpg" /> </div>
</div><!-- container-->
</body>
</html>
|
Download
