Re: [問題] 怎麼做出這種效果阿
※ 引述《blinkstar (Lanrain)》之銘言:
: ※ 引述《awe5566 (阿威5566)》之銘言:
: : http://www.picsviewr.com/photos/username/dfgallery/sd
: : 這個顯示照片的網站
: : 下面的縮圖
: : 當滑鼠移上去會有個很像漫畫對話框的小圖顯示
: : 請問這要用什麼方法才能阿??
: 你可以利用 onmouseover 與 onmouseout,
: 然後設<div> displauy 隱藏,
: 當滑鼠移上去後再利用 javascript 設為顯示,
: 移開後再設為隱藏,
: 如果圖多個話就要判斷圖的位置然後一樣是用 javascript 變更該<div>的位置。
<style>
<!--
ul.shower li img {border:0;margin:0;}
ul.shower li a {position:relative;}
ul.shower li a span {display:none;visibility:hidden;position:absolute;
top:-20px;left:-25px;}
ul.shower li a:hover span {display:block;visibility:visible;}
//-->
</style>
<ul class="shower">
<?php for($i=0;$i<10;$i++){ ?>
<li><a href="#" onclick="return false;"><img
src="img/<?=$i ?>.jpg" /><span><img
src="img_gallery/<?=$i ?>.jpg" /></span></a></li>
<?php } ?>
</ul>
: --
: ※ 發信站: 批踢踢實業坊(ptt.cc)
: ◆ From: 118.166.105.188
: 推 awe5566:這樣是不是就不能跑出那個框框阿~ 09/24 23:47
: → awe5566:我主要是想要跑出那個框框裡面小圖~~ 09/24 23:48
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 140.113.158.15
推
09/26 11:07, , 1F
09/26 11:07, 1F
討論串 (同標題文章)