problema navigazione jquery tra filmati .swf

**.allienato** · 17-03-2011, 17:19

buondì,
avevo bisogno di creare una pagina in cui inserire una sorta di gallery di filmati flash (a loro volta gallerie che visualizzano una serie di immagini di un negozio), con una navigazione sotto in modo che se uno avesse voluto passare da un flash all'altro non avrebbe fatto altro che cliccare su un numerino e via.

ed eccola qua: http://www.interno-8.it/gallery.html

ho utilizzato jquery per gestire la navigazione tra gli swf.
il problema è che sta cosa funziona su tutti i browser che ho provato (Chrome, Firefox, Opera, Safari..) ma non su IE.
su Internet Explorer (qualsiasi versione credo, anche la 9) la prima galleria flash viene caricata, ma quando clicco sul 2 non mi carica l'altra. fa il fade ma rientra ancora lo stesso flash.

il jquery che ho utilizzato è questo:

codice:

<script type="text/javascript">
		//<![CDATA[  
		$(function(){
			$("#supersized").hide();
			if ((screen.width>=1600)) { var fObj = "flash_all_resolution_alta2.swf" }
			else { var fObj = "flash_all_resolution2.swf" }
			var gallery = $("<object classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" codebase=\"http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0\" width=\"100%\" height=\"100%\" align=\"top\"><param name=\"movie\" value=\"" + fObj + "\"><param name=\"allowFullScreen\" value=\"true\"><param name=\"quality\" value=\"high\"><param name=\"wmode\" value=\"opaque\"><embed src=\"" + fObj + "\" quality=\"high\" wmode=\"transparent\" pluginspage=\"http://www.macromedia.com/go/getflashplayer\" type=\"application/x-shockwave-flash\" width=\"100%\" height=\"100%\" align=\"middle\"></embed></object>");
			gallery.appendTo("#supersized");
			$(window).bind("load", function(){
				$('#loading').hide();
				$('#supersized').fadeIn(2000);
			});
			$(".galleries a").click(function(){
				var ngal = $(this).attr("id");
				$('#supersized').fadeOut('slow', function() {
					if (ngal == "one") {
						if ((screen.width>=1600)) { fObj = "flash_all_resolution_alta2.swf" }
						else { fObj = "flash_all_resolution2.swf" }
					}
					if (ngal == "two") {
						if ((screen.width>=1600)) { fObj = "flash_all_resolution_alta.swf" }
						else { fObj = "flash_all_resolution.swf" }
					}
					$("#supersized object param:eq(0)").attr("value",fObj);
					$("#supersized embed").attr("src", fObj);
					$('#supersized').fadeIn('slow');
				});
				return false;
			});
		});
		//]]>
		</script>

mentre il contenuto html più sotto è più o meno così (tralasciando parti non inerenti):

codice:

<body>
	<div id="content">
		<div id="loading"></div>
		
		<div id="container">
                        ...
                        <p class="galleries">> Gallery 2011 • 1 • 2</p>
                        ...
                </div>
                
                <div id="supersized"></div>
        </div>
</body>

tralasciando la parte relativa al diverso file caricato a seconda della risoluzione, in sostanza appendo al div supersized il codice per incorporare il filmato e sostituisco a seconda dell'elemento cliccato (qui "1" o "2") il percorso del file .swf.

perché IE rompe le palle?

**skjobax** · 17-03-2011, 20:23

IE secondo me è il peggiore browser esistente, ma non contraddico la velocità, che non è molto lenta...
Ma se provi a fare delle div sovrapposte, potresti fare in modo, da javascript, che quando clicchi sul numerino, la div con l' id corrispondente abbia un z-index maggiore.
Oppure modificando la proprietà display.

**.allienato** · 18-03-2011, 00:45

sono d'accordo (tralaltro sto provando anche il 9 e in fatto di interpretazione del codice non mi pare migliorato più di tanto). purtroppo nello sviluppare si deve fare i conti con l'altissima percentuale di utenti IE.

ho provato con l'approccio agendo sul display.
ho messo due div (es. supersized1 e supersized2) e all'inizio della mia funzione jquery ho messo due codici distinti (<object classid...), ognuno con il suo file come src, e li ho appesi rispettivamente a supersized1 e supersized2. all'inizio supersized2 ha il display:none. poi per la navigazione uso i fadeIn e fadeOut per intercambiare la visualizzazione dei due div.

il problema è che, sempre e solo su IE, il flash nascosto dopo che ho cliccato sul bottone collegato all'altro continua a scorrere.

