Sujet fermé
Note de ce sujet :
  • Moyenne : 0 (0 vote(s))
  • 1
  • 2
  • 3
  • 4
  • 5

[Résolu]Gallerie : Visuel d'images en largeur compressées
#1

Citation :#~~~~~ DEBUT BLOC A NE PAS SUPPRIMER ~~~~~
#~ Version du CMS: 1.11.13
#~ Url du site : http://www.les-arts-du-coin.fr
#~ Hébergeur / Soft : ovh
#~ Informations Système :
#~ ----------------------------------------------
#~ Cms Version: 1.11.13
#~ Installed Modules:
#~ CMSMailer: 5.2.2
#~ CMSPrinting: 1.0.5
#~ FileManager: 1.4.5
#~ MenuManager: 1.8.6
#~ MicroTiny: 1.2.9
#~ ModuleManager: 1.5.8
#~ News: 2.15.1
#~ Search: 1.7.12
#~ ThemeManager: 1.1.8
#~ CGExtensions: 1.46.4
#~ CGSmartImage: 1.18
#~ Gallery: 2.0.2
#~ Captcha: 0.5.2
#~ FormBuilder: 0.8.1.1
#~ CGJobMgr: 1.3.4
#~ NMS: 2.9.5
#~ CGSimpleSmarty: 1.8
#~ CGContentUtils: 1.5
#~ Cataloger: 0.11.3
#~ Config Information:
#~ php_memory_limit:
#~ process_whole_template:
#~ max_upload_size: 64000000
#~ url_rewriting: none
#~ page_extension:
#~ query_var: page
#~ image_manipulation_prog: GD
#~ auto_alias_content: true
#~ locale: fr_FR.utf8
#~ default_encoding: utf-8
#~ admin_encoding: utf-8
#~ set_names: true
#~ Php Information:
#~ phpversion: 5.5.22
#~ md5_function: On (Vrai)
#~ gd_version: 2
#~ tempnam_function: On (Vrai)
#~ magic_quotes_runtime: Off (Faux)
#~ E_STRICT: 0
#~ E_DEPRECATED: 0
#~ memory_limit: 512M
#~ max_execution_time: 300
#~ output_buffering: 4096
#~ safe_mode: Off (Faux)
#~ file_uploads: On (Vrai)
#~ post_max_size: 64M
#~ upload_max_filesize: 64M
#~ session_save_path: /tmp (0700)
#~ session_use_cookies: On (Vrai)
#~ xml_function: On (Vrai)
#~ xmlreader_class: On (Vrai)
#~ Server Information:
#~ Server Api: fpm-fcgi
#~ Server Db Type: MySQL (mysql)
#~ Server Db Version: 5.1.73
#~ Server Db Grants: Impossible de trouver un privilège "GRANT ALL". Cela peut signifier que vous pourriez avoir des problèmes pour installer ou retirer des modules, ou encore l 'ajout et la suppression d'éléments, y compris les pages.
#~ Server Time Diff: Aucune différence de date du système de fichiers trouvées
#~ ----------------------------------------------
#~~~~~ FIN BLOC A NE PAS SUPPRIMER ~~~~~



Bonjour,

J'ai un souci avec mes galeries d'images et le gabarit Lightbox.
Mes modules sont mis à jour...
Tout fonctionnait nickel et depuis un moment, le visuel "zoomé" de mes images est compressé en largeur.
Pour les vignettes qui apparaissent sur mes pages : pas de souci. J'ai bien un les vignettes carrées demandées et recadrées... En revanche, lorsqu'on clique sur l'une d'entre elles : L'image agrandi a la bonne hauteur mais se trouve compressée en largeur... Exemple
J'ai bien sûr essayé d'intervenir (sans succès) sur le CSS correspondant de Lightbox que voici :

Code :
[== Indéfini ==]
.gallery .img {
    height: 120px;
    /*width: 120px;   Adjust as you see fit */
    float: left;
    margin: 10px;
    text-align: center;
}

.gallery .img a {
    display: inline-block;
    border: 2px solid #ddd;
    padding: 1px;
}

.gallery .img a:hover {
    border-color: #999;
}

