jQuery: jqGalViewII (Photo Gallery)
This is the jQuery Gallery View II plugin (jqGalViewII) which takes a list of your images and creates an easily styles photo gallery. This plugin will preload all of your larger images for faster viewing.
The Head
JavaScript:
-
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>
-
<script type="text/javascript" src="common/js/jqGalViewII.pack.js"></script>
-
<script type="text/javascript">
-
$(document).ready(function(){
-
$('#demo').jqGalViewII();
-
});
-
</script>
HTML:
-
<style type="text/css" media="screen">
-
<!--
-
@import url("common/css/jqGalViewII.css");
-
-->
-
</style>
The Body
HTML:
-
<ul title="My Gallery">
-
<li><a href="http://lh6.google.com/sterling.benjamin/RuyW_7tKn8I/AAAAAAAAAVc/opzOXldgJ0Y/DSC_0001.JPG?imgmax=800"><img src="http://lh6.google.com/sterling.benjamin/RuyW_7tKn8I/AAAAAAAAAVc/opzOXldgJ0Y/s72/DSC_0001.JPG" alt="Yes, I do know what I am doing!" width="72" height="48" border="0"/></a></li>
-
<li><a href="http://lh5.google.com/sterling.benjamin/RuyYPrtKn9I/AAAAAAAAAWE/Y1kITpSTFXI/DSC_0025.JPG?imgmax=800"><img src="http://lh5.google.com/sterling.benjamin/RuyYPrtKn9I/AAAAAAAAAWE/Y1kITpSTFXI/s72/DSC_0025.JPG" alt="Hey, it is better then reversible diapers!" width="72" height="48" border="0"/></a></li>
-
</ul>
And that would produce the following:
The Downloads
Download zip with demo and styles: http://bs-jquery-plugins.googl.....II.1.0.zip
The jQuery core is available at: http://code.google.com/p/jqueryjs/downloads/list.
1. Hugo