Nel mio caso gli script partono tutti da delle voci di menu e vanno a finire a delle gallerie e vorrei che si fermassero tutti nello stesso punto.
Spero di essere stato abbastanza chiaro e preciso!
Grazie a tutti!!
Questo è lo script
http://javascript.html.it/articoli/legg ... g-morbido/
Questo è il codice HTML
- Codice: Seleziona tutto
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="PORTFOLIO.css" rel="stylesheet" type="text/css" />
<title>Lucaeffe.it</title>
<script src="smoothscroll_dl/smoothscroll.js" type="text/javascript"></script>
[...]
<!-- jQuery lightBox plugin -->
<script type="text/javascript" src="JS/jquery-lightbox-0.5/js/jquery.js"></script>
<script type="text/javascript" src="JS/jquery-lightbox-0.5/js/jquery.lightbox-0.5.js"></script>
<link rel="stylesheet" type="text/css" href="JS/jquery-lightbox-0.5/css/jquery.lightbox-0.5.css" media="screen" />
<script type="text/javascript">
$(function() {
$('#gallery a').lightBox();
});
</script>
<!--fine jQuery lightBox plugin -->
<!-- inizio jQuery w.slide plugin -->
<script src="JS/jquery-lightbox-0.5/jquery/jquery.wslide.js"type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
$("#parent2").wslide({
width: 750,
height: 250,
fade: true,
duration: 2000
});
});
</script>
<script type="text/javascript" src="JS/easySlider/easySlider/js/easySlider.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#slider").easySlider({
prevText: 'Previous Slide',
prevId: 'prevBtn',
nextText: 'Next Slide',
nextId: 'nextBtn',
orientation: 'horizontal'
});
$("#slider2").easySlider({
prevText: 'Previous Slide',
prevId: 'prevBtn2',
nextText: 'Next Slide',
nextId: 'nextBtn2',
});
$("#slider3").easySlider({
prevText: 'Previous Slide',
prevId: 'prevBut2',
nextText: 'Next Slide',
nextId: 'nextBut2',
});
});
</script>
<style type="text/css">
/* jQuery lightBox plugin - Gallery style */
#gallery{
margin:250px 0 0 0;
width:100%;
height:3000px;
text-decoration:none
}
#gallery a{
font-family:Arial, Helvetica, sans-serif;
color:#FFF;
text-decoration:none;
}
#gallery ul {
list-style: none;
padding:100px 0 0 50px;
margin:0 0 50px 0
}
#gallery ul li {
display: inline;
}
#gallery ul img {
margin:0 auto;
border: 5px solid #3e3e3e;
border-width:0;
}
#gallery ul a:hover img {
border: 1px solid none;
border-width:0;
color: #fff;
}
#gallery ul a:hover { color: #fff;
}
</style>
<!-- inizio jQuery w.slide gallery -->
<style type="text/css" media="screen">
#parent2-menu{
text-decoration:none;
}
#parent2-menu li{
padding:30px 0 0 75px;
margin:0 auto;
}
#parent2 li{
margin:0;
padding: 20px 0 0 70px;
font-family:Arial, Helvetica, sans-serif;
color:#333;
font-size:12px;
}
#parent2-menu a{
text-decoration:none;
font:Arial, Helvetica, sans-serif;
color:#000;
}
#parent2-menu a:hover, #parent2-menu a.wactive{
text-decoration:none;
background: black;
color:#000;}
</style>
</head>
<body>
<a name="top"></a>
<div id="sfondo_fisso"></div>
<div id="container">
<div id="header">
<ul id="menu">
<li><a href="#p1"><strong>illustraction</strong></a></li>
<li><a href="#p2"><strong>web</strong></a></li>
<li><a href="#p3"><strong>logo</strong></a></li>
<li><a href="#p4"><strong>advertising</strong></a></li>
</ul>
<div id="barra_luminosa_centro"></div>
</div>
<div id="header2">
<ul class="welcome">
<li><a href="#parent2-1"><strong>Welcome</strong></a></li>
<li><a href="#parent2-2"><strong>About me</strong></a></li>
<li><a href="#parent2-3"><strong>Services</strong></a></li>
<li><a href="#p5"><strong>Contact</strong></a></li>
</ul>
<!-- testi per il w.slide-->
<ul id="parent2">
<li>
<h1><img src="Nuova cartella/image/welcometext.png" width="700" height="50" /></h1>
<strong>Ciao,sono Luca Faedda grafico,illustratore e web-designer.Attualmente vivo a Firenze.
Appassionato al mondo dell'illustrazione, graphic-design, grafica pubblicitaria e della programmzione di siti web e web-design.
L'obiettivo è quello di creare siti accessibili e dal design efficace con l'utilizzo di xHTML,CSS,JavaScript e Flash
con particolare attenzione agli standard dettati dalla W3C e al “cross-browser”; </strong></li>
<li><h1><strong><img src="Nuova cartella/image/aboutmetext.png" width="680" height="60" /></strong></h1>
<strong> Diplomato all'istituto Statale d'arte I.S.A.F.F. di sassari,
frequento ora l'Accademia delle arti digitali<span class="wait"><a href="http://www.scuolanemo.com/index.php?menu=6&umenu=FAQ's&page=FAQ's&am p;pagina=">NEMO NT.</a></span></strong></li>
<li><h1><img src="Nuova cartella/image/services.png" width="530" height="60" /></h1>
<strong>
Web design, realizzazione siti internet, xHtml, Css. Dal design allo sviluppo per il tuo sito sino
all'ottimizazzione sui motori di ricerca.
Illustrazioni su commissione,caricature,grafiche per t-shirt, skate, tavole da surf personalizzate.
Loghi, Brochure, volantini, business card per migliorare la tua immagine.
</li>
</ul>
</div>
<!-- fine testi per il w.slide-->
<!--inizio galleria -->
<div id="gallery">
<a name="p1"><div id="illustraction"><img src="Nuova cartella/image/illustractio.png" width="900" height="150" /></div><h2><a href="#top">^</a></h2></a><!-- ILLUSTRAZIONI -->
<div id="slider">
<ul>
<li>
<a href="JS/jquery-lightbox-0.5/photos/image1.jpg" title="Try to Get Me - stampa per tavola da surf">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image1.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image2.jpg" title="Contest 'crea il tuo natale' - Grafici creativi.it ">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image2.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image3.jpg" title="Brad Pitt - Burn after Reading">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image3.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image4.jpg" title="Prison Break">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image4.jpg" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image5.jpg" title="100 anni di storia dell'inter">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image5.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image6.jpg" title="Johnny Depp">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image6.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image7.jpg" title="Jason Schwartzman - Spun">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image7.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image8.jpg" title="The last word from this world-Vincenzo Basile">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image8.png" width="200" height="140" alt="" />
</a>
</li>
<li> <a href="JS/jquery-lightbox-0.5/photos/image1.jpg" title="Try to Get Me - stampa per tavola da surf">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image1.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image2.jpg" title="Contest 'crea il tuo natale' - Grafici creativi.it ">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image2.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image3.jpg" title="Brad Pitt - Burn after Reading">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image3.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image4.jpg" title="Prison Break">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image4.jpg" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image5.jpg" title="100 anni di storia dell'inter">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image5.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image6.jpg" title="Johnny Depp">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image6.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image7.jpg" title="Jason Schwartzman - Spun">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image7.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image8.jpg" title="The last word from this world-Vincenzo Basile">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image8.png" width="200" height="140" alt="" />
</a>
</li>
</ul>
</div>
<a name="p2"><div id="advertising"><img src="Nuova cartella/image/WEB.png" width="900" height="170" /></div><h2><a href="#top">^</a></h2></a> <!-- WEB TEMPLATES -->
<div id="slider2">
<ul>
<li>
<a href="JS/jquery-lightbox-0.5/photos/image17.jpg" title="Vincenzo Corda HairStylist">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image17.png" width="430" height="280" alt="" /> </a>
<img src="JS/jquery-lightbox-0.5/photos/web_comm.png" width="335" height="280" />
</li>
<li>
<a href="JS/jquery-lightbox-0.5/photos/image22.jpg" title="Polliceverde.it">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image22.png" width="430" height="280" alt="" /> </a>
<img src="JS/jquery-lightbox-0.5/photos/web_comm2.png" width="335" height="280" />
</li>
</ul>
</div>
<a name="p3"><div id="advertising"><img src="Nuova cartella/image/logos.png" width="900" height="152" /></div><h2><a href="#top">^</a></h2></a><!-- LOGO -->
<ul>
<li>
<a href="JS/jquery-lightbox-0.5/photos/image18.jpg" title="contest 'lovely crociere' grafici creativi.it">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image18.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image19.jpg" title="Nemoland-dietro le quinte della fantascienza e del fantasy">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image19.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image20.jpg" title="lucaeffe logo">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image20.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image23.jpg" title="NEMO NT - Colori puri">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image23.png" width="200" height="140" alt="" />
</a>
<img src="JS/jquery-lightbox-0.5/photos/thumb_image21.png" width="200" height="140" alt="" />
</a>
<img src="JS/jquery-lightbox-0.5/photos/thumb_image21.png" width="200" height="140" alt="" />
</a>
<img src="JS/jquery-lightbox-0.5/photos/thumb_image21.png" width="200" height="140" alt="" />
</a>
<img src="JS/jquery-lightbox-0.5/photos/thumb_image21.png" width="200" height="140" alt="" />
</a>
</li>
</ul>
<a name="p4"><div id="advertising"><img src="Nuova cartella/image/advertising.png" width="915" height="150" /></div><h2><a href="#top">^</a></h2></a><!-- ADVERTISING -->
<ul>
<li>
<a href="JS/jquery-lightbox-0.5/photos/image9.jpg" title="esercizi di sintesi - China">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image9.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image10.jpg" title="esercizi di sintesi - Musica">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image10.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image11.jpg" title="esercizi di sintesi - Mare">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image11.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image12.jpg" title="esercizi di sintesi - Estate">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image12.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image13.jpg" title="esercizi - Carattere come immagine">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image13.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image14.jpg" title="esercizi di reinterpretazione - Pin up '50">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image14.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image15.jpg" title="esercizi di reinterpretazione - Pop Art">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image15.png" width="200" height="140" alt="" />
</a>
<a href="JS/jquery-lightbox-0.5/photos/image16.jpg" title="contest 'No al Fumo' Grafici creativi.it">
<img src="JS/jquery-lightbox-0.5/photos/thumb_image16.png" width="200" height="140" alt="" />
</a>
</li>
</ul>
</div>
<div id="contact_me"></div>
<div id="modulo"><form id="contact" method="post" action="">
<div>
<label for="email"></label>
<div class="input-cont"><input type="text" id="email" name="email"></div>
<label for="nome"></label>
<div class="input-cont"><input type="text" id="nome" name="nome" size="20"></div>
<label for="message"></label>
<div class="input-cont"><input type="text" id="object" name="object"></div>
<label for="message"></label>
<div class="textarea-cont">
<textarea id="message" name="message" rows=9 cols=20></textarea>
</div>
<button type="submit" id="go" value="invia">CLICK HERE TO E-MAIL ME</button>
</div>
</form> </div>
<a name="p5"></a>
</div>
</body>