<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1' />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="cssmenu/styles.css">
<script src="
http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script src="script.js"></script>
<title>Progetto</title>
<script language="javascript" src="javascript/jquery-1.7.2.min.js"></script>
<script>
var wrapper;
var slides;
var captions;
var indice;
function sliding(){
var slide;
indice=indice+1;
if(indice==6)
{
indice=0;
}
slideOld=slides.eq(indice-1);
slideOld.fadeOut(2000);
slide=slides.eq(indice);
slide.fadeIn(2000,function(){
setTimeout('sliding()',1000);
});
}
$(document).ready(function(){
wrapper=$('#slideshow-wrapper');
slides=$('div.slide');
captions=$('div.caption');
indice=-1;
sliding();
});
</script>
<style>
body { background: url(imm/Sfondo.jpg) no-repeat center 0px; padding-top:20px;}
div#head{
width:100%;
height:220px;
background-image:url(imm/Head12.jpg);
background-repeat: no-repeat;
padding-bottom: 5px;
}
div#container{
width: 852px;
height: 100%;
margin: 0px auto;
}
div#display{
float: left;
overflow: Auto;
height: 640px;
width: 840px;
margin: 0px;
padding: 5px;
background-image: url(imm/display1.png);
scrollbar-base-color: #000000;
scrollbar-arrow-color: #CCCCCC;
scrollbar-track-color: #CCCCCC;
}
div#footer{
width: 850px;
text-align:center;
font-size: 10px;
background-color: grey;
display: block;
}
div#center {
float: left;
background-image: url(images/TextureNanosuit.png);
height: 437px;
width:600px;
margin:0 auto;
padding:0;
}
div#slideshow{
width:600px;
height:437px;
position:relative;
top:20px;
left:16px;
padding:0;
}
div#slideshow-wrapper{
position:absolute;
width:600px;
height:380px;
}
div#slideshow-wrapper .slide{
position:absolute;
left:0;
top:0;
display: none;
}
div#slideshow-wrapper .slide .caption {
width: 200px;
height: 460px;
position: absolute;
left:0;
top:0;
background: rgba(0,0,0,0.6);
color: white;
font-family: Arial;
font-size: 12px;
padding: 10px;
}
div#slideshow-wrapper h3{
font-size: 18px;
}
div#slideshow-wrapper p {
font-size: 12px;
text-align: justify;
line-height:16px;
}
</style>
<script src="
http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="loader.js"></script>
</head>
<body >
<div id="container">
<div id="head">
</div>
<div id="page">
<div id='cssmenu'>
<ul>
<li><a href='index.html' id="home" title="Home"><span>Home</span></a></li>
<li><a href='Chisiamo.html' id="ChiSiamo" title="Chisiamo"><span>Chi Siamo</span></a></li>
<li><a href='Contatti.html' id="Contatti" title="Contatti"><span>Contatti</span></a></li>
<li><a href='Servizi.html' id="Servizi" title="Servizi"><span>Servizi</span></a></li>
<li><a href='Progetti.html' id="Progetti" title="Progetti"><span>Progetti</span></a></li>
<li><a href='Sudinoi.html' id="Sudinoi" title="Su di noi"><span>Su di noi</span></a></li>
<li class='last'><a href='Photogallery.html' id="Photogalley" title="Photo-gallery"><span>Photo-Gallery</span></a></li>
</ul>
</div>
<div id="display">
<h1>Photo gallery</h1>
<div id="center">
<div id="slideshow">
<div id="slideshow-wrapper">
<div class="slide s1">
<img src="immaginimarco/1.jpg">
<div class="caption">
<h3>Title</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi
ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.</p>
</div>
</div>
<div class="slide s2">
<img src="immaginimarco/2.jpg">
<div class="caption">
<h3>Title</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi
ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.</p>
</div>
</div>
<div class="slide s3">
<img src="immaginimarco/3.jpg">
<div class="caption">
<h3>title</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi
ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.</p>
</div>
</div>
<div class="slide s4">
<img src="immaginimarco/4.jpg">
<div class="caption">
<h3>Title</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi
ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.</p>
</div>
</div>
<div class="slide s5">
<img src="immaginimarco/5.jpg">
<div class="caption">
<h3>Title</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi
ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.</p>
</div>
</div>
<div class="slide s6">
<img src="immaginimarco/6.jpg">
<div class="caption">
<h3>Title</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi
ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.</p>
</div>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="engine1/wowslider.js"></script>
<script type="text/javascript" src="engine1/script.js"></script>
</div>
<div class="clear"></div>
<div id="footer">
<font color=white><p>Posted by: Marco Osio</p><p>Contact information: <a href="mailto:marcoosio@alice.it">
marcoosio@alice.it</a></p></font>
</div>
</div>
</div>
<script src="
http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="loader.js"></script>
</body>
</html>
