Visualizzazione dei risultati da 1 a 6 su 6
  1. #1
    Utente di HTML.it
    Registrato dal
    Jun 2003
    Messaggi
    4,826

    galleria immagini dinamica

    ciao.
    ho questo codice js che viene eseguito al caricamento della pagina , lo vorrei eseguire ogni volta che ne ho bisogno per un refresh di una galleria d'immagini:
    codice:
    $(window).load(function(){
    	
    	alert("init");
    	var nav=$('nav')
    		,win=$(window)
    		,content=$('#content')
    		,scrollable=$(window)._scrollable()		
    		,scrllPos=scrollable.prop('scrollTop')
    		,pos=(function(){
    			var pos=[]
    			$('#content>ul>li')
    				.each(function(n){
    					var th=$(this)
    					pos[n]={
    						id:th.attr('id')
    						,top:th.prop('offsetTop')
    						,el:th
    					}
    				})
    			return pos
    		})()
    	
    	$('a.no_actions')
    		.click(function(){
    			return false
    		})
    	
    	$('.gallery a').fancybox({
    		transitionIn:'elastic'
    		,transitionOut:'elastic'
    	})
    	
    	$('.gallery').thumbvr({
    		duration:800
    		,easin:'easeInOutSine'
    	})
    	
    	$('.scroll')
    		.uScroll({
    			axis:'y'
    			,step:100
    			,mousewheel:true
    		})
    	
    	$('nav a,.prev,.next,.privacy a,.btn').click(function(){
    		var th=$(this)
    		scrollable
    			.stop()
    			.animate({
    				scrollTop:$('#'+th.attr('href').replace(/[#!/]{0,3}/,'')).prop('offsetTop')
    			},{
    				duration:1000
    				,easing:'easeInOutSine'
    			})		
    	})
    	
    	nav
    		.navs({
    			useHash:true
    			,defHash:'#!/home'
    		})
    	
    	win
    		.resize(function(){
    			var pos=$('#'+location.hash.replace(/[#!/]{0,3}/,'')).prop('offsetTop')			
    			scrollable
    				.stop()
    				.prop({
    					scrollTop:pos
    				})			
    			scrllPos=scrollable.prop('scrollTop')
    			$.each(pos,function(){
    				this.top=this.el.prop('offsetTop')
    			})		
    		})
    		.resize()
    	
    	win
    		.on('scroll',function(){
    			var tmp			
    			scrllPos=scrollable.prop('scrollTop')
    			for(var i=0,l=pos.length;i<l;i++)
    				if((tmp=pos[i]).top+content.height()/2>scrllPos)
    					break;
    			location.hash="#!/"+tmp.id
    			if(tmp.id=='contacts')
    				googleMap()
    		})
    		.trigger('scroll')
    	
    	function googleMap(){
    		if(googleMap.ready)
    			return false
    		googleMap.ready=true
    		var cssPath='.google_map'
    			,holder=$(cssPath)
    			,src='http://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=Brooklyn,+New+York,+NY,+United+States&amp;aq=0&amp;sll=37.0625,-95.677068&amp;sspn=61.282355,146.513672&amp;ie=UTF8&amp;hq=&amp;hnear=Brooklyn,+Kings,+New+York&amp;ll=40.649974,-73.950005&amp;spn=0.01628,0.025663&amp;z=14&amp;iwloc=A&amp;output=embed'
    			,str='<iframe class="blo" width="'+holder.width()+'" height="'+holder.height()+'" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="'+src+'"></iframe>'
    		holder.html(str)
    	}
    	
    	$('#gspinner')
    		.fadeOut()
    })
    è possibile? come?
    il problema è che se la richiamo con un semplice $(window).load(); la galleria non funziona con lo scroll i pulsanti avanti indietro ecc..... e non so perchè?
    la galleria funziona inserendo le immagini in un div ognuna con un link e un immagine da visualizzare:
    codice:
    <div class="gallery" id="gallery">
    				<ul>
    					[*][img]{{ asset('images/images/portfolio-img-1.jpg')}}[/img]<span></span>
    					[*][img]{{ asset('images/images/portfolio-img-2.jpg')}}[/img]<span></span>
    					[*][img]{{ asset('images/images/portfolio-img-3.jpg')}}[/img]<span></span>
    					[*]<a href="{{ asset('images/images/portfolio-big-4.jpg')}}>[img]{{ asset('images/images/portfolio-img-4.jpg')}}[/img]<span></span></a>
    					[*]<a href="{{ asset('images/images/portfolio-big-5.jpg')}}>[img]{{ asset('images/images/portfolio-img-5.jpg')}}[/img]<span></span></a>
    					[*]<a href="{{ asset('images/images/portfolio-big-6.jpg')}}>[img]{{ asset('images/images/portfolio-img-6.jpg')}}[/img]<span></span></a>
    					
    				[/list]
    			</div>
    io non faccio altro che creare con ajax (con jquery) dei link e immagini diverse e inserirle con un .html(HTMLGENERATO).
    dopo chiamo la init, ma lo scroll ad es non funziona,
    grazie.

  2. #2
    Utente di HTML.it
    Registrato dal
    Jun 2003
    Messaggi
    4,826
    il sito utilizza
    include('js/jquery.scrollTo-1.4.2-min.js')
    include('js/jquery.fancybox-1.3.4.pack.js')
    include('js/switcher.js')
    include('js/thumbvr.js')
    include('js/uScroll.js')

    per quanto riguarda la galleria d'immagini

  3. #3
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    Il problema è che caricando le immagini con Ajax la gallery non funziona? Se la risposta e si, ritengo sia meglio cercare una gallery Ajax al posto di modificare quella che hai
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  4. #4
    Utente di HTML.it
    Registrato dal
    Jun 2003
    Messaggi
    4,826
    grazie Andrea, penso tu abbia ragione, ma non trovo una galleria tipo questa in ajax o json, voi ne conoscete?
    andrebbe ben anche simile.

  5. #5
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    Dubito, ma la rete è immensa e mai perdere la speranza, oppure quando non sia hanno le conoscenze adeguate per creare o modificare gli script (sopratutto quelli complessi) bisogna accontentarsi e accettare certi compromessi.
    - Meglio la gallery scorrevole non ajax?
    - Meglio la gallery ajax statica?
    Valuta tu qual'è la scielta migliore
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  6. #6
    Utente di HTML.it
    Registrato dal
    Jun 2003
    Messaggi
    4,826
    non era tanto difficile, anche se capisco che non avendo postato i sorgenti per voi era impossibile aiutarmi, ho risolto cancellando l'oggetto prima di ricrearlo.
    ciao.
    scusate.

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.