cioè..
- primo caricamento: visualizza supersized1, l'altro è nascosto dal display:none
- clicco su 2: fadeOut su supersized1 che quindi perde il display, fadeIn su supersized2 che prende il display:block
- clicco di nuovo su 1: fadeOut su supersized2, fadeIn su supersized1 che però non parte dall'inizio ma vedo fotogrammi successivi

**.allienato** · 18-03-2011, 01:06

ok, una soluzione con questa funziona anche su IE:

codice:

<script type="text/javascript">
		//<![CDATA[
		$(function(){
			$("#supersized").hide();
			if ((screen.width>=1600)) { var fObj = "flash_all_resolution_alta2.swf" }
			else { var fObj = "flash_all_resolution2.swf" }	
			var gallery = $("<object classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" codebase=\"http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0\" width=\"100%\" height=\"100%\" align=\"top\"><param name=\"movie\" value=\"" + fObj + "\"><param name=\"allowFullScreen\" value=\"true\"><param name=\"quality\" value=\"high\"><param name=\"wmode\" value=\"opaque\"><embed src=\"" + fObj + "\" quality=\"high\" wmode=\"transparent\" pluginspage=\"http://www.macromedia.com/go/getflashplayer\" type=\"application/x-shockwave-flash\" width=\"100%\" height=\"100%\" align=\"middle\"></embed></object>");
			gallery.appendTo("#supersized");
			$(window).bind("load", function(){
				$('#loading').hide();
				$('#supersized').fadeIn(2000);
			});
			
			$(".galleries a").click(function(){
				var ngal = $(this).attr("id");
				$('#supersized').fadeOut('slow', function() {
					if (ngal == "one") {
						$('#supersized').empty();
						if ((screen.width>=1600)) { fObj = "flash_all_resolution_alta2.swf" }
						else { fObj = "flash_all_resolution2.swf" }
						var gallery = $("<object classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" codebase=\"http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0\" width=\"100%\" height=\"100%\" align=\"top\"><param name=\"movie\" value=\"" + fObj + "\"><param name=\"allowFullScreen\" value=\"true\"><param name=\"quality\" value=\"high\"><param name=\"wmode\" value=\"opaque\"><embed src=\"" + fObj + "\" quality=\"high\" wmode=\"transparent\" pluginspage=\"http://www.macromedia.com/go/getflashplayer\" type=\"application/x-shockwave-flash\" width=\"100%\" height=\"100%\" align=\"middle\"></embed></object>");
						gallery.appendTo("#supersized");
					}
					if (ngal == "two") {
						$('#supersized').empty();
						if ((screen.width>=1600)) { fObj = "flash_all_resolution_alta.swf" }
						else { fObj = "flash_all_resolution.swf" }
						var gallery = $("<object classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" codebase=\"http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0\" width=\"100%\" height=\"100%\" align=\"top\"><param name=\"movie\" value=\"" + fObj + "\"><param name=\"allowFullScreen\" value=\"true\"><param name=\"quality\" value=\"high\"><param name=\"wmode\" value=\"opaque\"><embed src=\"" + fObj + "\" quality=\"high\" wmode=\"transparent\" pluginspage=\"http://www.macromedia.com/go/getflashplayer\" type=\"application/x-shockwave-flash\" width=\"100%\" height=\"100%\" align=\"middle\"></embed></object>");
						gallery.appendTo("#supersized");
					}
					$('#supersized').fadeIn('slow');
				});
				return false;
			});
		});
		//]]>
		</script>

sostanzialmente quando si clicca sul numerino, cancella il contenuto del div #supersized e rimette il codice del flash con il percorso del file associato.

ha grosse implicazioni in termini di caricamento o può andar bene?
(per funzionare funziona, sembra)

**skjobax** · 18-03-2011, 18:59

Mi sembra di capire che quindi ricarichi ogni volta l'swf...
Questo può implicare la lentezza dell'esecuzione di Flash Player e un eventuale crash di IE, che non è davvero molto stabile in pagine flash.

(io ho IE 7 e 8 e sono andati in crash per un flash non molto pesante..)

**.allienato** · 18-03-2011, 23:14

il file non dovrebbe restare comunque nella memoria del browser?
a me pare che se ritorno su una galleria dopo averla già caricata una volta il loading è istantaneo (in certi casi non appare neanche)

ho provato a testare la pagina su IE 8 e 9, non sembra dia problemi (proverò sul 7)

Discussione: problema navigazione jquery tra filmati .swf

Strumenti discussione

Ricerca discussione

Visualizza

problema navigazione jquery tra filmati .swf

Permessi di invio