I’am using iosslider on my single page.
I need to collect all img src from ‘.wp-pic’ and put them to slider background url.
So what I have:

SLIDER FRAME AND DIV WITH WP PICTURES:

<div class='my-slider large-9 columns'>
  <div class='sliderContainer'>
    <div class='iosSlider'>
      <div class='slider'>
      </div>
    </div>
  </div>
</div><!--/.slider-->
<div class='wp-pic'>
  <?php if(have_posts()) : ?> 
    <?php while(have_posts()) : the_post(); ?> 
       <?php the_content(); ?>
    <?php endwhile; ?>
  <?php endif; ?>
</div>
/* SLIDER SETTINGS
=============================================*/
.sliderContainer{
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
}
.iosSlider{
  position: relative;
  top: 0;
  left: 0;
  overflow: hidden;
  width: 100%;
  height: 100%;
}
.iosSlider .slider{
  width: 100%;
  height: 100%;
}
.iosSlider .slider .item{
  float: left;
  width: 100%;
  height: 100%;
}
// REMOVE PICTURES PUSHED BY WP AND PUT THEM TO THE IOSSLIDER
  $('.wp-pic').find('img').each(function(){
    var photoSrc  = $(this).attr('src'),
        photoImg  = '<img src="' + photoSrc + '">',
        numbClass = Math.round(Math.random() * 15);
    $('.slider').append('<div class="item photo-template' + numbClass + '">' + photoImg + '</div>');
    $('.wp-pic').remove();
  });
  $('.item').find('img').each(function(){
    var x = $(this).attr('src');
    $('.slider').find('div:contains(photo-template)').each(function(){ 
      $(this).css({
        'background-image'   :'url(' + x + ')',
        'background-size'    :'contain',
        'background-position':'center',
        'background-repeat'  :'no-repeat'
      });
    });
    $(this).remove();
  });

How can I select each class ‘photo-template’ and place on their background collected src?

FIDDLE

Read more here: Select div with random class


Solution:

If you know the solution of this issue, please leave us a reply in Comment section, to update the question.

Related Wordpress search:

, , ,

Wordpress related questions and answers: