<?php 
	$args = array(
			'post_type' => array('blogs'), 
			'post_status' => 'publish', 
			'posts_per_page' => 3, 
			'orderby' => 'post_date',
    		'order' => 'DESC'
	);
	$query = new WP_Query($args);
	while ( $query->have_posts() ) : $query->the_post();
		$image = get_field('afbeelding');
		/**/
	?>		
			<div class="span4 blogitem" style="cursor:pointer" onclick="window.location='<?php the_permalink()?>'">
                <div><img src="<?php echo $image['sizes']['blog-medium']?>" alt="<?php echo $image['alt']?>" width="<?php echo $image['sizes']['blog-medium-width']?>"/></div>
                <div class="blog_title" style="max-width: 290px;<?php if(strlen(get_the_title()) > 20) echo 'top: -90px;';?>"><h2 style="padding-left: 15px;<?php if(strlen(get_the_title()) > 20) echo 'line-height: 35px;'?>"><?php the_title()?></h2></div>
                <div style="position: relative; <?php if(strlen(get_the_title()) > 20) echo 'top: -90px;'; else echo 'top: -50px;';?>">
	                <?php the_date('j F Y')?>, Door: <?php the_author()?>
	                <br><br>
                	<em><?php echo substr(strip_tags(get_the_content()), 0, 180).'...'?></em>                		           
		        </div>
           </div>
           
<?php endwhile; ?>  
<script>
	$('.blog_title').mouseenter(function(e){
		e.stopPropagation();
		$(this).css('opacity',1);
	});
	$('.blog_title').mouseleave(function(e){
		e.stopPropagation();
		$(this).css('opacity',0.8);
	});
	setTimeout(function(){
		$('.blog_title').each(function(index){
			if($(this).height() <= 70)
				$(this).css('top','-80px');
			else 
				$(this).css('top','-115px');
		});
	}, 500);
</script>
<!--   
<script>
	$('.blogitem').mouseenter(function(){
		$(this).find('.blogcont').animate({bottom: 200, height : 180}, 'slow', function (){
			//$(this).find('.blogauthor').show();
			$(this).find('.blogsmallcont').show();
			
		});
	});
	$('.blogitem').mouseleave(function(){
		$(this).find('.blogcont').animate({bottom: 60, height: 40}, 'slow', function (){
			//$(this).find('.blogauthor').show();
			$(this).find('.blogsmallcont').hide();
		});
	});
</script>     

-->