Pagina 1 di 1

Zoom immagini passaggio mouse

Inviato: 08/11/2010, 17:00
da anairolf
Ciao a tutti,

sono neofita di oscommerce, ma devo dire che leggendo sul vostro forum e su quello inglese riesco quasi sempre a capire come apportare piccole modifiche al mio sito in costruzione.
Avrei una domanda per voi. Ho cercato un po' sul forum delle contribution per aggiungere immagini multiple per ogni prodotto in vendita e ingrandire la foto senza aprire una popup.
Tra le varie opzioni alla fine ho deciso di usare Simple Multi Image Add-on (Un-Limited) with FancyBox Popups.
Ci ho messo un po' a capire l'errore che commettevo ma con il 3d di supporto sono riuscita ad ottenere l'ingrandimento della foto prodotto nella scheda prodotto senza aprire pop-up e posso inserire più immagini dello stesso prodotto.

La domanda ora è: vorrei ingrandire l'immagine prodotto che compare nella lista prodotti di categoria (quella lista che esce quando si clicca su una categoria) al passaggio del mouse (al click normalmente ci porta alla scheda prodotto).
Qual è la maniera più semplice che resti compatibile con lo script che ho installato prima?
Si potrebbe fare con i CSS direttamente? Un aiutino?

Grazie!

Re: Zoom immagini passaggio mouse

Inviato: 08/11/2010, 17:24
da dynamo
installare la contribution nel file product_listing.php

Re: Zoom immagini passaggio mouse

Inviato: 08/11/2010, 17:32
da anairolf
dynamo ha scritto:installare la contribution nel file product_listing.php

ciao dynamo :D
intendi dire che dovrei mettere il codice che misi in product_info.php anche in product_listing?
Le modifiche vanno fatte allo stesso modo del primo file?
E l'immagine si ingrandirà al click, come impostare il passaggio del mouse?

Re: Zoom immagini passaggio mouse

Inviato: 08/11/2010, 18:32
da dynamo
non posso sapere se i passaggi saranno uguali... saranno molto simili se hai "capito" quello che hai fatto in product_info dovresti riuscire ad adattare la contribution per questo nuovo file

Re: Zoom immagini passaggio mouse

Inviato: 08/11/2010, 19:25
da anairolf
dynamo ha scritto:non posso sapere se i passaggi saranno uguali... saranno molto simili se hai "capito" quello che hai fatto in product_info dovresti riuscire ad adattare la contribution per questo nuovo file

eh, non l'ho capito, per cui non saprei come adattarla :?
mi sa che devo rinunciarci. io pensavo di fare una cosa semplice con javascript o css ancora meglio.
se qualcuno l'ha fatto mi dia un riferimento per favore, grazie

Re: Zoom immagini passaggio mouse

Inviato: 08/11/2010, 19:52
da dynamo
in ogni caso mi pare di capire dai tuoi post che non hai o sono minime le conoscenze in php mysql ti consiglio di studiarti le guide di html.it perchè altrimenti la tua vita sarà mooooooolto dura ;)

Re: Zoom immagini passaggio mouse

Inviato: 08/11/2010, 19:59
da anairolf
dynamo ha scritto:in ogni caso mi pare di capire dai tuoi post che non hai o sono minime le conoscenze in php mysql ti consiglio di studiarti le guide di html.it perchè altrimenti la tua vita sarà mooooooolto dura ;)
si, sono minimissime per il php.
spero di imparare dalle guide che mi suggerisci, ora me le cerco un po'.
in ogni caso grazie :oops:

Re: Zoom immagini passaggio mouse

Inviato: 16/11/2010, 19:41
da Dax87
ecco un suggerimento trovato dai nostri amici americani/inglesi:

Hi,

1. Open your working product info.php and from there add the following code, its in the install.txt file

2. Open catalog/product_info.php

Find </head>

just above add

<link rel="stylesheet" href="lightbox/lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="lightbox/prototype.js"></script>
<script type="text/javascript" src="lightbox/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="lightbox/builder.js"></script>
<script type="text/javascript" src="lightbox/lightbox.js"></script>


3. Next you need to edit the code which displays popup images and add the relation to lightbox, rel="lightbox", you will find this lower down the product_info.php around line 108 staring with <script language="javascript"><!--
document.write('<?php echo '<a href="java script:popupWindow .

If you do a search for "ENLARGE" you should find it

With clean MS2.2 Find

<script language="javascript"><!--
document.write('<?php echo '<a href="java script:popupWindow(\\\'' . tep_href_link(FILENAME_POPUP_IMAGE, 'pID=' . $product_info['products_id']) . '\\\')">' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], addslashes($product_info['products_name']), SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>');
//--></script>
<noscript>
<?php echo '<a href="' . tep_href_link(DIR_WS_IMAGES . $product_info['products_image']) . '" target="_blank">' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], $product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>
</noscript>

