CSS3如何添加超鏈接到<div data-image=“#”>

Question

抱歉，我之前嘗試過問這個問題，但沒有取得好的結果，所以這里再次嘗試。 我嘗試了很多事情，但仍然沒有取得任何好的結果。

代碼在這里-> PasteBin

我想為忍者滑塊的數據圖像添加一個超鏈接。 我之前從未見過數據圖像，但是我不能使用img src =“＃”，因為如果您需要更多信息，則無法使用javascript，請告訴我。 這讓我發瘋！

  <div id='ninja-slider'>
                 <ul>
                     <li>
                        <div data-image="images/md/1.jpg"> </div>
                     </li>
                     <li>
                         <div data-image="images/md/2.jpg"> </div>
                     </li>
                     <li>
                         <div data-image="images/md/3.jpg"></div>
                     </li>
                     <li>
                         <div data-image="images/md/4.jpg"></div>
                     </li>
                 </ul>
             </div>

這是麻煩的部分。

Answer 1

只需將<div>括在<a>標記內。 這樣， <div>在技​​術上就是鏈接。

 <div id='ninja-slider'> <ul> <li> <a href="images/md/1.jpg"> <div data-image="images/md/1.jpg"></div> </a> </li> <li> <a href="images/md/2.jpg"> <div data-image="images/md/2.jpg"></div> </a> </li> <li> <a href="images/md/3.jpg"> <div data-image="images/md/3.jpg"></div> </a> </li> <li> <a href="images/md/4.jpg"> <div data-image="images/md/4.jpg"></div> </a> </li> </ul> </div> 

Answer 2

您可以使用Java腳本添加鏈接

例：

 <div onclick="javascript:location.href='http://www.google.com/'" data-image="images/md/1.jpg"> </div>

您也可以使用CSS更改指針

 #ninja-slider ul li div{
cursor:pointer;
}

謝謝..

Answer 3

嘗試使用：

<div onclick="location.href='http://www.example.com';" />

或改用span或標簽

<style type="text/css">
.myspan {
    display: block;
}
</style>
<a href="#"><span class="myspan">text</span></a>