How to show text and apply link in jquery cycle2 image slider

I am working on jQuery cycle2 image slider for WordPress. I add images in database and their relative title, description and link on image.

So I add jQuery cycle2 code and get all images via foreach loop.

<div class="cycle-slideshow"
     data-cycle-fx="fade"
     data-cycle-timeout="0"
     data-cycle-speed="5"
     data-cycle-prev="#prev"
     data-cycle-next="#next"
>
   <?php
      global $wpdb;

      $result = $wpdb->get_results("SELECT * FROM wp_images");

      foreach ($result as $row) {
   ?>
         <img src="<?php echo $row->img_path ?>">
   <?php
      }     
   ?>

</div>

Its working perfectly. Now I want to display the title from database, so I search and the code and its also work.

<div class="cycle-slideshow"
     data-cycle-caption=".img-title"
     data-cycle-fx="fade"
     data-cycle-caption-template=""
     data-cycle-timeout="0"
     data-cycle-speed="5"
     data-cycle-prev="#prev"
     data-cycle-next="#next"
>
    <?php
      global $wpdb;

      $result = $wpdb->get_results("SELECT * FROM wp_images");

      foreach ($result as $row) {
   ?>
         <img src="<?php echo $row->img_path ?>" data-cycle-title="<?php echo $row->img_title; ?>">
   <?php
      }
          echo "<h2 class='img-title'></h2>";
   ?>
</div>

The title show only when there is a title in db against image.

Now when I add <a> the title not showing.

<div class="cycle-slideshow"
     data-cycle-caption=".img-title"
     data-cycle-fx="fade"
     data-cycle-caption-template=""
     data-cycle-timeout="0"
     data-cycle-speed="5"
     data-cycle-prev="#prev"
     data-cycle-next="#next"
     data-cycle-slides="> a"
>
    <?php
        global $wpdb;

        $result = $wpdb->get_results("SELECT * FROM wp_images");

        foreach ($result as $row) {

                if(!empty($row->img_link)) {
    ?>
                    <a href="<?php echo $row->img_link ?>" target="_blank">
            <?php
                }
            ?>
                        <img src="<?php echo $row->img_path ?>" data-cycle-title="<?php echo $row->img_title; ?>">
            <?php
                if(!empty($row->img_link)) {
            ?>
                    </a>
            <?php
                }     
        }

        echo "<h2 class='img-title'></h2>";
    ?>
</div>

I also want to display the description but I don't get any hint. Why title not shown when I enter anchor. But there is also one more problem that if one of sliders have no link its image shows out of slider and no sliding.

So please guide me. Hope you understand my question.

via Chebli Mohamed