作者chippclass (善假狼)
看板Web_Design
標題Re: [問題] html or jsp or css 圖片
時間Wed Apr 27 00:33:17 2005
新手獻醜一下，以下如有錯請指正
就我學過和測試過的ＣＳＳ語法中
基本上，使用 hidden 隱藏的物件，滑鼠是偵測不到的
就像打星海的時候有一隻遁地獸很快樂的在捅你，
雖然你也知道他龜在哪邊，但你就是無法叫一般兵種去清掉他
--
這時候，就有必要請特殊兵種出來幫忙了
--
※ 引述《cheetim (黑惡魔 ~~好想要)》之銘言：
: 我現在想要做的是在網頁上放一張圖片
: 當滑鼠滑過後 會顯示另一張圖片
: 還有一種是 圖片先隱藏 當滑鼠滑過後圖片才顯示 下面是第二種，但是我做出來會一直
: 隱藏沒有反應 我是用css
: a {
: text-decoration:none;
: visibility:hidden;
: }
: a:hover {
: text-decoration:none;
: visibility:visible;
: }
: 請幫幫忙 謝謝先
基本上，這戰術看起來很像是說當滑鼠移過隱藏的遁地獸時
但是，就我所了解的理論，這是不可能的
原因：就是因為物件根本就被隱藏了，無法觸發 a:hover 的事件
visibility:visiable也無法被執行
--
假設：不才小弟以上所說的沒錯
那麼，解決方法有３個
（一）準備一張跟背景同色的同片
如果背景是圖片，可以利用繪圖軟體製作透明的圖片
然後再利用你已經會的圖片交換法
讓滑鼠移進移出時變換這２張圖就可以了
這就好像是用小蜜蜂探查出遁地獸的位置再加以攻擊
但是別忘了用重騎兵別用狂戰士不然會死傷慘重
抱歉，上面那一句是多餘的 o(= =)o
--
（二）使用透明物件和這張隱藏的圖重疊
使用絕對位置，設定範圍大小還有位置，當然還有層級
這邊建議的是用 table 不要用 div 或是 span
原因？ 之前有一篇遮住 WINDOWS 面板的參考一下
然後接下來就是借刀殺人了
把觸發事件設在這透明物件上，把觸發目標設成該隱藏圖片
<img id='i'>
<table onmouseover='i.visibility=\'\'' onmouseout='i.visibility=\'hidden\''>
這種方法就好像當你只有一隻毛毛蟲的時候
引誘一隻小狗靠近遁地獸，然後再噴他一陀口水來個一箭雙鵰，借刀殺人
--
（三）如果說這時候你手邊有一隻
皮卡丘抱歉，更正，是聖堂武士
那方法就更快了，５０萬福特伺候就對了
不過５０萬福特使用上有點難度，小弟我老是沒弄好電死自己
不過我還是稍微提一下
首先確認該隱藏圖片藏身地點，包括上下左右四邊界
然後在 Body 中設定 onmousemove 的事件
大致上的實體語法如下(不過個人覺得不太好，有待加強)
--
<img id='i'> (已知左邊界100 上邊界10 寬高各200)
(換言之 下邊界 210 右邊界300)
<body onmousemove='showout_image()'>
<script language='javascript'>
function showout_image()
{
if(event.clientX>99 && event.clientX<301 && event.clientY>9
&& event.clientY<209)
{
i.visibility=""
}
else
{
i.visibility="hidden"
}
}
</script>
--
獻醜完畢 o(‧""‧)o
謝謝收看
--
我是誰？
只是個不重要的重考生
距離統測剩下１８天
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 218.162.73.191
1F：推 Hikki520:推星海的兵種=.= 218.170.66.208 04/27
2F：推 TKirby:推薦這篇文章 140.112.30.52 04/27
3F：推 mrbigmouth:推太強了XD140.112.248.160 04/27
4F：推 cheetim:感謝阿 但是我只會爆狗海... 140.118.229.32 04/27
5F：推 shouea:寫的好 XD 163.20.17.251 04/28