Hi. I am an awesome IT guy. This is my website where you can find my stuff.

+3630 / 38 69 142
info (at) genart.hu

myShow

myShow creates an animated gallery, where you can display image title and description.

How to use



  myShow uses the jQuery framework. Load jQuery, jQuery easing and the myShow javascript files in the proper order.
<script type="text/javascript" src="jquery-1.8.2.js"></script>
<script type="text/javascript" src="myshow.js"></script>
<script type="text/javascript" src="jquery.easing.1.3.js"></script>
Then include the myShow CSS file
<link href="style.css" rel="stylesheet" type="text/css"/> 
Then create the div element which contains the images in the HTML section. Insert the description of the image into data-desc, and the image title into data-title.
<div id="container">
<img src="img/01.jpg" data-desc="this is the text" data-title="title"/>
.
.
</div> 
In the head section insert this jQuery code. The $('container') is the name of the div, which contains the images.
<script type="text/javascript">
     $(document).ready(function(){
    $('#container').myShow();
     });
</script>
There are some properties which help you to modify the plugin
animatetoW: 	//if you click on an image, it will be animated to 
   	   	  this width
animatetoH:	//if you click on an image, it will be animated to 
		  this height
pozX : 		//the X position where you want to animate the image
pozY : 		//the Y position where you want to animate the image
You can add the properties like this:
<script type="text/javascript">
     $(document).ready(function(){
     $('#container').myShow({
	animatetoW:800,
	animatetoH:600,
	pozX : ($(window).width()/2)-600,
	pozY : ($(window).height()/2)-300});
     });
</script>