<?php

			if(is_page()):
				$slider = get_field('slider_id');

			elseif(is_archive()):
				$slider = get_field('slider_archiefpagina', 'option');
			endif;
			

		$args = array(
			'post_type'		=> 'slider',
			'p' => $slider
		);

		//WordPress loop for custom post type
		$my_query = new WP_Query($args);
	    $count = 0;
	    while($my_query->have_posts()):
	    
	    $my_query->the_post();
         ?>

				<div class="sldr">
								<?php $rows = get_field('slide' ); //get all rows
$randomslides = get_field('random_slides' );
									if ($randomslides):
									shuffle ($rows); //randomize rows
									endif;
									if($rows) {
										foreach($rows as $row) {?>
								<div class="slide" style="background-size: cover;" data-background="<?php echo $row['afbeelding']?>">
									<div class="cntnt">
										<div class="plt">
											<div class="sldrcnt">
												<h2 class="big"><?php echo $row['titel']?></h2>
												<p class=""><?php echo $row['tekst'];?></p>
												<a class="btn btn-transparent btn-lg text-uppercase" href="<?php echo $row['link'];?>"><?php echo $row['button_tekst'];?></a>
											</div>
										</div>
									</div>
								</div>
									<?php 	} 
}?>

						</div>
				
				    <?php wp_reset_postdata(); ?>



				<?php
				endwhile;
				 ?>
				
				<script>
	jQuery(document).ready(function(){
$.fn.animateRotate = function(angle, duration, easing, complete) {
    var args = $.speed(duration, easing, complete);
    var step = args.step;
    return this.each(function(i, e) {
        args.step = function(now) {
            $.style(e, 'transform', 'rotate(' + now + 'deg)');
            if (step) return step.apply(this, arguments);
        };

        $({deg: 0}).animate({deg: angle}, args);
    });
};	
  $('.sldr').on('init', function(event, slick){
    $(".plt").animateRotate(90, 1000, "linear", function(){
        });
  });				
  $('.sldr').on('beforeChange', function(event, slick, currentSlide) {
	  $(".plt").animateRotate(90, 1000, "linear", function(){
        });
  });

 

  
});
 $(document).ready(function() {
 if ($('[data-background]').length > 0) {
      $('[data-background]').each(function() {
        var $background, $backgroundmobile, $this;
        $this = $(this);
        $background = $(this).attr('data-background');
        $backgroundmobile = $(this).attr('data-background-mobile');
        if ($this.attr('data-background').substr(0, 1) === '#') {
          return $this.css('background-color', $background);
        } else if ($this.attr('data-background-mobile') && device.mobile()) {
          return $this.css('background-image', 'url(' + $backgroundmobile + ')');
        } else {
          return $this.css('background-image', 'url(' + $background + ')');
        }
      });
    }
  });
</script>

 

Geef een reactie 0