Jquery Slideshowify超鏈接到另一頁

Question

我在我的網頁中使用Slideshowify，並希望在它的頂部有一個超鏈接（在中心位置對齊），以便在點擊文本時，用戶被重定向到另一個頁面。每張圖片都會顯示不同的文字。

下面是摘錄：

$(document).ready(function() { 
 
     $('#slideshow a img').slideshowify(); 
 
});

.spanstyle 
 
{ 
 
    text-align:center; 
 
    color:#FFF; 
 
    font-size: 16px; 
 
    vertical-align: middle; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://raw.githubusercontent.com/subchild/jquery.slideshowify.js/master/js/jquery.transit.min.js"></script> 
 
<script src="https://raw.githubusercontent.com/subchild/jquery.slideshowify.js/master/js/jquery.slideshowify.min.js"></script> 
 

 
<div id="slideshow"> 
 
      <a href="https://www.google.com"> <span class="spanstyle"> Image 1 </span> <img alt="image1" src="http://www.wallpaperandphoto.com/wp-content/uploads/2016/01/summer_landscape-wallpaper-2560x1600.jpg" style="display: none;"/></a> 
 
      <a href="https://www.stackoverflow.com"> <span class="spanstyle"> Image 2 </span> <img alt="image2" src="https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcST9Gcz3vT0LeZpIa6Ch71scJbUY81HjIvKJ5EhbMDxMh9mSLxi" style="display: none;"/></a> 
 
      <a href="https://www.jsfiddle.net"> <span class="spanstyle"> Image 3 </span> <img alt="image3" src="https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcSEg2QvjFNxO7o7KYQb-g5PS_5Y7MK4Oz3G2xapGQKeNetZMVHs" style="display: none;"/></a> 
 
     </div>

這裏所有的超鏈接的文本一起顯示每個圖像中沒有對齊中心。我究竟做錯了什麼？

任何幫助將不勝感激。

Answer 1

試試這個代碼它有助於對齊div中心的超文本。請根據您的鏈接文字來調整此寬度

#slideshow 
    { 
    margin-left: auto; 
    margin-right: auto; 
    width: 172px; 
    }