Replace with

<script language="javascript"><!--
document.write('<?php echo '<a href="' . tep_href_link(DIR_WS_IMAGES . $product_info['products_image']) . '" target="_blank" rel="lightbox" title="'.$product_info['products_name'].'" >' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], $product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>');
//--></script>
<noscript>
<?php echo '<a href="' . tep_href_link(DIR_WS_IMAGES . $product_info['products_image']) . '" target="_blank" rel="lightbox" title="'.$product_info['products_name'].'" >' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], $product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>');
</noscript>

4. Test and then upload to your live server

PROVATO semplicissimo e funzionale...

ps: per le images/e i js del lightbox le trovi qui:
http://addons.oscommerce.com/info/5456

Re: Zoom immagini passaggio mouse

Inviato: 16/11/2010, 20:12
da anairolf
Dax87 ha scritto:ecco un suggerimento trovato dai nostri amici americani/inglesi:

Hi,

1. Open your working product info.php and from there add the following code, its in the install.txt file

2. Open catalog/product_info.php

Find </head>

just above add

<link rel="stylesheet" href="lightbox/lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="lightbox/prototype.js"></script>
<script type="text/javascript" src="lightbox/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="lightbox/builder.js"></script>
<script type="text/javascript" src="lightbox/lightbox.js"></script>


3. Next you need to edit the code which displays popup images and add the relation to lightbox, rel="lightbox", you will find this lower down the product_info.php around line 108 staring with <script language="javascript"><!--
document.write('<?php echo '<a href="java script:popupWindow .

If you do a search for "ENLARGE" you should find it

With clean MS2.2 Find

<script language="javascript"><!--
document.write('<?php echo '<a href="java script:popupWindow(\\\'' . tep_href_link(FILENAME_POPUP_IMAGE, 'pID=' . $product_info['products_id']) . '\\\')">' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], addslashes($product_info['products_name']), SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>');
//--></script>
<noscript>
<?php echo '<a href="' . tep_href_link(DIR_WS_IMAGES . $product_info['products_image']) . '" target="_blank">' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], $product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>
</noscript>

Replace with

<script language="javascript"><!--
document.write('<?php echo '<a href="' . tep_href_link(DIR_WS_IMAGES . $product_info['products_image']) . '" target="_blank" rel="lightbox" title="'.$product_info['products_name'].'" >' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], $product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>');
//--></script>
<noscript>
<?php echo '<a href="' . tep_href_link(DIR_WS_IMAGES . $product_info['products_image']) . '" target="_blank" rel="lightbox" title="'.$product_info['products_name'].'" >' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], $product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>');
</noscript>

4. Test and then upload to your live server

PROVATO semplicissimo e funzionale...

ps: per le images/e i js del lightbox le trovi qui:
http://addons.oscommerce.com/info/5456
grazie mille, ci proverò. anche se non sono tanto convinta della scelta, nel senso che ho visto l'effetto su un sito che ho trovato per caso ed è snervante il fatto che si apra un'immagine al solo passaggio del mouse, toglie ogni curiosità al visitatore, anche perchè nell'elenco prodotti ho ingrandito abbastanza le foto per permettere al visitatore di entrare nelle schede dei prodotti che pensa possano interessargli, evitando che si apra continuamente una foto.
in ogni caso grazie mille, potrebbe tornarmi utile

Re: Zoom immagini passaggio mouse

Inviato: 17/11/2010, 14:45
da Dax87
anairolf ha scritto:
grazie mille, ci proverò. anche se non sono tanto convinta della scelta, nel senso che ho visto l'effetto su un sito che ho trovato per caso ed è snervante il fatto che si apra un'immagine al solo passaggio del mouse, toglie ogni curiosità al visitatore, anche perchè nell'elenco prodotti ho ingrandito abbastanza le foto per permettere al visitatore di entrare nelle schede dei prodotti che pensa possano interessargli, evitando che si apra continuamente una foto.
in ogni caso grazie mille, potrebbe tornarmi utile
Se vuoi provare a vedere l'effetto visita il mio sito lo trovi nella firma..
Infatti l'effetto è quello che dici te ovvero ti apre l'immagine solo quando va nella scheda prodotto e non nella home o nei box laterali...
volendo c'e la possibilita' anche di aggiungere immagini extra e sempre con il lightbox pero' questa altra parte di codice ancora non l'ho inserita perche' tanto per quanto riguarda il mio store non mi serve per ora... e cmq questa funzione non apre la pagina al passaggio del mouse ma praticamente ti zoom l'immagine se il cliente clicca ovvero invece di aprirsi in popup si apre nella pagina stessa della scheda prodotto .. ormai sono tutti cosi i sistemi di zoom immagine nei vari siti.

Re: Zoom immagini passaggio mouse

