Membres connectés récemment
[Invision] Réduction image avec clic agrandissement
2 participants
Page 1 sur 1
- Version du forum :Invision
- Templates modifiés :oui
- Navigateur :Chrome
Bonjour;
Lien forum: ICI https://www.quadsalvetain.com/
CSS ici:
Css
j'utilise Google
je suis en Invision
serai t'il possible d'avoir les les images limité en dimension limité Largeur a 600 et Hauteur a 450 qui s'ouvre en un clic pour un aperçu grandeur origine ou voir une grandeur limité.
"que je pourrais modifier ensuite pour l'adapter a mon forum"
Cordialement
en image
en image:
je veux éviter ceci avec lien agrandissement au dessus image
je souhaite ceci si possible
Lien forum: ICI https://www.quadsalvetain.com/
CSS ici:
Css
- CSS:
j'utilise Google
je suis en Invision
serai t'il possible d'avoir les les images limité en dimension limité Largeur a 600 et Hauteur a 450 qui s'ouvre en un clic pour un aperçu grandeur origine ou voir une grandeur limité.
"que je pourrais modifier ensuite pour l'adapter a mon forum"
Cordialement
en image
en image:
je veux éviter ceci avec lien agrandissement au dessus image
je souhaite ceci si possible
Coucou Dan,
ta demande reflète un peu le plugin FancyBox, comme ici en fait.
Cliques sur l'image et tu verras l'effet.
E.A a développé ce script :
https://forum.forumactif.com/t397762-diaporama-pour-visualiser-les-images-dans-les-messages-fancybox-ou-lightbox#3326082
Si c'est son souhait, il suffit de déposer ce script:
Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript
Mettre un titre explicite.
Cocher Sur les sujets
Déposer ceci:
Les dimensions peuvent être modifiées dans le script ici:
Signifie:plus grande que 100px de largeur
Signifie:plus grande que 100px de hauteur
ta demande reflète un peu le plugin FancyBox, comme ici en fait.
Cliques sur l'image et tu verras l'effet.
E.A a développé ce script :
https://forum.forumactif.com/t397762-diaporama-pour-visualiser-les-images-dans-les-messages-fancybox-ou-lightbox#3326082
Si c'est son souhait, il suffit de déposer ce script:
Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript
Mettre un titre explicite.
Cocher Sur les sujets
Déposer ceci:
- Code:
$(function () {
var getFancy = function () {
$('head').append('<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.4.2/jquery.fancybox.min.css"/><style>.fancybox-content{transition:none}</style>');
$.ajax({url:'https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.4.2/jquery.fancybox.min.js',cache:true,dataType:"script"}).then(function(){
$.fancybox.defaults.hideScrollbar = false;
});
getFancy = function () {};
};
var contents = $('.post-entry,.post-content,.content,.postbody');
contents.find('img').css({maxWidth:'100%'}).not(contents.find('a img')).load(function () {
if (100 < this.naturalWidth || 100 < this.naturalHeight) {
$(this).wrap($('<a data-fancybox="gallery"/>').prop('href', $(this).prop('src'))).unbind('load');
getFancy();
}
}).load();
});
Les dimensions peuvent être modifiées dans le script ici:
- Code:
if (100 < this.naturalWidth || 100 < this.naturalHeight) {
- Code:
100 < this.naturalWidth
Signifie:plus grande que 100px de largeur
- Code:
100 < this.naturalHeight)
Signifie:plus grande que 100px de hauteur
Bonsoir Philippe cela fait 2 h que je cherche ?
j'ai trouvé ceci dans (les Sujets)
après suppression pareil, pour ne pas faire de bêtise je les remis ! dans les sujet
j'ai trouvé ceci dans (les Sujets)
- Code:
// SCRIPT CONCERNANT Effet loupe sur chaque message
$(function(){
// L IMAGE D OUVERTURE
$('<span class="M14_open_Body"title="Agrandir le message"><img src="https://i.servimg.com/u/f68/16/47/45/04/zoom_i10.png"/></span>').insertBefore('.postbody .post-entry');
//L IMAGE DE FERMETURE
$('<span class="M14_close_Body"title="Réduire le message"style=display:none;"><img src="https://i.servimg.com/u/f68/16/47/45/04/zoom_o10.png"/></span>').appendTo('.postbody .post-entry');
});
//AU CLIC SUR L IMAGE OUVERTURE ON ATTRIBUE UN IDENTIFIANT AU POSTBODY
$(function(){
$('.M14_open_Body').click(function(){
//ON CACHE L IMAGE D OUVERTURE
$(this).hide();
//ON ATTRIBUE UN IDENTIFIANT AU POSTBODY
$(this).next('div').attr('id','M14_Effet_body');
//ON AFFICHE L IMAGE DE FERMETURE AVEC TEMPORISATION
$('.M14_close_Body').delay(800).fadeIn();
});
});
$(function(){
//AU CLIC SUR L IMAGE DE FERMETURE
$('.M14_close_Body').click(function(){
//ON CACHE L IMAGE DE FERMETURE
$(this).hide();
//ON SUPPRIME L IDENTIFIANT
$('.post-entry').removeAttr('id');
//ON AFFICHE L IMAGE D OUVERTURE AVEC TEMPORISATION
$('.M14_open_Body').delay(500).fadeIn();
});
});
après suppression pareil, pour ne pas faire de bêtise je les remis ! dans les sujet
bonjour Philippe, il fonctionne sauf que l'image s'ouvre a l'identique !
exemple lien ici
si tu agrandie sur l'ancien lien agrandir cette image là tu la vois a grandeur réel.
amicalement
exemple lien ici
si tu agrandie sur l'ancien lien agrandir cette image là tu la vois a grandeur réel.
amicalement
Ah effectivement, ensuite je ne connais pas beaucoup de personne qui demande d'avoir une image qui s'affiche dans son format initial.
On peut le faire mais tout cela cela s'affichera dans une nouvelle fenêtre Dan.
Est-ce réellement ton souhait?
Tu peux supprimer le script en attendant mon ami.
Je verrais tout cela demain.
On peut le faire mais tout cela cela s'affichera dans une nouvelle fenêtre Dan.
Est-ce réellement ton souhait?
Tu peux supprimer le script en attendant mon ami.
Je verrais tout cela demain.
grand merci phil pour ton aide, j'ai réduit les images de mon forum dans PA/Général/Configuration à 600 sur 450
je souhaite si possible quelle s'ouvre naturellement, mais en me laissant la possibilité de régler un maxi/ Mini
qui s'ouvre en un maxi de Largeur : 900 sur Hauteur : 750 si il est possible de limiter la hauteur largeur
encore mille excuse
Amicalement
je souhaite si possible quelle s'ouvre naturellement, mais en me laissant la possibilité de régler un maxi/ Mini
qui s'ouvre en un maxi de Largeur : 900 sur Hauteur : 750 si il est possible de limiter la hauteur largeur
encore mille excuse
Amicalement
oups j'ai fais une modif au dessus je te pansé partie désolé ici
car j'ai constater quelle s'ouvre a l'identique d'avant
car j'ai constater quelle s'ouvre a l'identique d'avant
Hello Dan,
Pour le style, tout est hébergé dans le script mon ami, cela risque d'être compliqué
Tu veux que les images s'ouvrent automatiquement sans rien faire?
Hou la, il vaut mieux éviter ce genre de comportement mon ami si réellement c'est ton souhait.
Ensuite, ce que tu demandes est pratiquement impossible a réaliser Dan,
le script actuel est de loin celui qui correspondrait le mieux à ta demande.
Il faut aussi prendre en compte, que des membres peuvent poster des images faisant admettons:
2500px par 2500px et que pour un membre ayant une petite résolution d'écran,il sera pénalisé .
Quad Daniel a écrit:grand merci phil pour ton aide, j'ai réduit les images de mon forum dans PA/Général/Configuration à 600 sur 450
je souhaite si possible quelle s'ouvre naturellement, mais en me laissant la possibilité de régler un maxi/ Mini
qui s'ouvre en un maxi de Largeur : 900 sur Hauteur : 750 si il est possible de limiter la hauteur largeur
encore mille excuse
Amicalement
Pour le style, tout est hébergé dans le script mon ami, cela risque d'être compliqué
je souhaite si possible quelle s'ouvre naturellement,
Tu veux que les images s'ouvrent automatiquement sans rien faire?
Hou la, il vaut mieux éviter ce genre de comportement mon ami si réellement c'est ton souhait.
Ensuite, ce que tu demandes est pratiquement impossible a réaliser Dan,
le script actuel est de loin celui qui correspondrait le mieux à ta demande.
Il faut aussi prendre en compte, que des membres peuvent poster des images faisant admettons:
2500px par 2500px et que pour un membre ayant une petite résolution d'écran,il sera pénalisé .
bonjour phil, effectivement je ne pansé plus au petit écran voir tablette, donc 2500 oké;
pour le reste pardon je me suis mal exprimé je ne souhaite pas quelle s'ouvre seul quant je disais naturellement, je voulais dire au format origine d'enregistrement (grandeur image original)
je souhaite que les images s'ouvre en un clic comme sur ton forum. encore mille excuse mon cerveau me fais toujours défaut.
je viens de remarqué, est t'il possible de faire avec les flèches défilement images, uniquement sur les page sujets approprié quant il y a plusieurs images poster exemple https://www.quadsalvetain.com/t4391-scrambler-xp-1000cc-2019#82101
amicalement
pour le reste pardon je me suis mal exprimé je ne souhaite pas quelle s'ouvre seul quant je disais naturellement, je voulais dire au format origine d'enregistrement (grandeur image original)
je souhaite que les images s'ouvre en un clic comme sur ton forum. encore mille excuse mon cerveau me fais toujours défaut.
je viens de remarqué, est t'il possible de faire avec les flèches défilement images, uniquement sur les page sujets approprié quant il y a plusieurs images poster exemple https://www.quadsalvetain.com/t4391-scrambler-xp-1000cc-2019#82101
amicalement
Re Dan,
tu peux tester ce script (en supprimant l'autre) stp:
Ici on dépose le nombre d'images désirées pour déclencher la FancyBox:
Le script va rechercher le nombre d'images dans un message (3) pour le test.
Si tu désires que la Fancybox se déclenche si un message contient 2 images,
il faudra modifier le chiffre 3 par 2 .
tu peux tester ce script (en supprimant l'autre) stp:
- Code:
$(function () {
$('.post-entry').each(function(){
//METTRE LE NOMBRE D IMAGES POUR DECLANCHER LA FANCYBOX
var nombre=3;
var a=$(this).find('img').css({maxWidth:'100%'}).length;
if(a>=nombre){$(this).addClass('M14_fancy');}
}); });
$(function () {
var getFancy = function () {
$('head').append('<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.4.2/jquery.fancybox.min.css"/><style>.fancybox-content{transition:none}</style>');
$.ajax({url:'https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.4.2/jquery.fancybox.min.js',cache:true,dataType:"script"}).then(function(){
$.fancybox.defaults.hideScrollbar = false;
});
getFancy = function () {};
};
var contents = $('.post-entry.M14_fancy');
contents.find('img').css({maxWidth:'100%'}).load(function () {
if (100 < this.naturalWidth || 100 < this.naturalHeight) {
$(this).wrap($('<a data-fancybox="gallery"/>').prop('href', $(this).prop('src'))).unbind('load');
getFancy();
}
}).load();
});
Ici on dépose le nombre d'images désirées pour déclencher la FancyBox:
- Code:
//METTRE LE NOMBRE D IMAGES POUR DECLENCHER LA FANCYBOX
var nombre=3;
Le script va rechercher le nombre d'images dans un message (3) pour le test.
Si tu désires que la Fancybox se déclenche si un message contient 2 images,
il faudra modifier le chiffre 3 par 2 .
Sujets similaires
Créer un compte ou se connecter pour répondre
Vous devez être membre pour répondre.
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum