guppy.71site.fr

Accueil  Nouvelles  Téléchargements  Liens  FAQ  Livre d'or  Forum
Forum - --unknown-- - Sujet n°21

Sujet n°21 Taille réelle image caméra
    - par walimoha le 20/02/2017 @ 18:33

Bonsoir à tous, salut JD,J'utilise camera avec le (cameraslider_test_camera2) et je souhaiterai que ma camera affiche la taille réelle de mes images, c'est à dire with:548 high:790.Et aussi pour avoir moins de marge entre les boutons (prev, next) et mes images.A quelle partie du script je peux adapter cela? merci d'avanceCordialement

Réponse n° 1
    - par JeanDenis le 24/02/2017 @ 19:31

Bonsoir,

Je n'étais pas chez moi cette semaine et n'ai donc pas pu répondre plus tôt...

Ce que je vois de ton slider Camera en page d'accueil de ton site https://ahvl.com.fr/

affiche des images de 460x265px (et non pas les dimensions que tu indiques... est-ce un autre slider ailleurs ?)

Sinon, pour celui-ci  et pour les boutons de navigation, tu dois modifier dans ton script
height: '57.61%',        ( attention... un point pas une virgule...)
 ( en effet 265 / 460 = 0.57608....)
car on lit :

jQuery(function(){ /* initialisation camera_wrap_1 */
            jQuery('#camera_wrap_1').camera({
                thumbnails: false,
                height: '56,61%',
                pagination: true
            });
        });

Pour la taille réelle, tu peux mettre dans la partie style de ton code :

.fluid_container { /* reglage max en largeur et % d'occupation */
    margin: 0 auto;
    max-width: 460px;
    width: 100%;
}

Tu adaptes ces données si il s'agit d'un autre slider Camera.

Cordialement,

 



Réponse n° 2
    - par walimoha le 20/03/2017 @ 19:18

Bonsoir à tous, salut JeanDenis,Je suis en train de mettre en place la galerie videos que tu m'as conseillé. C'est sur le site itepdecroix.fr (la page blog sud maroc qui est protégée).avec ton script merci encore, je dois réduire l'affichage de camera qui prend beaucoup trop de place, 450 sur 250 ça me parait correct.Puis les vignettes ne semblent pas fonctionner et les vidéos se mettent automatiquement en lecture!Si quelqu'un veut jeter un coup d' œil sur le script merci d'avance
Cordialement
 Code : css<script> jQuery(function(){ /* initialisation camera_wrap_3 */ jQuery('#camera_wrap_3').camera({ fx: 'simpleFade', thumbnails: true, height: '56.25%', pagination: false, time: 5000, transPeriod: 1000 }); }); </script> <div class="fluid_container"> <div class="camera_wrap camera_emboss" id="camera_wrap_3"> <div data-src="camera_images/photo01.png" data-thumb="camera_images/vgnt/photo001.png"><iframe allowfullscreen="" frameborder="0" height="100%" mozallowfullscreen="" src="../file/essai1.mp4" webkitallowfullscreen="" width="100%"></iframe></div> <div data-src="camera_images/video02.png" data-thumb="camera_images/vgnt/video002.png"><iframe allowfullscreen="" frameborder="0" height="100%" mozallowfullscreen="" src="../file/essai2.mp4" webkitallowfullscreen="" width="100%"></iframe></div> <div data-src="camera_images/video02.png" data-thumb="camera_images/vgnt/video002.png"><iframe allowfullscreen="" frameborder="0" height="100%" mozallowfullscreen="" src="../file/essai1.mp4" webkitallowfullscreen="" width="100%"></iframe></div> <div data-src="camera_images/photo01.png" data-thumb="camera_images/vgnt/photo001.png"><iframe allowfullscreen="" frameborder="0" height="100%" mozallowfullscreen="" src="../file/essai2.mp4" webkitallowfullscreen="" width="100%"></iframe></div> </div> </div>
 

Réponse n° 3
    - par JeanDenis le 20/03/2017 @ 19:41

Bonsoir,

Ce que je t'ai conseillé, et qui fonctionne sur ce site e, ce sont des vidéos embed (hébergées ailleurs... Youtube, Dailymotion...) et non des vidéos issues de ton site qui elles ne s'intègrent pas comme cela dans des Iframes...

Or tu as indiqué que tu ne souhaitais pas que tes vidéos soient hébergées sur Youtube par exemple (ce qui est pourtant bien pratique...)

Ton code ne peut pas fonctionner comme cela.
Sans te promettre quoique ce soit, j'essaierai de regarder à cela... mais...

Il sera toujours temps de s'occuper de la dimension et des vignettes ensuite... s

Cordialement,



Réponse n° 4
    - par walimoha le 20/03/2017 @ 20:05

Bonsoir JD, merci beaucoup, Sur Youtube c'est interdit me concernant. Je dois ajouter une camera différente chaque jour pour 4 vidéos pendant un séjour de 10 jours. C'est pour cela que je voulais au départ une galerie comme celle des photos, c'est plus simple à mon avis. 
Cordialement


Réponse n° 5
    - par JeanDenis le 23/03/2017 @ 08:27

Bonjour,

J'ai un peu avancé sur cette question.

Seulement, avant de peaufiner un tutoriel, il faut que cela t'intéresse vraiment...

Pour utiliser le procédé avec des vidéos hébergées sur ton serveur, il faudra quand même que la première soit embed (pour que la série puisse boucler sur elle-même)
Ensuite les autres peuvent être sur ton serveur, mais elle seront appelées dans l'Iframe de Camera par l'intermédiaire d'un fichier .html (facile à créer et reproduire... mais c'est une étape supplémentaire)
De plus l'habillage de la vidéo dans l'Iframe est moins précis que pour les vidéos embed

Voilà voilà, si cela peut t'aider...
Mais, je persiste à penser que des vidéos embed (sur Youtube, Vimeo...) sont beaucoup plus simples à gérer (tu les envoies une bonne fois pour toute...), et rapides à mettre en place... (sans compter la place gagnée sur ton serveur) Mais bon...

Sinon, de manière encore plus simple, tu peux mettre en place tes vidéos sous forme de miniatures (4 par ligne, 10 lignes... par exemple...), elles pourront se lancer et s'afficher en plein écran par le visiteur...

Cordialement,



Réponse n° 6
    - par walimoha le 24/03/2017 @ 07:15

Bonjour à tous, salut Jean Denis,Bien sur que je suis intéressé par cette méthode. Je peux la travailler sur mon site. Merci  encore pour ce travail
Cordialement


Réponse n° 7
    - par JeanDenis le 24/03/2017 @ 09:45

Bonjour,

Je viens de mettre en ligne un tutoriel :

https://www.71site.fr/articles.php?lng=fr&pg=334&mnuid=19&tconfig=0

pour essayer de répondre à ton projet et un dossier à télécharger reprenant les éléments du tutoriel :

https://www.71site.fr/dwnld71.php?lng=fr&pg=336&tconfig=0

Bons tests,
Cordialement,



Retour à la liste des sujets
Haut

Valid HTML 5.0 freeguppy.org © 2004-2020 En savoir plus ... Valid CSS 3
skin-J-D.png