Inviato: 17/11/2010, 16:31
da anairolf
Dax87 ha scritto:
Se vuoi provare a vedere l'effetto visita il mio sito lo trovi nella firma..
Infatti l'effetto è quello che dici te ovvero ti apre l'immagine solo quando va nella scheda prodotto e non nella home o nei box laterali...
volendo c'e la possibilita' anche di aggiungere immagini extra e sempre con il lightbox pero' questa altra parte di codice ancora non l'ho inserita perche' tanto per quanto riguarda il mio store non mi serve per ora... e cmq questa funzione non apre la pagina al passaggio del mouse ma praticamente ti zoom l'immagine se il cliente clicca ovvero invece di aprirsi in popup si apre nella pagina stessa della scheda prodotto .. ormai sono tutti cosi i sistemi di zoom immagine nei vari siti.
ah e l'effetto nella scheda prodotto l'ho già messo così come nel tuo. ho usato la contribution "simple multiple images"

Re: Zoom immagini passaggio mouse

Inviato: 17/11/2010, 20:14
da Dax87
anairolf ha scritto:
Dax87 ha scritto:
Se vuoi provare a vedere l'effetto visita il mio sito lo trovi nella firma..
Infatti l'effetto è quello che dici te ovvero ti apre l'immagine solo quando va nella scheda prodotto e non nella home o nei box laterali...
volendo c'e la possibilita' anche di aggiungere immagini extra e sempre con il lightbox pero' questa altra parte di codice ancora non l'ho inserita perche' tanto per quanto riguarda il mio store non mi serve per ora... e cmq questa funzione non apre la pagina al passaggio del mouse ma praticamente ti zoom l'immagine se il cliente clicca ovvero invece di aprirsi in popup si apre nella pagina stessa della scheda prodotto .. ormai sono tutti cosi i sistemi di zoom immagine nei vari siti.
ah e l'effetto nella scheda prodotto l'ho già messo così come nel tuo. ho usato la contribution "simple multiple images"
ah ok... invece te intendevi che ti si apra l'immagine al passaggio del mouse un po' come la nuova funzione nelle pagine di ricerca di google !? che affianco all' URL ti apre direttamente la pagina in anteprima...
Non male come idea.... allora penso che basti trovare uno script che faccia questo e poi integrarlo nelle pagine di tuo interesse...

Re: Zoom immagini passaggio mouse

Inviato: 18/11/2010, 20:22
da Dax87
ma porca vacca....
ho toccato qualcosa nel pannello di amministrazione avevo messo un true al posto di un false..
Adesso il Lightbox NON mi funziona piu' anche se il sorgente product_info.php è corretto.. Anche le immagini extra in lightbox non mi fungono :((

devo toccare qualcosa nel database??? ma non ho idea di dove toccare... devo andare in images su pannello amministrazione? oppure modificare qualche codice dove ci sono gli script per il popup di immagine?? pero' mi sembra tutto corretto :((

esempio:

http://www.piatino.it/Store/product_inf ... cts_id=190

Re: Zoom immagini passaggio mouse

Inviato: 18/11/2010, 21:34
da anairolf
Dax87 ha scritto:ma porca vacca....
ho toccato qualcosa nel pannello di amministrazione avevo messo un true al posto di un false..
Adesso il Lightbox NON mi funziona piu' anche se il sorgente product_info.php è corretto.. Anche le immagini extra in lightbox non mi fungono :((

devo toccare qualcosa nel database??? ma non ho idea di dove toccare... devo andare in images su pannello amministrazione? oppure modificare qualche codice dove ci sono gli script per il popup di immagine?? pero' mi sembra tutto corretto :((

esempio:

http://www.piatino.it/Store/product_inf ... cts_id=190
mmmm e cosa avevi modificato?
forse basterebbe ripristinare un file sotto admin... ma a capire quale sarà stato modificato...

Re: Zoom immagini passaggio mouse

Inviato: 19/11/2010, 20:22
da Dax87
anairolf ha scritto:
Dax87 ha scritto:ma porca vacca....
ho toccato qualcosa nel pannello di amministrazione avevo messo un true al posto di un false..
Adesso il Lightbox NON mi funziona piu' anche se il sorgente product_info.php è corretto.. Anche le immagini extra in lightbox non mi fungono :((

devo toccare qualcosa nel database??? ma non ho idea di dove toccare... devo andare in images su pannello amministrazione? oppure modificare qualche codice dove ci sono gli script per il popup di immagine?? pero' mi sembra tutto corretto :((

esempio:

http://www.piatino.it/Store/product_inf ... cts_id=190
mmmm e cosa avevi modificato?
forse basterebbe ripristinare un file sotto admin... ma a capire quale sarà stato modificato...
risolto risolto... Finalmente ho in lightbox sia l'immagine prodotto che anche immagini extra nel caso le voglia inserire.. come nel link presente che avevo segnalato per il malfunzionamento del mio store.. :mrgreen:
Penso ci fossero' errori negli script lightbox :twisted: