Réduire automatiquement les images sur le forum

EDN Maitre-Sage

Rang

Inscrit le : 23/02/2010 à 09h15

Le 28/01/2011 à 14h45

Bonjour

Comment faire svp pour réduire automatiquement les images qu'on insère dans le forum, à une certaine dimension?

J'ai regardé dans les documentations de support, mais je suis étonné de n'avoir rien trouvé à ce sujet.

Merci beaucoup

Site : http://passion-truck.fr/site

planet-truck.fr

Site web

saturnin

Administrateur

Rang

Inscrit le : 08/08/2009 à 22h19

Messages: 3963

Le 28/01/2011 à 21h35

les reduire ?
les redimensionner en css ?

ou pour faire comme ça ¿?
pour la premiere solution c'est un redimentionnement en css sur la classe image, ou par filiation de l'image, par max-width, max-height (ou un truc du genre) mais sinon il n'y a pas de solution de base de prevu dans pbt.

signaturesaturnin

Accroche toi au clavier, je retire le shell...

Site web

pegasetkc

EDN Maitre-Sage

Rang

Inscrit le : 15/04/2010 à 19h37

Messages: 1940

Le 28/01/2011 à 21h57

le max-width marche très bien sauf pour IE qui le le prend pas en charge en fonction du doctype fait une recherche je donne la solluce dans un post mais je le trouve plus

Citation made in pegasetkc : "Sauvez un arbre mangez un castor"
Depuis que je connais Saturnin mon humour ressemble a cela : j'ai un string dans l'array

Site web

m-ickael

EDN Maitre-Sage

Rang

Inscrit le : 23/02/2010 à 09h15

Messages: 2296

Le 28/01/2011 à 22h01

C'est bien redimensionnement des images, et non l'affichage (Que j'ai pu voir sur un tutos et qui est assez galère à cause du rajout HTML à chaque message).

Niveau css je suis pas trop doué.. donc si quelqu'un à le code à modifier ce serai super.

Merci pour vos réponses.

planet-truck.fr

Site web

pegasetkc

EDN Maitre-Sage

Rang

Inscrit le : 15/04/2010 à 19h37

Messages: 1940

Le 29/01/2011 à 14h38

http://chez-sw an.net/forum/topic-970+redimensionnement-image-auto.php

Citation made in pegasetkc : "Sauvez un arbre mangez un castor"
Depuis que je connais Saturnin mon humour ressemble a cela : j'ai un string dans l'array

Site web

m-ickael

EDN Maitre-Sage

Rang

Inscrit le : 23/02/2010 à 09h15

Messages: 2296

Le 29/01/2011 à 22h09

Salut et merci.

Donc, je copie ce code ci dessous dans le forum.css c'est bien ça ?

Code CSS :

/* redimensionnement auto des images */
#img{
max-width : 800px;
display: block;
margin: 15px auto; 
padding: 0;
border: 10px solid #FFF;
box-shadow: 5px 5px 10px #aaa;
-moz-box-shadow: 5px 5px 10px #aaa;
-webkit-box-shadow: 5px 5px 10px #aaa;
/* IE */
width: expression((this.offsetWidth>=this.offsetHeight) ? 
      Math.min(parseInt(this.offsetWidth), 800 ) : false);
text-align: center;
filter:progid:DXImageTransform.Microsoft.Shadow(color='#aaaaaa', Direction=135, Strength=8); 
zoom: 1; 
}

Et ce cioe pour le HTML je le place dans quoi?

Code HTML :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">

A noter que ce code est obligatoire pour toutes les pages HTML

Merci

Edité par m-ickael Le 29/01/2011 à 22h10

planet-truck.fr

Site web

pegasetkc

EDN Maitre-Sage

Rang

Inscrit le : 15/04/2010 à 19h37

Messages: 1940

Le 29/01/2011 à 22h22

Oui c'est dans forum.css si tu veut modifier uniquement dans forum, mais tu peut aussi le faire dans tout les autres modules

Pour le doctype c'est dans Ton_Thème/header.tpl

Citation made in pegasetkc : "Sauvez un arbre mangez un castor"
Depuis que je connais Saturnin mon humour ressemble a cela : j'ai un string dans l'array

Site web

m-ickael

EDN Maitre-Sage

Rang

Inscrit le : 23/02/2010 à 09h15

Messages: 2296

Le 29/01/2011 à 23h34

Ok merci

J'ai donc tout bien copié (forum.css en bas de page et header.tpl en haut de page forcément), mais cela ne marche pas

J'ai toujours des images énormes.

planet-truck.fr

Site web

pegasetkc

EDN Maitre-Sage

Rang

Inscrit le : 15/04/2010 à 19h37

Messages: 1940

Le 29/01/2011 à 23h41

as tu un liens ou je peut voir le résultat ?

sinon tu est sous quel navigateur ?

