php - Wordpress Custom Post type - data-thumb data-src Images -

i have html page in there slider. here's html code

<div data-thumb="images/slide1.jpg" data-src="images/slide1.jpg">          </div>         <div data-thumb="images/slide2.jpg" data-src="images/slide2.jpg">          </div>         <div data-thumb="images/slide3.jpg" data-src="images/slide3.jpg">          </div> 

i trying convert page wordpress. here's how doing in wordpress load images.

  <?php             $options = array(         'post_type' => "slideshow",           );            while ($my_query->have_posts()) : $my_query->the_post(); ?>              <div data-thumb="<?php if ( has_post_thumbnail() ) { the_post_thumbnail('full'); } ?>"  data-src="<?php if ( has_post_thumbnail() ) { the_post_thumbnail('full'); } ?>">          </div>          <?php endwhile; ?>  

but not working.my pictures not showing in slider. when check page source correctly getting image.

here's source generates

 <div data-thumb="<img width="1170" height="385" src="http://localhost/wordpress/wp-content/uploads/2014/09/slide1.jpg" class="attachment-full wp-post-image" alt="slide1" />"      data-src="<img width="1170" height="385" src="http://localhost/wordpress/wp-  content/uploads/2014/09/slide1.jpg" class="attachment-full wp-post-image" alt="slide1" />">          </div> 

change this: in first line of "while" loop insert this:

if ( has_post_thumbnail() ) {      $image = wp_get_attachment_image_src( get_post_thumbnail_id( the_id())); }  // else {  // should see if post hasn't got thumbnail  //  

and replace this:

<div data-thumb="<?php if ( has_post_thumbnail() ) { the_post_thumbnail('full'); } ?>" 

for this:

<div data-thumb="<?php echo $image[0];?>" 

same thing in second "if". it's not prettiest code, should work.

calling the_post_thumbnail() prints whole <img> tag, , need url populate data-src , data-thumb attributes of existing imgs.

so post thumbnail id get_post_thumbnail_id(), , image url wp_get_attachment_src().

hope helps.