$(document).ready(function() {
		$('#slideshow')
		.after('<\div id="pp"><\div id="ppwrapper"><\div id="prodimagecyclepager"><\/div><\div id="title">&nbsp;<\/div><\/div><\/div>')
		.cycle({
			fx:     'fade',
			cssBefore:{opacity: 0}, 
			animIn: {opacity: 1}, 
			animOut: {opacity: 0}, 
			cssAfter: {opacity: 0}, 
			delay:   -3000, //additional delay (in ms) for first transition (hint: can be negative)
			timeout: 8000, //milliseconds between slide transitions (0 to disable auto advance)
			speed:  1000, // speed of the transition
			before: onBefore,
			easing: 'easeOutQuint',
			pager:  '#prodimagecyclepager',
			pause:  1 ,
			pagerEvent: 'mouseover',
			pauseOnPagerHover: true
			});
		function onBefore() {
			$('#title').html('<h2>' + this.alt + '</h2>');
		}
 

		 $('#newsticker')
		 .after('<div id="newstickerpager">')
		 .cycle({ 
    		fx:      'custom', 
    		sync: 0,
   			cssBefore: {  
    		    top:  300, 
    		    opacity: 0,
    		    display: 'block'
    		}, 
    		animIn:  { 
        		top: 0,
        		opacity: 1
    		}, 
    		animOut: {  
        		top: -300, 
        		opacity: 0
    		}, 
		    delay: -2000,
		    timeout: 20000,
    		pause: 1,
    		pager:  '#newstickerpager',
    		cleartype: 1
		});
  
  		function onAfter() {
		$('#title').html(this.title);
	}
});
