function shifter() {

		/* Define variable for paused element that shows when box element is being mouse over and for looping variable */
		loop = 1;
		pausedLayer	= '<div class="paused">&nbsp;</div>';
		var rollImage;
        var images;
        var position = 1;
        var hiddenPosition = 0;
        //var hiddenPosition;

		/* Create function for showing images */
		showImages		= function() {

			/* Define variable for image element and append its to box (with class .list-popular) */
			//var image	= '<img src="/images/realtimeoffers/sample'+loop+'.jpg" href="#" />';
			//alert(images[loop]);

			//Preload image to browser caching
			if (loop < images.length) {
    			var preload = '<img id="imgPreload" width="153" height="153" src="'+imageHost+images[loop]['imagePath']+'" href="#" />';
    			$('#preloader').prepend(preload);
		    }

			if (loop > 0) {
    			var image	= '<a id="realtime_'+position+'"class="shiftedPost" href="http://'+images[loop-1]['blogUrl']+'.'+host+'/'+images[loop-1]['postUrl']+'"><img width="153" height="153" src="'+imageHost+images[loop-1]['imagePath']+'" href="#" /></a>';
    			$('.list-popular').prepend(image);
                position++;
            }

			/* Increment loop value and if its more than or equal with the images number we redefine the value to 1 */
			loop++;

			//Remove preloaded image
			$('#imgPreload').remove();


			/* If each images on box were moused over we add class img-hover and if moused out we remove its class */
			$('.list-popular a').hover(function() {
				$(this).addClass('img-hover');
			}, function() {
				$(this).removeClass('img-hover');
			});

            if (position == 14) {
                hiddenPosition = 1;
                position = 1;
            }

            if ((hiddenPosition > 0) && (loop != images.length + 1)) {
                $('#realtime_'+hiddenPosition).remove();
                hiddenPosition++;
            }

			if(loop == (images.length+1)) {
				loop = 0;
			}

		}

		/* Define function for mouse over */
		mouseOver		= function() {

			/* Add pausedLayer to box element, add class img-opacity on each images and then stop appending image */
			$(this).prepend(pausedLayer);
			$(this).children('a').addClass('img-opacity');
			clearInterval(rollImage);

			/* Unfortunately if we turn down the images opacity the images will overflow the box, so we must round again their corner */
			/*
			$('.list-popular a:nth(0)').addClass('img-round-topleft');
			$('.list-popular a:nth(4)').addClass('img-round-topright');
			$('.list-popular a:nth(15)').addClass('img-round-bottomleft');
			$('.list-popular a:nth(19)').addClass('img-round-bottomright');
			*/
		}

		/* Define function for mouse out */
		mouseOut			= function() {

			/* Remove paused layer, turn up opacity for each images and then start appending image */
			$('div.paused').remove();
			$(this).children('a').removeClass('img-opacity');
			rollImage = setInterval(showImages, 3000);

			/* Remove rounded corner for each images */
			/*
			$('.list-popular a').removeClass('img-round-topleft')
										 .removeClass('img-round-topright')
										 .removeClass('img-round-bottomleft')
										 .removeClass('img-round-bottomtright');
										 */
		}
        loadData = function(){
            $.getJSON('/valosideju-ajanlo',null,function(data,status){
                images = data;
        		/* Fire up the showImages function for showing Images with distance time = 3000 millisecond */
        		fillAtStart();
        		rollImage = setInterval(showImages, 3000);
            });

        }

        /**
         * Fills the pool once at start
         */
        fillAtStart = function() {
            for (i = 0; i < 13; i++) {
                showImages();
            }
        }

		/* Finally inject div list-popular with function mouseOver and mouseOut */
		$('.list-popular').hover(mouseOver, mouseOut);
		loadData();
}