AwesomeBB : Zoom au clic sur image

[*Splash*]

Hi,

Lorsque l'on clique sur une image insérée dans un post nous sommes redirigés vers Servimg, ou autre selon l'hébergeur.
Existe-t-il un moyen d'installer un code js pour qu'au clic on reste sur le forum et que l'image s'affiche en taille réelle ?

Merci d'avance

EDIT

J'ai trouvé une alternative avec un zoom au passage de la souris sur l'image.

Code CSS :

Code:

/* zoom au passage de la souris */
.zoom {
width: 320px;
height: 240px;
}
.image {
width: 100%;
height: 100%;
}
.image img {
-webkit-transition: all 1s ease; /* Safari et Chrome */
-moz-transition: all 1s ease; /* Firefox */
-ms-transition: all 1s ease; /* Internet Explorer 9 */
-o-transition: all 1s ease; /* Opera */
transition: all 1s ease;
}
.image:hover img {
-webkit-transform:scale(1.50); /* Safari et Chrome */
-moz-transform:scale(1.50); /* Firefox */
-ms-transform:scale(1.50); /* Internet Explorer 9 */
-o-transform:scale(1.50); /* Opera */
transform:scale(1.50);
}
/* fin du zoom */

Pour que cela soit fonctionnel il faut mettre l'url de l'image à l'intérieur d'une div, ce code :

Code:

<div class=zoom>
 <div class=image>
 <img src=img.jpg>
 </div>
</div>

Reste à intégrer cette div dans un js pour n'avoir qu'à poster l'url de l'image seule et profiter du zoom

[*Splash*]

[*Splash*]

[*Splash*]

[Invité]

Hello *Splash*,

tu peux tester ce script stp


Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript

Mets un titre explicite.
Coches Sur les sujets

Déposes ceci:

Code:


$(function(){
$('.post-content').find('img:not(longdesc)').each(function(){
var a=$(this).closest('a').length;
if(a)
{
$(this).closest('a').removeAttr('href'); 
 
}
});});



Penses à cliquer sur le bouton VALIDER


a++

[*Splash*]

Hi Milouze,

Non ce js n'active pas le zoom

[Invité]

Re,
même sans le zoom cher ami .

Le script désactive le lien des images ...

a++

[*Splash*]

Ah OK

Ce que je cherche à faire c'est mettre cette div dans un js pour avoir un zoom sur image

Code:

<div class=zoom>
 <div class=image>
 <img src=img.jpg>
 </div>
</div>

[Invité]

Hello *Splash*,

ce script alors:

Code:


$(function(){
  var e=$('<div class=zoom><div class=image></div></div>');
$('.post-content').find('img:not(longdesc)').each(function(){
var a=$(this).closest('a').length;
if(a)
{
$(this).closest('a').removeAttr('href').wrap(e); 
 
}
});});


Le résultat sur un message sera:

Code:


<div class="zoom">
<div class="image"><a target="_blank" rel="nofollow"><img src="https://i.servimg.com/u/f18/18/21/41/30/warn-f10.png" alt=""></a></div></div>


a++

[*Splash*]

Super, Merci Milouze