[RISOLTO] Aggiungere link alle immagini

wanda

Nuovo Utente
28 Nov 2013
12
0
0
Ciao,
ho una gallery coverflow che funziona benissimo ed è anche molto semplice.
L'unica pecca che ha è che aggiungendo dei link alle immagini nel classico modo <a href="link.html"><img class="cover" src="imgs/01.jpg"/></a>, la gallery non gira più come dovrebbe poichè cliccando sulle immagini successive, invece di scorrere, va diretta in un'altra pagina.
C'è un altro modo per inserire un link alle immagini, aggiungendo un prametro allo script?
Questo è il codice della gallery:

HTML:
<script>
			$(function() {
				function tabsToSpaces(line, tabsize) {
					var out		= '',
						tabsize = tabsize || 4,
						c;
					for (c in line) {
						var ch = line.charAt(c);
						if (ch === '\t') {
							do {
								out += ' ';
							} while (out.length % tabsize);
						} else {
							out += ch;
						}
					}
					return out;
				}

				function visualizeElement(element, type) {
					var code		= $(element).html().split('\n'),
						tabsize		= 4,
						minlength	= 2E53,
						l;

					// Convert tabs to spaces
					for (l in code) {
						code[l] = tabsToSpaces(code[l], tabsize);
					}


					// determine minimum length
					var minlength = 2E53;
					var first = 2E53;
					var last = 0;
					for (l in code) {
						if (/\S/.test(code[l])) {
							minlength = Math.min(minlength, /^\s*/.exec(code[l])[0].length);
							first = Math.min(first, l);
							last = Math.max(last, l);
						}
					}

					code = code.slice(first, last + 1);

					// strip tabs at start
					for (l in code) {
						code[l] = code[l].slice(minlength);
					}

					// recombine
					code = code.join('\n');

					var fragment = $('<pre class="prettyprint"><code/></pre>').text(code).insertAfter(element);
					$('<h3 class="clickable">'+type+'&hellip;</h3>').insertBefore(fragment).click(function() {
						fragment.slideToggle();
					});
				}

				// extract html fragments
				$('div.prettyprint, span.prettyprint').each(function() {
					visualizeElement(this, 'HTML');
				});

				// extract scripts
				$('script.prettyprint').each(function() {
					visualizeElement(this, 'Javascript');
				});

				// Include the readme
				var markdown = new Markdown.Converter();
				$.get('README.md', function(readme) {
					$('#readme').html(markdown.makeHtml(readme));
					$('#readme h1').each(function() {
						$(this).nextUntil('h1').wrapAll('<div class="chapter"/>');
					});
					$('#readme pre').addClass('prettyprint');
					prettyPrint();

					// build menu
					var menuitems = [];
					$('h1').each(function() {
						var text	= $(this).text(),
							id		= $(this).attr('id') || 'chapter '+text;
						$(this).attr('id', id);
						menuitems.push('<a href="#'+id+'">'+text+'</a>');
					});
					$(menu).html(menuitems.join(' &mdash; '));
				}, 'html');
			});
		</script>

		<!-- Plugin -->
		<script src="jquery.coverflow.js"></script>
		<!-- Optionals -->
		<script src="jquery.interpolate.js"></script>
		<script src="jquery.mousewheel.js"></script>
		<script src="jquery.touchSwipe.min.js"></script>
		<script src="reflection.js"></script>
    </head>
    <body>
		<a href="https://github.com/vanderlee/coverflow"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub"></a>

		<div id="menu"></div>

		<div id="preview">
			<div id="preview-coverflow">
				<img class="cover" src="imgs/01.jpg"/>
				<img class="cover" src="imgs/02.jpg"/>
				<img class="cover" src="imgs/03.jpg"/>
				<img class="cover" src="imgs/04.jpg"/>
				<img class="cover" src="imgs/05.jpg"/>
				<img class="cover" src="imgs/06.jpg"/>
				<img class="cover" src="imgs/07.jpg"/>
				<img class="cover" src="imgs/08.jpg"/>
				
			</div>
			<style>
				#preview {
					padding-bottom: 100px;
				}
				#preview-coverflow .cover {
					cursor:		pointer;
					width:		320px;
					height:		240px;
					box-shadow:	0 0 4em 1em white;
				}
			</style>
			<script>
				$(function() {
					if ($.fn.reflect) {
						$('#preview-coverflow .cover').reflect();	// only possible in very specific situations
					}

					$('#preview-coverflow').coverflow({
						index:			6,
						density:		2,
						innerOffset:	50,
						innerScale:		.7,
						animateStep:	function(event, cover, offset, isVisible, isMiddle, sin, cos) {
							if (isVisible) {
								if (isMiddle) {
									$(cover).css({
										'filter':			'none',
										'-webkit-filter':	'none'
									});
								} else {
									var brightness	= 1 + Math.abs(sin),
										contrast	= 1 - Math.abs(sin),
										filter		= 'contrast('+contrast+') brightness('+brightness+')';
									$(cover).css({
										'filter':			filter,
										'-webkit-filter':	filter
									});
								}
							}
						}
					});
				});
			</script>


