Come faccio a creare una galleria immagini come questa?
http://hturkey.ru/prodaja/alanya/kvartiry/140
C'è un modulo che lo possa fare? Scusate ma non riesco a capire come si chiama questo tipo di galleria che pure è molto diffusa per poterla cercare tra i moduli o tra i forum. Potreste quindi dirmi anche il nome (esempi: carousel, slideshow, accordion)
Dando uno sguardo al codice mi sembra una semplice composizione HTML + Javascript che fa uso della funzione changeImage:
function changeImage(img) {document.getElementById('picture').src = img
}
Quindi le varie immagini sono così disposte:
<div class="pimages"><div class="iprim"><img id="picture" src="http://hturkey.ru/files/obj/15/1_1200918192.jpg" /></div><a href="javascript:changeImage('http://hturkey.ru/files/obj/15/1_1200918192.jpg');"><img src="http://hturkey.ru/files/obj/15/1_1200918192_thumbnail.jpg" width="113" height="85" /></a>
<a href="javascript:changeImage('http://hturkey.ru/files/obj/15/3_1200918216.jpg');"><img src="http://hturkey.ru/files/obj/15/3_1200918216_thumbnail.jpg" width="113" height="85" /></a>
....
Ho tolto i tag title e alt per semplificare il tutto comunque se ti piace questa soluzione puoi ottenerla personalizzando la visualizzazione dei campi CCK image creando un nuovo tipo di contenuto con questi elementi e riscrivendo la parte relativa al tema.
Quindi non esistono moduli gia pronti?
Mi sembra che tale modulo ci fosse, ma non sono riuscito a ritrovartelo.
Come alternativa puoi provare se ti va bene http://drupal.org/project/flash_gallery che da un risultato simile apprezzabile.
(Ma richiede flash, guarda http://www.endymios.com/fgallery/8 per una dimostrazione)
Avevo gia visto quella galleria ma io cercavo proprio un'implementazione javascript. Di fare come mi ha consigliato Thecrow però non saprei da dove iniziare...
Grazie alle dritte di The Crow sono riuscito a creare una galleria con HTML + JavaScript e a temizzare il nodo relativo. Ma non ho capito come usare CCK. Se inserisco manualmente i dati delle immagini ecc è tutto facile, ma mi piacerebbe poter caricare le immagini tramite CCK (il che non è un problema) e fare in modo che le immagini vengano riconosciute e caricate automaticamente dalla
function changeImage(img)(che invece per me è un problema).Per il theming delle immagini caricate con CCK uso il seguente codice preso da http://www.davidnewkerk.com/book/30 (per gli interessati il tutorial inizia qui http://www.davidnewkerk.com/book/18):
<div id="field_img" class="field-item"><?php foreach ((array)$field_img as $item) { ?>
<div class="field-image"><?php print $item['view'] ?>
</div>
<?php } ?>
</div>
Però non capisco come far interagire questo codice con la
function changeImage(img).Qualcuno ci ha provato e sa come fare?
Ciao e grazie
mmm guarda non c'ho provato, però se piazzi temporaneamente un
</div><div class="pimages"><div class="iprim"><img id="picture" src="default.jpg" /></div>
<div id="field_img" class="field-item">
<?php foreach ((array)$field_img as $item) { ?>
<div class="field-image">
<?php print '<a href="javascript:changeImage(\''. $item['path'] .'\')'. theme('image', $item['path']) .'</a>'; ?>
</div>
<?php } ?>
</div>
Per le altre opzioni guardati la funzione theme_image. Per fare il link non può essere usata la funzione l perché filtra javascript...
Cercando un po' tra i moduli ho trovato comicview un modulo in dev, dalla demo sembra funzionare e fa qualcosa di simile forse modificandolo o incorporando le istruzioni jquery in questa soluzione si fa qualcosa di più pulito :))
Grazie 1000 !!!
Mi fiondo a smanettare ;-)
Ecco il codice perfettamente funzionante (grazie a Mavimo) utilizzando CCK per fare l'upload delle immagini e ImageCache. CSS e misure da sistemare a piacere.
Supponiamo che il nostro campo CCK si chiami
field_galleria_immagine<script type="text/javascript">function changeImage(img) { document.getElementById('picture').src = img ; }</script><div class="div_1">
<div class="div_2">
<div class="div_3">
<img id="picture" src="<?php" rel="nofollow">http://miosito.com/<?php</a> print $node->field_galleria_immagine[0]['filepath']; ?>" width="482" height="361" alt="<?php print $node->field_galleria_immagine[0]['data']['description']; ?>" title="<?php print $node->field_galleria_immagine[0]['data']['description']; ?>" />
</div>
<div class="field field-type-image field-field-galleria-immagine">
<div class="field-label">Immagine Galleria:</div>
<div class="field-items">
<div id="field_galleria_immagine" class="field-item">
<?php foreach ($node->field_galleria_immagine as $item) { ?>
<div class="field-image">
<?php print '<a href="javascript:changeImage(\'/immobiliare/' . $item['filepath'] .'\')" >' . $item['view'] .'</a>'; ?>
</div>
<?php } ?>
</div>
</div>
</div>
</div>
</div>
</div>
Ciao :)