English | Español | Deutsch | Francais



Examples

Generated Gallery

Add Images to Root
Add new Album to Root and add Images
Add Images to "Empty Album 2"

Add Image to the Root and create a new Album with another image
Add Image to the "Example Album" and create there a new Album with another image inside
Create a new Album, add an Image to it and create a new Album with another image inside

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({
				
				
				content: { 
					source: 'a',
					selector: 'gmbz',
					loadInDiv: 'gallery',
					nested: false
				}
											
			});
		}
</script>

append to body (between your <body> tags):
		 <!-- ****** adding content ****** -->
		 
		 	
		
		
		<!-- /* This Album adds its content on click on the album */ !-->
		<div data-type="album" data-album-id="emptyalbum" data-title="Is this an empty Album? (load on enter)" class="gmbz" data-album-msg="Not anymore, Pictures added through ajax call" data-content-url="documentation/%CDN_VERSION%/examples/addons/static_imagelinks.php" data-parse-nested="false" data-content-class="gmbz"></div>
		
		<div data-type="album" data-album-id="emptyalbum2" data-title="Is this an empty Album? (Load on hover)" class="gmbz" data-album-msg="Not anymore, Pictures added through ajax call" data-content-url="documentation/%CDN_VERSION%/examples/addons/static_imagelinks.php" data-parse-nested="false" data-content-load="hover" data-content-class="gmbz"></div>
		
		<div data-type="album" data-album-id="emptyalbum3" data-title="This is a true empty album" class="gmbz" data-content-url="documentation/%CDN_VERSION%/examples/addons/static_imagelinks.php" data-parse-nested="false" data-content-class="gmbz2"></div>
		
		<div id="gallery">
			loading gallery...
		</div>
	    
	    
	    <a href="javascript:;" onclick="gambarize_instance.loadImages({ content: { source: 'a', selector: 'rootpics', loadInDiv: 'gallery'} });">Add Images to Root</a><br/>
	    
	    <a href="javascript:;" onclick="gambarize_instance.loadImages({ content: { source: 'a', selector: 'rootNewAlbumPics', loadInDiv: 'gallery', newAlbum: 'newImages'} });">Add new Album to Root and add Images</a><br/>
	    
	    <a href="javascript:;" onclick="gambarize_instance.loadImages({ content: { source: 'a', selector: 'addToEmptyAlbum', loadInDiv: 'gallery', addToAlbum: 'emptyalbum2'} });">Add Images to "Empty Album 2"</a><br/>
	    <br/>
	    
	    <a href="javascript:;" onclick="gambarize_instance.loadImages({ content: { source: 'a', selector: 'addRootInclAlbum', loadInDiv: 'gallery'} });">Add Image to the Root and create a new Album with another image</a><br/>
	    
	    <a href="javascript:;" onclick="gambarize_instance.loadImages({ content: { source: 'a', selector: 'addToAlbumInclAlbum', loadInDiv: 'gallery', addToAlbum: 'examplealbum' } });">Add Image to the "Example Album" and create there a new Album with another image inside</a><br/>
	    
	    <a href="javascript:;" onclick="gambarize_instance.loadImages({ content: { source: 'a', selector: 'creatingAlbumInclAlbum', loadInDiv: 'gallery', newAlbum: 'examplealbum2' } });">Create a new Album, add an Image to it and create a new Album with another image inside</a><br/>
	    
	    
	    
		<!-- ****** 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>