Ptite_Perle
A les clefs du forum
Je tiens le trousseau de clefs du forum
Fondatrice Messages : 5847 Venue : 27/06/2009 Je suis : Age : 60 Je vie à : Lyon Humeur : Bonne humeur Mes Points : 120011 Mur d'image en 3d | | Coucou Voir les exemples ici Fichier js - Code:
-
function mur_instance(){
var ob=Object.create(k_mur);
ob.nombre=10; //nombre d'images en largeur ob.nb_hauteur=7; // nombre d'images en hauteur ob.angle_max=Math.PI/4; // angle du mur ob.marge=5; // espace entre chaques images ob.bord=10; // bord gauche droit haut bas ob.affichage_image=false, // true ou false au clic sur l'image elle est affiché en grand au centre de l'écran ob.ctn=document.getElementById("ctn"); // id du conteneur du mur ob.chemin="images/"; // repertoire contenant les images ob.diaporama=true; // true ou false mise en marche du diaporama pour chaques images
// tableau contenant le nom des images
ob.tbmage=['aerien.jpg','wall.jpg','karen.jpg','halo.jpg','tortue.jpg','optimus.jpg','star.jpg','chloe.jpg', 'war.jpg','cap.jpg','cow.jpg','cow2.jpg','main.jpg','croods.jpg','justicier.jpg','planete.jpg','pont.jpg', 'rob.jpg','hobbit.jpg','america.jpg','elsa.jpg','toy.jpg','ping.jpg', 'plane.jpg','spider.jpg','sucker.jpg','king_kong.jpg', 'ville.jpg','harry.jpg','coraline.jpg','qui.jpg','singe.jpg','lost.jpg', 'cap.jpg','fille.jpg','avion.jpg','chopra.jpg','emma.jpg', 'russell.jpg','avatar.jpg','moche.jpg','ours.jpg','iron.jpg', 'hulk.jpg','pirates.jpg','ice.jpg','miserables.jpg','inception.jpg', 'batman.jpg','gwen.jpg','kate.jpg','madagascar.jpg','scream.jpg', 'cat.jpg','sucker.jpg','cars.jpg','requin.jpg','iron2.jpg', 'boulettes.jpg','pig.jpg','melon.jpg','samu.jpg','punch.jpg','anony.jpg', 'arnold.jpg','perse.jpg','clint.jpg','thor.jpg','oz.jpg', 'tron.jpg','fast.jpg','trek.jpg','cat2.jpg','totoro.jpg','ralph.jpg','matrix.jpg','evil.jpg']
ob.init_image(); }
//sert a lancer la creation du diaporama au chargement de la page (impératif)
window.addEventListener('load',mur_instance, false);
html - Code:
-
<div class="container" id='ctn'></div>
La largeur du conteneur est définis dans une feuille de style css exemple avec une largeur de 80%: - Code:
-
body{
background-color:#333; }
.container{ width: 80%; margin:auto; margin-top:20px; background-color:black; box-shadow: 0px 0px 15px #888888; /* perspective : 1000px;*/ |
| |