far funzionare questo javaScript

**apprentice** · 11-01-2010, 04:11

rieccomi, il plugin in questione è il seguente:
http://fancybox.net/example
spero che nessuno vomiti vedendo il codice che ho prodotto..
ho fatto delle prove, seguendo le regole del sito di origine, poi aprendo la pagina in chrome e curiosando nei vari codici e apportando modifiche sempre con esito negativo, per evitare confusione posto la mia pagina pulita e gli stili (sopratutto per gli ultimi abbiate pietà è il mio primo sito

)

codice:

<body>
<div id="pagina">
  <div id="header">
    

[img]componenti/OM_logo-05.png[/img]</p>
  </div>
  <div id="navbar">
    <div id="home">home</div>
    <div id="pro">prodotti e servizi</div>
    <div id="port">portfolio</div>
    <div id="chi">chi sono</div>
    <div id="cont">contatti</div>
  </div>
  <div id="contenitore">
    <div id="contenitore2">
      <div id="spaziatore"></div>
      <div id="contenitore3">
        <div id="nuto">qui trova posto il contenuto</div>
        <div id="clear"></div>
      </div>
      <div id="filetto"></div>
    </div>
    <div id="footer">
      

home - prodotti e servizi - portfolio - chi sono - contatti

        powered by Omnigrafica 2010</p>
      <div id="fine"></div>
    </div>
  </div>
</div>
</body>

gli stili

codice:

@charset "UTF-8";
* {
	margin:0 0 0 0;
	font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
}
body {
	background-color: #000;
	
}
#pagina {
	position: absolute;
	background-image:url(../componenti/OM_sfondo.gif);
	background-repeat:repeat-y;
	left: 50%;
	margin:0 -600px;
	width: 1200px;
}
#header {
	background-image:url(../componenti/OM_sfondotop.png);
	background-repeat:no-repeat;
	height:155px;
}
#logo {
	margin-top: 35px;
	margin-left:100px;
}
/* ------- navigazione ------- */
#navbar {
	background-image: url(../componenti/OM_navbar.gif);
	height: 52px;
	width:1200px;
	position: relative;
	text-align: center;
	margin-bottom: 0px;
}
#home
{
	margin-left: 298px;
	float: left;
}
#pro {
	float: left;
}
#port {
	float: left;
}
#chi {
	float: left;
}
#cont {
	float: left;
}
a.link:hover {
	color:#CAE14D;
	text-shadow:0px 2px 2px #000;
}
a.link:active {
	padding-top:18px;
	height:35px;
	text-shadow:none;
}

a.link {
	display:block;
	position:relative;
	padding:17px 23px 0 23px;
	height:35px;
	color:#666;
	text-decoration:none;
}


/* -------- fine navigazione -------- */
#contenitore {
	background-image:url(../componenti/OM_sfondogiu.png);
	background-repeat:no-repeat;
	background-width:100%;
	background-height:100%;
	background-position:top;
	background-attachment:fixed;
	margin:0 auto 0 auto;
	padding:0 0 0 0;
}	
#contenitore2 {
	margin:0 auto 0 auto;
	background-image:url(../componenti/OM_luce.png);
	background-repeat:no-repeat;
	background-attachment:fixed;
	background-position:center 0px;
}
#spaziatore {
	height:10px;
	background-image:url(../componenti/OM_ombrabar.png);
}
#contenitore3 {
	width:960px;
	margin:0 0 0 100px;
	padding:10px 20px 0 20px;
	background-image:url(../componenti/Om_sfondonuto.png);
	background-repeat:repeat-y;
	border-bottom:solid #000;
	position:relative;
	border-bottom-width:1px;
	-webkit-border-top-right-radius: 15px;
	-webkit-border-top-left-radius: 15px;
	-moz-border-radius: 15px 15px 0 0;
}
.mano {
	float: left;
	margin:18px 40px 10px 30px;
}
h1 {
	color: #F90;
	text-shadow:0 2px 2px #000;
}
hr {
	color: #000;
}
#nuto {
	width:960px;
	position:relative;
	color: #FFF;
	text-align: left;
	padding:10px 0 10px 0;
	margin:0 auto o auto;
}
imput {
}
p {
	line-height: 2em;
	text-shadow:0px 1px 1px #000;
}
.testofirst {
	line-height: 2em;
	margin-top: 20px;
}
.campo  {
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:1em;
	margin-bottom: 10px;
	padding:0px 8px 2px 8px;
	background-color: #333;
	border:solid 1px #333;
	-webkit-border-top-right-radius: 8px;
	-webkit-border-top-left-radius: 8px;
	-webkit-border-bottom-left-radius: 0px;
	-webkit-border-bottom-right-radius: 0px;
	-moz-border-radius: 8px 8px 0px 0px;
	color:#FFF;
	-webkit-box-shadow: 1px 1px 3px #000;
	-moz-box-shadow: 1px 1px 3px #000;
}
#form1 {
	margin:20px 0;
}
.def {
	color:#999;
	text-shadow:0px 1px 1px #000;
}
imput:focus, textfield:focus {
	margin:20px 0;
	border-bottom:solid 1px #CAE14D
}
#clear {
	clear:both;
}
#filetto {
	width:1000px;
	height:1px;
	clear:both;
	margin:0 auto 0 auto;
	border-top-color:#CAE14D;
	border-top-style:solid;
	border-top-width:1px;
}
#footer {
	width:1000px; 
	background-color:#000;
	width:100%;
	margin-top:10px;
	padding-top:0.3em;
	padding-bottom:0.4em;
	color: #333;
	text-align:center;
	font-size: 0.7em;
	line-height: 1.2em;
}
#footer p a {
	text-decoration: none;
	color: #333;
	display: inline;
}
#footer p a:hover {
	text-decoration: underline;
}
#navgiu {
	display:block;
	border-bottom:solid 1px #333;
}
#fine {
	height:15px;
}
/* ------- aggiusutamenti compatibilità ------- */
a img {
	border: 0;
}
a:focus {
	outline: 0;
}

**apprentice** · 11-01-2010, 19:37

vi prego aiuatatemi!! non riesco a capire come far partire il plugin!! ho seguito tutte le istruzioni cercato di capire i tutorial di jQuery, ma non sono riuscito a cavare un plug dal buco

!!
vi prego davvero ditemi anche solo dove posso trovare una guida comprensibile!!
grazie mille!

**apprentice** · 11-01-2010, 23:09

ok scusate, credo che evidentemente facevo un errore stupido nello scrivere ora riesco a far funzionare il tutto!!

Discussione: far funzionare questo javaScript

Strumenti discussione

Ricerca discussione

Visualizza

far funzionare questo javaScript

Permessi di invio