English | Español | Deutsch | Francais



Beispiele

Generated Gallery

Pics1
Div for Pics1
Toggle Fullwindow/Div-View
Pics2
Div for Pics2
loading gallery...

Download


Code

append to head (between your <head> tags):
		
		<!-- ****** append stylesheet of gambarize ****** -->
		<link rel="stylesheet" href="http://gambarize.klickagent.ch/cdn/0.3/style/gambarize.css.php?noreset=1" type="text/css" media="all" /> 
		
		
		<!-- ****** init gambarize scripts ****** -->
		<script type="text/javascript">
		
			<!-- fuckin IE 8 bugfix -->
			window.gambarize_instance='';
						
		
			
		window.onload = function(){	
			gambarize_instance = new gambarize();	
			gambarize_instance.init({
			
				icon_imgchooser: true,
				
				MODE: 'viewer',
				enableHistory: true,
				
				
				nested: false,
				content: [
					{ 
						source: 'a',
						selector: 'gmbz',
						loadInDiv: 'gallery'
					},
					{
						source: 'a',
						selector: 'gmbz2',
						newAlbum: 'sali üübel',
						loadInDiv: 'gallery2'
					},
					
					{
						source: 'a',
						selector: 'gmbz1',
						
						addToAlbum: 'a72157635162187678',
						
						/*todo support a undefined album inside a not existing addToAlbum*/
						/*newAlbum: 'anotherNotYetExistingAlbum',*/
						
						loadInDiv: 'gallery'
					},
					{
						source: 'flickr',
						user: 'foto-macher',
						
						loadInDiv: 'gallery'
					}
				]						
			});
			
		}
</script>

append to body (between your <body> tags):
		 <!-- ****** adding content ****** -->
		 
		 	
	<div id="viewer" style="height: 300px; width: 450px; margin-bottom: 20px;"></div>
	
	
	<div>
		
		Pics1<br/>
		<a href="data/album_simple/field.jpg" rel="" title="" class="gmbz"></a>
		<a href="data/album_simple/mountains.jpg" rel="" title="Mountains, Shadows, Yes this was an amazing landscape!" class="gmbz"></a>
		<a href="data/album_simple/sea.jpg" rel="" title="Sea, Bali" class="gmbz"></a>
		<a href="data/album_simple/wave.jpg" rel="" title="Wave, Bali" class="gmbz"></a>
		
		<a href="data/album_mixed/mountains.jpg" rel="" title="Mountains Mixed" class="gmbz1"></a>
		<a href="data/album_mixed/sunset.jpg" rel="" title="sunset mixed" class="gmbz1"></a>
		
		
		
		Div for Pics1 <br/>
		<a href="javascript:;" onclick="gambarize_instance.fullWindow();">Toggle Fullwindow/Div-View</a>
		<div id="gallery">
			loading gallery...
		</div>
	 </div>
	 
	 
	 <div>
	 	
	 	Pics2<br/>
 		<a href="data/album_simple/field.jpg" rel="" title="" class="gmbz2"></a>
 		<a href="data/album_simple/mountains.jpg" rel="" title="Mountains, Shadows, Yes this was an amazing landscape! 2" class="gmbz2"></a>
 		<a href="data/album_simple/sea.jpg" rel="" title="Sea, Bali 2" class="gmbz2"></a>
 		<a href="data/album_simple/wave.jpg" rel="" title="Wave, Bali 2" class="gmbz2"></a>
 		
 		Div for Pics2 <br/>
 		<div id="gallery2">
 			loading gallery...
 		</div>
	 
	 </div>   
	    
	    
		<!-- ****** adding gambarize scripts ***** -->
		<!-- add jquery, if not already loaded somewhere else on your website: -->
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
			
		<!-- add the cdn/0.3 of gambarize plugin -->
		<script src="http://gambarize.klickagent.ch/cdn/0.3/js/gambarize.js" type="text/javascript"></script>