.gallery img {
    border: none;
}

.gallery .pagenavigation {
    height: 5px;
}

.gallery .prevpage a, .gallery .prevpage em {
    display: block;
    width: 50px;
    height: 39px;
    float: left;
    margin: 0;
    text-indent: -1000px;
    background: url(../../images/previous.png) transparent no-repeat 0 0;
    overflow: hidden;
}

.gallery .nextpage a, .gallery .nextpage em {
    display: block;
    width: 50px;
    height: 39px;
    float: left;
    margin: 0 6px 0 0;
    text-indent: -1000px;
    background: url(../../images/next.png) transparent no-repeat 0 0;
    overflow: hidden;
}

.gallery .parentlink a {
    display: block;
    width: 50px;
    height: 39px;
    float: left;
    text-indent: -1000px;
    background: url(../../images/uppage.png) transparent no-repeat 0 0;
    overflow: hidden;
}

.gallery .pagenavigation a:hover {
    background-position: 0 -40px;
}

.gallery .prevpage em, .gallery .nextpage em {
    background-position: 0 -80px;
}

.gallery .pagelinks {
    float: right;
    border-right: 2px solid #666;
}

.gallery .pagelinks a, .gallery .pagelinks em {
    margin-top: 6px;
    padding: 0 6px;
    border-left: 2px solid #666;
    text-align: center;
    font: bold 11px verdana; color: #666;
}

.gallery .pagelinks em {
    color: #000;
}

.galleryclear {
    clear: both;
}


/* LIGHTBOX  -  version 2.51 */

#lightboxOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: black;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
  opacity: 0.85;
  display: none;
}

#lightbox {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 10000;
  text-align: center;
  line-height: 0;
  font-family: "lucida grande", tahoma, verdana, arial, sans-serif;
  font-weight: normal;
}

#lightbox img {
  width: auto;
  height: auto;
}

#lightbox a img {
  border: none;
}

.lb-outerContainer {
  position: relative;
  background-color: white;
  *zoom: 1;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
}

.lb-outerContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-container {
  padding: 10px;
}

.lb-loader {
  position: absolute;
  top: 40%;
  left: 0%;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}

.lb-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}

.lb-container > .nav {
  left: 0;
}

.lb-nav a {
  outline: none;
}

.lb-prev, .lb-next {
  width: 49%;
  height: 100%;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
  /* Trick IE into showing hover */
  display: block;
}

.lb-prev {
  left: 0;
  float: left;
}

.lb-next {
  right: 0;
  float: right;
}

.lb-prev:hover {
  background: url(../lightbox/images/prev.png) left 48% no-repeat;
}

.lb-next:hover {
  background: url(../lightbox/images/next.png) right 48% no-repeat;
}

.lb-dataContainer {
  margin: 0 auto;
  padding-top: 5px;
  *zoom: 1;
  width: 100%;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  -ms-border-bottom-left-radius: 4px;
  -o-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  -ms-border-bottom-right-radius: 4px;
  -o-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.lb-dataContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-data {
  padding: 0 10px;
  color: #bbbbbb;
}

.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em;
}

.lb-data .lb-caption {
  font-size: 13px;
  font-weight: bold;
  line-height: 1em;
}

.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 11px;
}

.lb-data .lb-close {
  width: 35px;
  float: right;
  padding-bottom: 0.7em;
  outline: none;
}

.lb-data .lb-close:hover {
  cursor: pointer;
}

.lb-data .lb-caption>em {
  font-style: normal;
  font-weight: normal;
}

J'ai réinitialisé les valeurs d'origine et là... Miracle, tout revient à la normale !
Je crois avoir résolu mon problème... j'installe une nouvelle galerie et paf, ça recommence.
Je me demande si ça ne provient pas du gabarit javascript (ci-dessous) que je ne maîtrise évidemment pas !?

Code :
[== Indéfini ==]
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="modules/Gallery/templates/lightbox/lightbox.min.js"></script>

Merci, si vous avez une piste.

Rolleyes
Sujet fermé


Messages dans ce sujet

Atteindre :


Utilisateur(s) parcourant ce sujet : 1 visiteur(s)