inserire i tasti prev e next su Fancybox

4 contenuti / 0 new
Accedi o registrati per inserire commenti.
Ultimo contenuto
Lun, 16/05/2011 - 14:01
#1
joseffo
Ritratto di joseffo
inserire i tasti prev e next su Fancybox

Ciao a tutti, sono ore che non trovo la soluzione a questo problema..
Ho integrato Flickr su Drupal e ho installato la libreria Fancybox (simile a Lightbox). Fin qui tutto ok, ho modificato il file template.php in modo che, se clicco sull'immagine mi si ingrandisce con l'effetto appunto fancybox... ma non ho la possibilità di passare da un immagine all'altra cliccando next e prev perchè non appaiono sulla schermata.. So che si può fare ma ho fatto di tutto (compresa l'installazione del modulo fancybox) ma non ne vengo a capo..
Qui sotto è il codice che ho inserito in template.php che mi fa vedere le immagini senza il prev e il next

// includi il css di fancybox
drupal_add_css("sites/all/fancybox/jquery.fancybox-1.3.4.css");
// includi lo script di fancybox
drupal_add_js("sites/all/fancybox/jquery.fancybox-1.3.4.js");
// includi lo script per il png fix
drupal_add_js("sites/all/fancybox/jquery.easing-1.3.pack.js");
//funzione jquery che attiva l'effetto su tutte le immagini contenute nel div con classe "flickr-photoset"
drupal_add_js (
    '$(document).ready(function(){$("div.flickr-photoset a").fancybox({"overlayShow": true });}); ',
    'inline');

Probabilmente devo lavorare su .fancybox({"overlayShow": true }); ma non so cosa scriverci..
Qualcuno sa darmi una mano?
Grazie mille

In cima
Gio, 19/05/2011 - 20:11
ealmuno
Ritratto di ealmuno

Se non erro in fancybox bisogna dare una identificativo alle immagini (esempio:rel="img") che poi dovrà essere usato nel js per mostrare le freccie (cioè prende tutte le immagini come se fosse una galleria), cmq è tutto spiegato nella documentazione e negli esempi ufficiali.

http://www.chromeos.eu

In cima
Ven, 20/05/2011 - 08:49
lion
Ritratto di lion

sì effettivamente mi manca l'attributo rel... ma come faccio a crearne uno e poi devo inserirlo nel file js che ho richiamato in template.php cioè in questa stringa?
...
var rel = $(this).attr('rel') || '';

if (!rel || rel == '' || rel === 'nofollow') {
selectedArray.push(this);

} else {
selectedArray = $("a[rel=" + rel + "], area[rel=" + rel + "]");
selectedIndex = selectedArray.index( this );
..
Grazie

In cima
Ven, 20/05/2011 - 15:28
lion
Ritratto di lion

RISOLTO: ho aggiunto il seguente codice all'interno del file flickr.module:

<?php
function yourTheme_flickrfield_photoset($img, $photo_url, $formatter, $photo_data, $node) {
  $output = '<div class="flickr-photoset">';
  if (module_exists('flickr_sets')) {
    $photos = flickr_set_load($photo_data['id']);
    foreach ((array) $photos['photoset']['photo'] as $photo) {
    //insert owner into $photo because theme_flickr_photo needs it
    $photo['owner'] = $photos['photoset']['owner'];
    $title = is_array($photo['title']) ? $photo['title']['_content'] : $photo['title'];
    $img = flickr_img($photo, $formatter);
    $original = flickr_photo_img($photo, 'b');
      if (arg(0) == 'node' && arg(1) == $node->nid) {
        $output .= '<div class="flickr-photoset-img flickr-photoset-img-'. $formatter .'">'. l($img, $original, array('attributes' => array('title' => $title, 'rel' => 'photos', 'class' => 'fancybox'), 'absolute' => TRUE, 'html' => TRUE)) .'</div>';
      } else {
      $output .= '<div class="flickr-photoset-img flickr-photoset-img-'. $formatter .'">'. l($img, 'node/'. $node->nid, array('attributes' => array('title' => $title), 'absolute' => TRUE, 'html' => TRUE)) . '</div>';
      }
    }
  } else {
    $title = is_array($photo_data['title']) ? $photo_data['title']['_content'] : $photo_data['title'];
    if (arg(0) == 'node' && arg(1) == $node->nid) {
      $output .= '<div class="flickr-photoset-img">'. $img .'</div>';
    } else {
      $output .= '<div class="flickr-photoset-img">'. l($img, 'node/'. $node->nid, array('attributes' => array('title' => $title), 'absolute' => TRUE, 'html' => TRUE)) . '</div>';
    }
  }
  $output .= '</div>';
  $output .= '<div class="flickr-photoset-meta">';
  $output .= '<p>'. $photo_data['description']['_content'] .'</p>';
  $output .= '<cite>'. l(t('Source: Flickr'), $photo_url) .'</cite>';
  $output .= '</div>';
  return $output;
}
?>

Grazie dell'aiuto!

In cima