2013-10-03 2 views
1

J'écris un projet et j'ai 3 vignettes par rangée.Twitter bootstrap image tournant (non désirée)

Chacun a ce code:

<ul class="thumbnails"> 
     <?php foreach($list_pjt as $progetto): ?> 
      <?= ($row_close_after_three_thumbs == 0) ? '<div class="row-fluid">' : '' ; ?> 
      <li class="span4 pjt-thumb" > 
       <div class="thumbnail alert-<?= $status_bg ?>"> 
       <?php 
        $img_thumb_pjt = ($progetto->img == '' || $progetto->img == '0') ? "img/site_basics/pjt_thumb.jpg" : "upload/$progetto->pjt_table/".$this->session->userdata('user_id')."/$progetto->img" ; 
       ?> 
       <img src="<?= base_url($img_thumb_pjt) ?>" alt="ALT NAME"> 
       <div class="caption text-center"> 
        <h5><?= (strlen($progetto->pjt_name) > 25) ? substr($progetto->pjt_name, 0, 25).'...' : $progetto->pjt_name ?></h5> 
        <p class="badge badge-inverse"><small><?= $type_name ?></small></p> 

        <p><small><?= $this->lang->line('profile_last_mod') ?>:<br><?= timestamp_to_date($progetto->last_mod, $this->session->userdata('lang')) ?></small></p> 
        <p><small><i class="icon <?= $status_icon ?>"></i> <?= $status_txt ?></small></p> 
       <?php if($progetto->completato != 0): ?> 
        <p><a href="<?= base_url('project/showpjt/'.$progetto->id_pjt) ?>" class="btn btn-<?= $btn_color ?> btn-block"><?= $this->lang->line('profile_open') ?></a></p> 
       <?php else: ?> 
        <p><a href="<?= base_url('project/newpjt/'.$progetto->pjt_table.'/'.$progetto->id_acquisto) ?>" class="btn btn-<?= $btn_color ?> btn-block"><?= $this->lang->line('profile_edit') ?></a></p> 
       <?php endif; ?> 

       </div> 
       </div> 
      </li> 
     <?php endforeach; ?> 
    </ul> 

Quelques photos, par ce que je vois ceux qui sont prises horizontalement, apparaissent bien (voir capture d'écran à droite) les autres sont en rotation (image capture d'écran un)

Ceci est la capture d'écran: Result

Une raison pour cela? Comment je le répare?

Comme une note, ceci est l'image téléchargée (droite ...): Original Picture

Répondre

10

Ce n'est pas Bootstrap, le problème est les métadonnées d'image. Si vous inspectez vous trouverez:

kMDItemOrientation = 1 

Ainsi, votre iPhone et l'ordinateur sont la lecture de ces métadonnées et de corriger l'orientation avant de montrer l'image, mais les navigateurs ne le font pas. La capture d'écran montre l'image telle qu'elle est, sans lire les métadonnées.

Demandez à Google sur la suppression des métadonnées de l'image (il ya beaucoup de façons en fonction de votre système d'exploitation), puis vrai-tourner avant le téléchargement et le problème sera résolu.