Citation made in pegasetkc : "Sauvez un arbre mangez un castor"
Depuis que je connais Saturnin mon humour ressemble a cela : j'ai un string dans l'array

Site web

m-ickael

EDN Maitre-Sage

Rang

Inscrit le : 23/02/2010 à 09h15

Messages: 2296

Le 30/01/2011 à 09h05

Salut.

http://passion-truck.fr/site/forum/index.php puis dans bars du forum et code de la route.

Je suis sous Firefox. Sous chrome et ie9 même résultat.

En te remerciant encore.

planet-truck.fr

Site web

pegasetkc

EDN Maitre-Sage

Rang

Inscrit le : 15/04/2010 à 19h37

Messages: 1940

Le 30/01/2011 à 14h56

okay a 1ere vue c'est generic.css qui est utilisé et non pas forum.css pour la balise img

donc modifier generic.css comme tu l'a fait pour forum

Citation made in pegasetkc : "Sauvez un arbre mangez un castor"
Depuis que je connais Saturnin mon humour ressemble a cela : j'ai un string dans l'array

Site web

m-ickael

EDN Maitre-Sage

Rang

Inscrit le : 23/02/2010 à 09h15

Messages: 2296

Le 30/01/2011 à 15h09

Salut.

Toujours le même problème, visible après insertion d'une autre image au même endroit

Merci

planet-truck.fr

Site web

pegasetkc

EDN Maitre-Sage

Rang

Inscrit le : 15/04/2010 à 19h37

Messages: 1940

Le 30/01/2011 à 15h14

je vois pas la modif du fichier generic.css sur ton site ^^

Citation made in pegasetkc : "Sauvez un arbre mangez un castor"
Depuis que je connais Saturnin mon humour ressemble a cela : j'ai un string dans l'array

Site web

m-ickael

EDN Maitre-Sage

Rang

Inscrit le : 23/02/2010 à 09h15

Messages: 2296

Le 30/01/2011 à 15h16

Ah, je t'assure l'avoir fait.

Voici la fin du code, avec l'ajout du css fourni :

Code CSS :

.error_unknow,.error_success,.error_notice,.error_warning,.error_fatal {
    height:35px;
    width:440px;
    color:#000000;
    border:1px solid #7C7D6A;
    margin:auto;
    padding:0.75em;
    text-align:left;
}
 
html>body .error_unknow,html>body .error_success,html>body .error_notice,html>body .error_warning,html>body .error_fatal
    {
    height:auto;
    min-height:35px;
}
 
.error_handler_position {
margin-top:5px;
margin-bottom:5px;
}
 
/* redimensionnement auto des images */
#img{
max-width : 800px;
display: block;
margin: 15px auto; 
padding: 0;
border: 10px solid #FFF;
box-shadow: 5px 5px 10px #aaa;
-moz-box-shadow: 5px 5px 10px #aaa;
-webkit-box-shadow: 5px 5px 10px #aaa;
/* IE */
width: expression((this.offsetWidth>=this.offsetHeight) ? 
      Math.min(parseInt(this.offsetWidth), 800 ) : false);
text-align: center;
filter:progid:DXImageTransform.Microsoft.Shadow(color='#aaaaaa', Direction=135, Strength=8); 
zoom: 1; 
}

planet-truck.fr

Site web

pegasetkc

EDN Maitre-Sage

Rang

Inscrit le : 15/04/2010 à 19h37

Messages: 1940

Le 30/01/2011 à 15h20

Attend je viens de faire la modif voila la soluce ^^

dans le fichier content.css recherche

Code CSS :

.msg_contents_overflow {
    /* Case du contents du message, évite que les images trop grandes déforme */
    width:99%;
    height:auto;
    min-height:80px;
    overflow:auto;
    padding:10px 0px;
}

et ajoute ce code après :

Code CSS :

 
/* redimensionnement auto des images */
.msg_contents_overflow img{
max-width : 800px;
display: block;
margin: 15px auto; 
padding: 0;
border: 10px solid #FFF;
box-shadow: 5px 5px 10px #aaa;
-moz-box-shadow: 5px 5px 10px #aaa;
-webkit-box-shadow: 5px 5px 10px #aaa;
/* IE */
width: expression((this.offsetWidth>=this.offsetHeight) ? 
      Math.min(parseInt(this.offsetWidth), 800 ) : false);
text-align: center;
filter:progid:DXImageTransform.Microsoft.Shadow(color='#aaaaaa', Direction=135, Strength=8); 
zoom: 1; 
}

Citation made in pegasetkc : "Sauvez un arbre mangez un castor"
Depuis que je connais Saturnin mon humour ressemble a cela : j'ai un string dans l'array

Site web

Easy-Design.Net forum

Aide générale [Réglé] Réduire automatiquement les images sur le forum

Les 10 derniers messages du forum...