Background animée

Bonsoir

Une petite analyse du code de la page que tu indiques permettrait de te donner quelques idées.

Remarque que les images apparaissent grâce aux lignes suivantes:
Bloc de code:
[SIZE="1"][COLOR="SlateGray"](...)[/COLOR]

<div id="image_0"></div>
<div id="image_1"></div>

[COLOR="SlateGray"](...)[/COLOR]

<script type="text/javascript" charset="utf-8" src="/javascripts/homepage_data.js"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/homepage_images.js"></script>

[COLOR="SlateGray"](...)[/COLOR][/SIZE]

Puis regarde les scripts correspondants (celui-ci et celui-là).

Il n'est pas permis de les recopier, mais tu pourrais t'en inspirer...
 
Bonjour,

vu que ton sitye est fait sur iweb , les conseils de Pascal devront être mis en place après publication de ton site . Et n'oublies pas de faire une sauvegarde de tes changements vu que 'iweb écrase tout à chaque publication

@+
 
Certainement moins simple qu'il n'y paraît si tu ni connais rien.

Ce système est basé sur un effet BlindDown contenue dans la librairie prototype désignée dans le head :
Bloc de code:
<script type="text/javascript" src="/javascripts/prototype.js?1209145428"> ->base générale
<script type="text/javascript" src="/javascripts/effects.js?1209145428"> -> module des effets
Tu as ensuite 2 div traitées par cet effet :
Bloc de code:
<div id="image_0" style="background: transparent url(/assets/images/homepage/1.jpg) no-repeat scroll 0% 0%; height: 730px; width: 1000px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"/>
<div id="image_1" style="background: transparent url(/assets/images/homepage/3.jpg) no-repeat scroll 0% 0%; height: 730px; width: 1000px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; opacity: 0.999999;"/>
Elles reçoivent les données (vitesse d'affichage, chemin du dossier des images) par le script placé en dessous :
Bloc de code:
<script src="/javascripts/homepage_images.js" charset="utf-8" type="text/javascript">
Enfin il y a aussi un bouton "?" pour afficher la légende des photos dans une autre div :
Bloc de code:
<div id="photocredit" style="display: none;">New Museum, 235 Bowery, New York, NY 10002, USA. Photo by Dean Kaufman. 
<a href="/about/new_building/">MORE  ></a>


</div>
Et pour celle-ci les données sont traitées par le script suivant :
Bloc de code:
<script src="/javascripts/homepage_data.js" charset="utf-8" type="text/javascript">
Si tu utilises iWeb passe ton chemin, ça n'a rien à voir avec ce soft. Impossible à implémenter sans coder dans le dur ta page. Soit tu te mets au développement web d'urgence, soit tu trouves une personne compétente pour t'aider... Pascal par exemple... :siffle: :p :D
 
Voici un exemple de ce qui peut être fait. Il faut lancer "dia.html". (Désolé pour la pub au premier chargement des pages).

Regarde le code source à partir du navigateur (Alt+Pomme+U sous Safari).

Cela peut se rajouter simplement dans n'importe quelle page existante, et ne nécessite pas de librairies supplémentaires en dehors du fichier "diaporama.js" fourni.

J'ai fait ça rapidement, mais ça tourne bien avec les dernières versions de Safari, Firefox, Opera, Netscape, et IE 7. Par contre je n'ai pas testé avec d'autres navigateurs.