Spero che qualcuno possa darmi un'illuminazione in merito!
Grazie!!!!!!
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ciao, puoi provare ad aggiungere questo parametro
Codice:
confirm: 	function(event,cover) {
		      var link = $(cover).children().andSelf().filter('img').last().attr("alt");
		      location.href= link;
},
all immagine dovrai assegnare il link nell'attributo alt
HTML:
<img alt="http://forum.mrwebmaster.it" class="cover" src="imgs/01.jpg"/>
non sono molto pratico di plugin , fai delle prove
 

wanda

Nuovo Utente
28 Nov 2013
12
0
0
Grazie mille per l'immediata risposta.
Solo che essendo ignorante in javascript non ho capito dove e come poter inserire quel codice...
Sorry....
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
HTML:
<script>
    $(function() {
        if ($.fn.reflect) {
            $('#preview-coverflow .cover').reflect();	// only possible in very specific situations
        }
        
        $('#preview-coverflow').coverflow({
            index:			6,
            density:		2,
            innerOffset:	50,
            innerScale:		.7,
            confirm: 	function(event,cover) {
                var link = $(cover).children().andSelf().filter('img').last().attr("alt");
                location.href= link;
            },
            animateStep:	function(event, cover, offset, isVisible, isMiddle, sin, cos) {
                if (isVisible) {
                    if (isMiddle) {
                        $(cover).css({
                            'filter':			'none',
                            '-webkit-filter':	'none'
                        });
                    } else {
                        var brightness	= 1 + Math.abs(sin),
                        contrast	= 1 - Math.abs(sin),
                        filter		= 'contrast('+contrast+') brightness('+brightness+')';
                        $(cover).css({
                            'filter':			filter,
                            '-webkit-filter':	filter
                        });
                    }
                }
            }
        });
    });
</script>
ad ogni immagine aggiugni il link nell'alt
HTML:
<img alt="http://forum.mrwebmaster.it" class="cover" src="imgs/01.jpg"/>
 

wanda

Nuovo Utente
28 Nov 2013
12
0
0
Grazieeee!! Funziona!!
Mi hai salvata ed ora è perfetto.
Grazie ancora, il tuo aiuto è stato preziosissimo!!
 
