我有三個圖像,每個圖像都會在鼠標懸停時變爲第二個圖像。在鼠標懸停時,他們也將其他人重置爲標準圖像。這一切工作正常。添加href鏈接到已通過js鼠標懸停顯示的圖像
但是..
我想每個第二圖像是可點擊鏈接到另一個頁面。
希望有人能幫助,非常感謝。
$(document).ready(function(){
$('#s1').mouseover(function(){
$('#s1').attr('src', 'images/object/click-1.png');
$('#s2').attr('src', 'images/object/standard-2.jpg');
$('#s3').attr('src', 'images/object/standard-3.jpg');
});
$('#s2').mouseover(function(){
$('#s1').attr('src', 'images/object/standard-1.jpg');
$('#s2').attr('src', 'images/object/click-2.png');
$('#s3').attr('src', 'images/object/standard-3.jpg');
});
$('#s3').mouseover(function(){
$('#s1').attr('src', 'images/object/standard-1.jpg');
$('#s2').attr('src', 'images/object/standard-2.jpg');
$('#s3').attr('src', 'images/object/click-3.png');
});
});
所以這些鏈接需要在click-1.png,click-2.png,click-3.png。
<div id="section3" class="container-fluid" align="center">
<div class="row row-centered ">
<div id="top-box-1" class="col-sm-4">
<img src="images/object/standard-1.jpg" id="s1" width="300" height="300" />
</div>
<div id="top-box-2" class="col-sm-4">
<img src="images/object/standard-2.jpg" id="s2" width="300" height="300" />
</div>
<div id="top-box-3" class="col-sm-4">
<img src="images/object/standard-3.jpg" id="s3" width="300" height="300" />
</div>
</div>
</div>
你可以發佈html代碼嗎?你不能只改變.attr的href? – Matt