Didascalia insieme a slide show 
Autor: Samuele Z.
Visitado 2977,
Seguidores 1,
Compartilhado 0
Buongiorno, ho un quesito che vorrei sottoporre. Navigando in internet ho trovoato molto interessante questo sito di cui vi riporto il link (http://www.pasticceriamorlacchi.it/). E' un sito di una pasticceria... la cosa che mi ha colpito è l'itestazione del sito, dove mentre appaiono le foto compare anche una piccola descrizione... Vorrei capire come posso realizzare questo tipo di effeto in WEB SITE.... Io sono riuscito solo a fare scorrele le foto con lo slide show ma non riscesco a fare apparire una descizione cone effetto dissolvenza come nel sito che vi ho sopra indicato.
Grazie.
Samuele.
Publicado em
ciao,
... devi fare tu una ricerca in rete, nel mondo jQuery, ed una volta trovata la risorsa, studiarla a dovere ed iniziare a pubblicarla per capirne la base;... una volta fatto ciò, per implementarla in WebSiteX5 devi intercettare i codici posizionati in HEAD e nel BODY, e riportarli nelle stesse posizioni delle sezioni ESPERTO, per cui occorre essere appunto esperti, ed uppare tutte le risorse accessorie ed a servizio dello slideshow direttamente nella radice del sito con programma FTP alternativo...
...
... quando avrai trovato ed iniziato a provare, pubblica l'esempio m posta il LINK sia della fonte che della tua pagina in modo che possa essere verificato e valutato in merito agli interventi da fare da parte di qualcun esperto in codici esterni...
.
ciao, KolAsim
Autor
Ciao KolAsim,
facendo delle ricerche in internet sul mondo jquery ho trovato un programma di prova intuitivo che crea una jquery avendo poca conoscienza del linguaggio html....
Nel mio caso ho preso tre foto di piatti è ho indicato una descrizione...... simile al link della pasticceria che ti dicevo.....
questo programma mi ha generato due file html che si chiamano (index.html e iframe_index.html) di seguito ti riporto la sorgente dei file... Questo programma mi crea prorpio quello che volevo.... In allegato ti lascio un file zip con dentro tre foto e i due file html che ti dicevo...... una volta zippato devi spostare i due file html sul desktop così quando li clicchi vedi la Jqueri che ho creato ( devi spostare solo i due file html sul desktop lasciando nella cartella cibo le tre foto perchè se no non trova i vari link foto...) Ora ho bisogno del tuo aiuto per capire come importare questo linquaggio html in web site realizzando i collegamenti foto giusti.... TI PREGO AIUTAMI!!!! SONO NELLE TUE MANI.....
filie index.html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>WOWSlider generated by WOWSlider.com</title><meta http-equiv="content-type" content="text/html; charset=utf-8" /><meta name="keywords" content="WOW Slider, Image Slider HTML, HTML Slide Show" /><meta name="description" content="WOWSlider created with WOW Slider, a free wizard program that helps you easily generate beautiful web slideshow" /><!-- Start WOWSlider.com HEAD section --><link rel="stylesheet" type="text/css" href="engine1/style.css" /><script type="text/javascript" src="engine1/jquery.js"></script><!-- End WOWSlider.com HEAD section --></head><body style="background-color:#d7d7d7"><!-- Start WOWSlider.com BODY section --><div id="wowslider-container1"><div class="ws_images"><ul><li><img src="data1/images/sfondo1.jpg" alt="sfondo1" title="sfondo1" id="wows1_0"/>SAPORI</li><li><img src="data1/images/sfondo2.jpg" alt="sfondo2" title="sfondo2" id="wows1_1"/>COLORI</li><li><img src="data1/images/sfondo3.jpg" alt="sfondo3" title="sfondo3" id="wows1_2"/>ODORI</li></ul></div><div class="ws_bullets"><div><a href="#" title="sfondo1"><img src="data1/tooltips/sfondo1.jpg" alt="sfondo1"/>1</a><a href="#" title="sfondo2"><img src="data1/tooltips/sfondo2.jpg" alt="sfondo2"/>2</a><a href="#" title="sfondo3"><img src="data1/tooltips/sfondo3.jpg" alt="sfondo3"/>3</a></div></div><span class="wsl"><a href="http://wowslider.com">Photo Slider jQuery</a> by WOWSlider.com v4.8</span><div class="ws_shadow"></div></div><script type="text/javascript" src="engine1/wowslider.js"></script><script type="text/javascript" src="engine1/script.js"></script><!-- End WOWSlider.com BODY section --></body></html>
file iframe_index.html
<!-- Start WOWSlider.com --><iframe src="index.html" style="width:960px;height:360px;max-width:100%;overflow:hidden;border:none;padding:0;margin:0 auto;display:block;" marginheight="0" marginwidth="0"></iframe><!-- End WOWSlider.com -->
ciao,
... non hai allegato nello ZIP la struttura completa, mancando le cartelle di servizio, per cui non può funzionare...
... comunque, vedendo il codice che hai postato, se vuoi vederlo in INTESTAZIONE di tutte le pagine del Sito, dovresti suddividerlo così:
::::: in Impostazioni Generali | ESPERTO >> sezione HEAD ::::::::::::::::::::::::
<!-- Start WOWSlider.com HEAD section --> <link rel="stylesheet" type="text/css"href="engine1/style.css" /> <script type="text/javascript" src="engine1/jquery.js"></script> <!-- End WOWSlider.com HEAD section -->
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
::::: in Oggetto HTML (</>) inserito in Intestazione ::::::::::::::::::::::
<!-- Start WOWSlider.com BODY section --> <div id="wowslider-container1"> <div class="ws_images"><ul><li><img src="data1/images/sfondo1.jpg"alt="sfondo1" title="sfondo1" id="wows1_0"/>SAPORI</li><li><img src="data1/images/sfondo2.jpg" alt="sfondo2" title="sfondo2" id="wows1_1"/>COLORI</li><li><img src="data1/images/sfondo3.jpg" alt="sfondo3" title="sfondo3" id="wows1_2"/>ODORI</li></ul></div><div class="ws_bullets"><div><a href="#"title="sfondo1"><img src="data1/tooltips/sfondo1.jpg" alt="sfondo1"/>1</a><a href="#"title="sfondo2"><img src="data1/tooltips/sfondo2.jpg" alt="sfondo2"/>2</a><a href="#"title="sfondo3"><img src="data1/tooltips/sfondo3.jpg" alt="sfondo3"/>3</a></div></div><span class="wsl"><a href="http://wowslider.com">Photo Slider jQuery</a> by WOWSlider.com v4.8</span> <div class="ws_shadow"></div> </div> <script type="text/javascript" src="engine1/wowslider.js"></script> <script type="text/javascript" src="engine1/script.js"></script> <!-- End WOWSlider.com BODY section -->
<!-- Start WOWSlider.com --> <iframe src="index.html"style="width:960px;height:360px;max-width:100%;overflow:hidden;border:none;padding:0;margin:0 auto;display:block;"marginheight="0" marginwidth="0"></iframe> <!-- End WOWSlider.com -->
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
...!... il codice IFRAME non ho capito come dovrebbe funzionare, appunto perchè la struttura che hai zippato è incompleta, e potrebbe farsene a meno...!...
... le cartelle di sevizio devono risiedere nella RADICE del Sito, esportando con FTP esterno, tipo Filezilla...
... inizia ad esportare l'esempio in RETE...
... quando hai esportato in RETE, metti qui il LINK del Sito e dell'esempio per poterlo osservare...
.
ciao
Autor
Ciao,
ti riallego lo zip....
ho trascitto il tuo codice html in espeto sezione HEAD e in oggetto html.....
C'è qulacosa che non funziona questo è il sito www.samuele1988.altervista.org
Samuele.
Hai esportato in rete anche le cartelle :
engine1 e data1....?
ciao,
... vedo che non hai esportato il contenutodi quelle cartelle indicate da Mirko...
... di questa ne puoi fare a meno [engine1/jquery.js], in quanto c'è quella del programma [res/jquery.js?39] che è valida...
... invece questa [engine1/style.css] la devi inviare completa del CSS contenuto...
... poi l'altezza della Intestazione la devi aumentare, altrimenti non si allinea col sito...
...!... importante, ...la parte IFRAME ne potresti fare a meno e prova a non metterla, per come avevo presunto prima, che sarebbe la sezione in basso del precedente suggerimento e quindi la elimini, ...eventualmente lo aggiungerai dopo...
... quindi in HEAD va solo questo:
<!-- Start WOWSlider.com HEAD section --> <link rel="stylesheet" type="text/css"href="engine1/style.css" /> <!-- End WOWSlider.com HEAD section -->
.
ciao
Autor
Ciao,
prima di tutto vi ringrazio per la vostra disponibilità e puntualità nelle risposte....
Provate a guardare ora il sito che vi avevo indicato penso di avere eseguti alla lettera tutte le Votre istruzioni......
Il risultato è fantastico ma non appaino le didascalie sulle foto e poi quando vado nelle varie pagine la foto/slide oltre ad apparire per intereso sotto riappare un piccolo pezzettino di foto cosa che non vedo nella home..(ho alzato troppo l'intestazione?!)
Grazie ancora.
Samuele.
ciao,
... come ti avevo consigliato prima, togli la parte di codice riguardante l'IFRAME e che sarebbe questa:
<!-- Start WOWSlider.com --> <iframe src="index.html"style="width:960px;height:360px;max-width:100%;overflow:hidden;border:none;padding:0;margin:0 auto;display:block;"marginheight="0" marginwidth="0"></iframe> <!-- End WOWSlider.com -->
.
ciao, KolAsim
Autor
Ciao KloAsim.....
ho rimosso stavolta definitivamente il frame ..... funziona ugualmente... ma non appaiono ancora le didascali sulle foto.....
1° foto didascalia (sfondi 1 sapori)
2° fato didascalia (sfondo 2 colori)
3° foto didascalia (sfondo 3 odori)
Samuele.
... vedo che hai degli errori nel codice...
... non fare copia/incolla da Aswers, ma prendi il codice dalla pagina html del tuo esempio, per evitare che la formattazione si alteri; gli errori che ho notato sono quelli evidenziati in grassetto, ed in corsivo invece la sintassi corretta:
<imgsrc="
<img src="
<scripttype=
<script type=
.
ciao
Autor
Grazie MILLE FUNZIONA!!!!!!
...
...
Autor
Ciao KolAsim devo chiederti ancora un tuo consiglio e un tuo aiuto...... navigando su vari siti internet mi hanno colpito in modo particolare questi due :
1) http://www.bg.camcom.gov.it (su questo sito della camera di comemrcio in fondo c'è una finestra che si chiama Tag Cloud come posso realizarlo con web Site?)
2)http://www.comune.sergnano.cr.it/web/layout/layout8.asp?categorie=1722,&ordinamenti=AR,DD&stati=N,N&elenchi=8&MEC_ID=176&MEC_IDFiglie=0 ( su questo sito di questo comune ho osservato che a lato c'è una finestra dinamica che si chiama news-eventi recenti. Anche per questa particolare finestra ti chiedo come posso crearla con web site)
Spero che mi puoi aiutora o quanto meno indirizzarmi per porter ottere quei risultati....
Ti ranzio gia in anticipo.
Samuele... :)
1) - è in FLASH, e dovrebbe essere tra i Component di SwishMax.4, di cui un mio esempio con SM3: http://www.zspace.it/kolasim/miei_files/sm3/menu_sfera/menu_sfera_K.html
2) - dovrebbe essere un lettore di FeedRss (XML), ...occorre ricercarli in rete, e se ne dovrebbero trovare in JavaScript, jQuery, PHP, e perchè no, in Flash
... tutto sta a trovarli che poi ad implementarli il sistema si troverebbe tramite i pannelli ESPERTO del programma; ...io purtroppo attualmente sono senza PC e senza programmi...
.
ciao, KolAsim
Autor
Grazie Kolasim, ho capito che non è proprio una cosa facile ma devo investire molto tempo e notti in bianco...... vorrei ancora approfittare della tua gentilezza..... Ho ancora un paio di quesiti penso più facili che vorrei risolvere per il sito che sto costruendo.
Ti spiego meglio:
1) io ho inserito nella pagina di benvenuto di un sito un video..... ( il primo problema è che quando clicchi sopra si ferma e non entra nella home....) (secondo problema mi piacerebbe inserire un ( tasto/scritta "entra") ho in basso a destra sul video o sotto il video..... ho visto che nella pagina di benvenuto c'è la possibilità di inserire il linguaggio html ma non saprei da dove partire e ti chiedo se mi puoi segurmi un po' come hai fatto con la jquery....
2) Secondo quesito riguarda l'intestazione del sito mi piacerebbe cambiare l'intestazione nelle varie pagine del sito.... home (una intestazione) contatti ( un altra ecc...)
3) Per qunado riguarda il messaggio pubblicitario io ho inserito il "page peel" in tutte le pagine del sito web..... mi piacerebbe inserire un altro messaggio pubblicitario solo nella HOME ( tipo un il riguardo in basso a destra)...
Ti ringrazio di cuore per tutto l'aiuto e vorrei dirti che grazie alle tue spiegazione mi dai ogni girno deigli stimoli per impare e conoscere meglio il web e tutte le pontenzilità di web site!!!!
Samuele
ciao,
... considerando l'ultimo mio pensiero espresso alla fine del precedente post
:
1 – il più semplice ed immediato, mettere un ENTRA ben a vista, ...per esempio un codice da me personalizzato di questo tipo:
<center>
<a href="home.html" style="font-size:25px; color:#FFFF00; text-decoration:none">ENTRA</a>
</center>
... semplificato e molto simile a questo mio esempio: http://bit.ly/1eX5tOl
- - - oppure si potrebbe usare un DIV CUSTOM sovrapposto al VIDEO, da assemblare ad hoc;
2 – semplicissimo, con lo SlideShow, indicando ad ogni immagine in quale pagina attivarsi;
3 – allo stesso modo 2, inserendo uno SlideShow, a cambio rapido per attirare l'attenzione, con indicato alla immagini di aprirsi solo nella HOME; - - - oppure si potrebbe usare un DIV CUSTOM da assemblare ad hoc e separato dal contesto della pagina...
.
ciao, KolAsim
Autor
Grazie!!!
ho solo un problema non riesco ad inserire nella pagina di benvenuto oltre ad entra anche il video.....
Poi una curisità... tuttele volte che carico un video dentro web site che sia file pc o da collegamento you tobe rimane sembre intorno al video una cornice nera non si può togliere??? nel senso di vedere solo il video.... oppure se occorre trasformalo in aultra estensione non flash palyer perchè ne i cellulari ne i tablet lo leggono???
esempio video con bordo nero www.aiuto2014.altervista.org
1) - dimmi se puoi attivare contemporaneamente le due opzioni:
▪File | ▪Codice HTML
2) - dipende da come hai realizzato il VIDEO; ... elimina i primi fotogrammi di avvio NERI; ... (la cosa migliore sarebbe mettere una immagine di anteprima del Video, che cliccandoci apre il Video nello ShowBox sia per video propri che per quelli su YT)...
.
ciao
Autor
Per me mi fa solo schegliere tra foto-videdo-animazione flash e html.....Ti allego la foto della schermata...... per non sbagliare........
... quindi non puoi selezionarli contemporaneamente...!?...
... ti faccio queste domande perchè non ho il programma...
... allora fai così:
1 - metti una pagina NUOVA e la rendi NACOSTA, e senza grafica, ed in questa inserisci il tuo VIDEO;
2 - avvia l'Anteprima ed individui il codice relativo al video, che dovrebbe essere simile a questo:
<div id="imObjectVideo_1"></div><script type="text/javascript">x5engine.boot.push("x5engine.mediaPlayer({ 'target': '#imObjectVideo_1','type': 'video','url': [{'src': 'videos/prova.mp4'}],'width': 800,'height': 600,'guiColor': '#141414','controlBar': false,'autoHideControls': false,'autoplay': false,'fullScreen': false})");</script>
... lo copi e lo incolli nella finestra HTML della Pagina di Benvenuto, ed insieme a questo, o prima o a seguito incolli il codice precedente ENTRA...
... prova e fammi sapere, magari potrebbe funzionare, ..altrimenti passiamo dopo al video YouTube, che dovrebbe essere più semplice...
.
ciao
Autor
HA FUNZIONATO
!!!
KolAsim ti mostro questo link perchè voglio avere un tuo parere http://www.aquardens.it/it/ristorazione
questo è il sisto di un parco termale...... in questa pagina della ristorazione al centro c'è un menù.... quando ti sposti su una voce cambia l'immagine sottostante.... ma cosa è? una jqueri??...... Chiedo un tuo esporto consiglio perchè mi piacerebbe imparare a creare un menù così...... Eventualmente se è un "programma" (come nei nostri precedenti discorsi dove ho trovato un programma che mi creava una jqueri dove passavano le foto di alcuni cibi ) ti chiedo di indirizzarmi o se eventualmente conosci un link dove posso apprendere...
So che sei senza pc ma ti chiedo per favore di fare appello alla tua memoria......
Grazie.
Samuele.
ciao,
... io tengo le distanze da jQuery, sta riscoprendo l'acqua calda...
... comunque, se ne sei interessato, dovresti farti una ricerca in rete, magari partendo dal link appresso, che fa quasi la stessa cosa, ovviamente devi studiarci un po' sopra, ...magari con l'aiuto delle MrkApp...
http://ricostacruz.com/jquery.transit/
.
ciao
Autor
Ciao KolAsim, grazie per tutti i tuoi suggerimenti.....
Ho seguito il tuo consiglio e sto cercando di capire la struttura delle jquery....
Mi sono ibattuto in questi sito http://www.mrflock.com/tutorial/jquery-per-web-design.html e vorrei inserire in una pagina in web site con la jqueri "Immagini full screen con Vegas jQuery" che sono delle immagini in dissolvenza con una filigrana nera davanti e in un altra pagina la jqueri "Video in background con jQuery Tabular" che mi ripropone un video di you tobe per intero......
Tra gli allegati trovi uno zip con allinterno la cartella jqueri "Video in background con jQuery Tabular" e la cartella jaysalvat-vegas-887d808 "Immagini full screen con Vegas jQuery"
- partendo da Video in background con jQuery Tabular ho copiato tutte cartelle (css- media-js)nel pannello di controllo del sito e ho inserito in web site
nel HEAD
<head><title>tubular, a YouTube Background Player jQuery Plugin | Sean McCambridge Design</title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><link rel="icon" type="image/png" href="/media/layout/favicon.png" /><link href="css/screen.css" rel="stylesheet" type="text/css" /><script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script><script type="text/javascript" charset="utf-8" src="js/jquery.tubular.1.0.js"></script><script type="text/javascript" charset="utf-8" src="js/index.js"></script></head>
nel BODY
NON SO LA PARTE DA SELEZIONE... ho provato ca piare tutto ,a naturalmente mi riporta anche tutte le didascali e il logo di you tobe.....
<body><div id="wrapper" class="clearfix"><div id="main"><a href="http://www.seanmccambridge.com/tubular/"><img src="media/logo.png" alt="Tubular logo" id="logo" /></a><p id="video-controls" class="black-65">Video controls:<br /><a href="#" class="tubular-play">Play</a> | <a href="#" class="tubular-pause">Pause</a> | <a href="#" class="tubular-volume-up">Volume Up</a> | <a href="#" class="tubular-volume-down">Volume Down</a> | <a href="#" class="tubular-mute">Mute</a></p><div class="black-50"><h1>jQuery tubular</h1><p>Tubular is a jQuery plugin that lets you set a YouTube video as your page background. Just attach it to your page wrapper element, set some options, and you're on your way.</p><p><code>$(<em>page content wrapper element</em>).tubular(<em>options</em>);</code></p></div><div class="black-50"><h2>Tubular's <em>hello, world</em></h2><p>Assuming you're happy with the default options and you use a wrapper div with the id of <em>wrapper</em>, you simply attach to your wrapper div and specify the video you want to load:</p><p><code>$('#wrapper').tubular({videoId: '0Bmhjf0rKe8'});</code></p><p>and <em>Presto!</em> ... kittens in your website background!</p></div><div class="black-50"><h2>A word of caution</h2><p>Tubular does not design your website for you. It works here thanks to alpha transparency on these gray boxes and the png logo on the top left. I built tubular thinking it would help experienced web designers and developers add some subtle background elements — emphasis on subtle — to their work. I'm sure there are some tasteful ways to use tubular and many, many more not so tasteful ways to use it. With great power comes great responsibility. The kitten example above is not to be taken seriously! :-)</p></div><div class="black-50"><h2>Options and defaults</h2><code><ul><li>ratio: 16/9 // usually either 4/3 or 16/9 -- tweak as needed</li><li>videoId: 'ZCAnLxRvNNc' // toy robot in space is a good default, no?</li><li>mute: true</li><li>repeat: true</li><li>width: $(window).width() // no need to override</li><li>wrapperZIndex: 99</li><li>playButtonClass: 'tubular-play'</li><li>pauseButtonClass: 'tubular-pause'</li><li>muteButtonClass: 'tubular-mute'</li><li>volumeUpClass: 'tubular-volume-up'</li><li>volumeDownClass: 'tubular-volume-down'</li><li>increaseVolumeBy: 10 // increment value; volume range is 1-100</li><li>start: 0 // starting position in seconds</li></ul></code></div></div><div id="sidebar"><div class="black-50"><h2>Download</h2><p><a href="http://code.google.com/p/jquery-tubular/">Download jQuery tubular on Google Code</a></p></div><div class="black-50"><h2>Credits</h2><p>Beautiful time lapse video of the U.S. Southwest by Tom Lowe and Catherine Laplace-Builhe. <a href="http://www.youtube.com/watch?v=e4Is32W-ppk">Original video here</a>. Code by <a href="http://seanmccambridge.com">Sean McCambridge</a>. Released under <a href="http://opensource.org/licenses/mit-license.php">the MIT License</a>.</p></div><div class="black-50"><h2>Remember</h2><p>Tubular does one thing well. It takes a single video from YouTube at injects it as a full-screen background on a website. It scales the video, offsets the video and provides some basic controls for the video. That's it.</p><p>Tubular makes some assumptions on how your website works. First, it assumes you have a single wrapper element under the body tag that envelops all of your website content. It promotes that wrapper to z-index: 99 and position: relative. You can configure the z-index value in the options. So it's assuming your wrapper can accept positioning without breaking your site.</p><p>Finally, tubular injects the YouTube video you specified as an iframe using fixed position at z-index: 1. Browsers that do not support fixed positioning will not support tubular. Also, since the YouTube iframe API requires the HTML5 postMessage feature, browsers that do not support it (I'm looking at you, IE7) will not support tubular — tubular will return false before any changes are made to your CSS in IE7.</p></div></div></div><!-- #wrapper --></body>
poi guardando tutta la struttura del body ho provato a cambiare gli indirizzi http con un link di un video di you tobe ma niente mi fa sempre vedere lostesso video che puoi vedere nella pagina cliccando su demo del link che ti ho indicato.......
tra gli allegati ti allego anche un file in word che riporta la struttura html della queri perchè penso che forse è li il link che devo cambiare.......
- Per quanto riguarda la jquery Immagini full screen con Vegas jQuery"
NON SAPREI DA CHE PARTE COMINCIARE!!!
Ti chiedo un tuo grasso AIUTO!!!
Samuele.
una cosa cosi non potrebbe andare bene lo stesso...?
http://provesitotest.altervista.org/ccc/
e per youtube:
http://provews.altervista.org/youtube/
Autor
Perfetto!!!!!!!! SEI MITICO...... se è possibile solo una cosa per quanto riguarda le foto si puo mettere quella filigrana nera in qualche modo?
SONO TUTTO ORECCHIE PER COME IMPOSTARE I TUOI DUE ESEMPI......
Ti ricordo che i tuoi esempi li devoimpostare solo per una pagina di menù non per tutte le pagine....
Samuele
Nel mio profilo trovi la mia mail, scrivi li cosi ti posso mandare tutto quello che serve...
... belli gli esempi di Mirko, con i quali si raggiunge subito o scopo...
... comunque, riguardo tubular, ho guardato e fatto una prova col blocco note, perché sai che non ho programmi, e quello che devi fare consiste solo nel mettere il nome del video YT nel file index.js, e le tre dichiarazioni SCRIPT nella sezione HEAD, e il DIV contenitore "wrapper" nella sezione BODY...
... qui il mio esempio: http://www.zspace.it/kolasim/website/tubular/tubular.html
... clicca col destro del mouse e guarda il codice usato...
... per quanto riguarda la filigrana, penso che ti riferisci alle bande nere, che non sono altro che uno sfondo png ripetuto e sovrapposto...
.
ciao