Discussioni simili
Autore Titolo Forum Risposte Data
G [RISOLTO][Javascript] aggiungere elemento ad array definito nella finestra madre da popup Javascript 4
V [risolto] Aggiungere righe dinamicamente ad una textarea Javascript 4
L (risolto) MySQL 0
B getElementById su piu id(Risolto) Javascript 7
L Esercitarsi con Js [RISOLTO] Javascript 4
C [RISOLTO]Inserimento variabile php in input html PHP 20
L risolto visualizzazione e ordinamento dati PHP 1
moustache [RISOLTO] SQL PHP IIS PHP 8
Sergio Unia Ricezione email con destinatari multipli [Risolto] PHP 2
L update tabelle in php mysql [risolto] PHP 6
M Semplice visualizzatore di immagini [risolto con plugin wp] PHP 7
L [RISOLTO] Stampa a video risultato count in html PHP 13
L [RISOLTO] Eliminare una discussione creata PHP 3
tomorc [HTML] Problema con scroll bar (risolto) HTML e CSS 0
A [PHP] Problema query insert [RISOLTO] PHP 14
B [PHP] recuperare IP dei server in load balancing [RISOLTO] PHP 3
K [RISOLTO] Problema Griglia Php+Mysql PHP 13
S [RISOLTO] aggiorna tabella da select option asp classic Classic ASP 7
elpirata [RISOLTO][Javascript] Datapicker e autocompletamento campo input Javascript 2
elpirata [RISOLTO][Mysql] Problema insert valori apostrofati MySQL 1
elpirata [RISOLTO][Mysql] Contare le occorrenze in un campo tipo varchar MySQL 2
G [MS Access] Gestione biglietti [RISOLTO] MS Access 2
G [MS Access] Casella combinata & Query [RISOLTO] MS Access 4
G [MS Access] Query mese corrente con conteggio [RISOLTO] MS Access 2
M [RISOLTO]Windows media player non mi funziona più su win 10 pro 64 bit Windows e Software 2
C [RISOLTO][PHP] Errore di sintassi PHP 8
IT9-Gpp [RISOLTO] Leggere variabile restituita da success Ajax 3
Kolop [RISOLTO][PHP] Problema Pagination PHP 2
C [RISOLTO][PHP] Funzione ONclick PHP 14
C [RISOLTO][PHP] Conteggio righe di una tabella PHP 4
N [PHP] Utilizzo variabili di sessione [Risolto] PHP 13
Tommy03 [RISOLTO][PHP] Webserver o devserver? PHP 2
Sergio Unia Recupero dati da una vecchia versione MySql [Risolto] MySQL 4
spider81man [PHP] Problemi cancellazione dato su DB [RISOLTO] PHP 1
A [RISOLTO]Inserimento Immagini da pc a MySql PHP 15
A [PHP] RISOLTO Invio Mail con Tabella PHP 2
felino Risolto - [Wordpress][WooCommerce] PayPal Checkout e campi di fatturazione WordPress 2
elpirata [PHP][RISOLTO] Sommare gli importi estratti da un ciclo while PHP 3
elpirata [PHP][RISOLTO] Effettuare la somma dei tempi di lavorazione PHP 3
elpirata [PHP] [RISOLTO]Sovrascrivere testo in una tabella PHP 2
A [RISOLTO]Recuperare dati inviati con json tramite php PHP 4
C [RISOLTO][PHP] Passaggio variabili senza refresh di pagina PHP 7
elpirata [PHP][RISOLTO] Errore di tipo Notice: Undefined index - Come risolvere quando si hanno tante var PHP 10
S Problema in PHP per invio file XML - RISOLTO- PHP 8
A [Javascript] [RISOLTO] Doppio "submit", in uno stesso "Form" , che puntino ad "action" diversi Javascript 1
marino51 [Risolto]videochat di messenger ha smesso di funzionare sul telefonino Smartphone e tablet 1
A [Javascript] [HTML] RISOLTO...Allungare un box all'apertura della pagina No Mouse over Javascript 9
ken_korn [Javascript][Risolto] browser.tab.Tabs.favIconUrl non funziona Javascript 5
A [RISOLTO] HighChart e PHP PHP 4
A [RISOLTO] PHP Selezionare tutti i file con stessa estensione PHP 2

Discussioni simili