網頁設計滑鼠換圖片_網頁設計中把滑鼠改變成自己喜歡的圖案

1、Dreamweaver 網頁設計滑鼠經過圖片

﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌

看最下面的注意事項，檢查一下。

﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌

按圖示進行操作：

點擊「插入工具欄」中圖像按鈕邊上的下箭頭，在下拉菜單中選擇「滑鼠經過圖像」，如圖二，隨後填寫彈出的對話框中的信息,參照圖三。

* 圖像名稱，就是給圖片命名的名稱，是<img>標簽的id；

* 原始圖像，就是網頁載入完畢後該位置顯示的默認圖片；

* 滑鼠經過圖像，即滑鼠懸浮在圖片上時的翻轉圖像；

* 預載滑鼠圖像，這個選項最好勾選，選中後它會在打開頁面時預載懸浮圖像，不會出現滑鼠懸在圖片上時再重新載入而變成空白塊的現象，勾選此項同時會在頁面源代碼的body中加入一段onload="MM_preloadImages('abang2.gif')"的代碼，意思就是頁面載入時預載此圖片。

* 替換文本，這個選項會在滑鼠懸浮和載入不出圖片時顯示你所填的文字作為提示；

* 按下時，前往的URL，顧名思義，它就是你點擊圖片後進入的網頁，這里所填的是相對地址，如果要轉到其他外部網址一定要以http://開頭。

以上內容全部填好後點擊確定按鈕，Dreamweaver就會自動在頁面中加入一段Javascript代碼，看不懂它沒關系，只要會用就可以了。滑鼠懸浮翻轉圖片效果就完成了。然後，按下F12預覽一下。

﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌﹌

如果有問題要注意以下幾點：

1、盡量避免用中文名稱命名文件和中文鏈接；

2、鏈接路徑一定要正確。

3、頁面中的Javascript代碼還在不在

如果還有問題請用baidu hi聯系我。

2、web網頁設計問題，怎麼設計出下圖的效果，就是滑鼠移上去就切換內容

我給你簡單的寫了例子，至於具體樣式，你自己來寫吧
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
<script>
function meun(mun) {
var tab_name = document.getElementsByName("li");
for(var j=1;j<tab_name.length+1;j++){
for ( var i=1; i<=j; i++){
if ( i==mun ){
document.getElementById("right"+i).style.display="block";
document.getElementById("li"+i).style.color="#0ff";
}
else {
document.getElementById("right"+i).style.display="none";
document.getElementById("li"+i).style.color="#000";
}
}
}
}
</script>
<style>
.left_ul { float:left; width:200px;}
.left_ul li { height:30px; line-height:30px; text-align:center;}
.right1 { display:block; width:400px; float:left; height:200px; background:#999999;}
.right2 { display:none; width:400px; float:left; height:200px; background:#af6439;}
.right3 { display:none; width:400px; float:left; height:200px; background:#0ff;}
.right4 { display:none; width:400px; float:left; height:200px; background:#00f;}</style>
</head>
<body>
<ul class="left_ul">
<li name="li"><a href="#" onmousemove="meun(1)" id="li1">欄目1</a></li>
<li name="li"><a href="#" onmousemove="meun(2)" id="li2">欄目1</a></li>
<li name="li"><a href="#" onmousemove="meun(3)" id="li3">欄目1</a></li>
<li name="li"><a href="#" onmousemove="meun(4)" id="li4">欄目1</a></li>
</ul>
<div class="right1" id="right1">11111111111111111111111</div>
<div class="right2" id="right2">222222222222222222222</div>
<div class="right3" id="right3">3333333333333333333333</div>
<div class="right4" id="right4">44444444444444444444444444</div>
</body>
</html>

3、網頁設計中把滑鼠改變成自己喜歡的圖案??

用CSS實現。

改變整頁的滑鼠指針：
<style type="text/css">
body {
cursor:normal; /*使用系統默認指針，就是箭頭*/

cursor:url(mouse1.cur); /*使用你自己回提供是靜態答指針*/

cursor:url(mouse2.ani); /*使用你自己提供是動畫指針*/
｝
</style>

改變鏈接指針：把上述的body改為a即可。

單獨為某個對象添加特殊指針只要為該對象添加style樣式即可：
<style="cursor:normal; 或cursor:url(mouse1.cur); 或cursor:url(mouse2.ani); ">

4、你是怎樣做的呢就是用網頁設計的滑鼠經過圖片然後變成另一個圖片謝謝了

<img src="pic1.jpg" height="360" width="1000" border="none" id="aaa" /> <script> var aaa=document.getElementById("aaa") aaa.onmouseover=function(){ aaa.src="pic2.jpg" } aaa.onclick=function(){ aaa.src="pic3.jpg" } aaa.onmouseout=function(){ aaa.src="pic1.jpg" } </script>

5、在網頁里的圖片如何做到將滑鼠放上去後就會變成另一張圖片

需要用Dreamweaver來操作將滑鼠放上去一張圖片變成另一張圖片。

具體的操作方法和步驟如下：

1、第一步，需要打開Dreamweave軟體進入，依次單擊上方的「插入」-->「圖像對象」-->「滑鼠經過圖像」，如下圖所示。

2、其次，完成上述步驟後，彈出對話框，需要插入兩輛車，白色車是原始圖像，橙色車是經過的圖像，如下圖所示。

3、接著，完成上述步驟後，可以進行設置了。可以先在網頁上預覽，在頁面上，有一個類似地球的小瀏覽器徽標，如下圖所示。

4、最後，完成上述步驟後，可以看到單擊後將變成另一張圖片，因此可以保存設置並完成操作了，如下圖所示。這樣，問題就解決了。

6、在網頁製作中，怎麼把圖片應用為動態HTML效果？當滑鼠懸停時圖片1換成圖片2，要怎麼設置？

Dreamweaver中可以自動設置的
工具欄中「插入」-「圖片對象」-「滑鼠經過圖片」
如果是用內CSS實現的話，可以在容需要設置動態效果的標簽中使用偽類:hover
具體怎麼用，就看你對CSS的掌握程度了。
PS：該方法不適用於IE6，其他的可以。
再有就是用JavaScript來實現了。
對於初學者的話，直接用Dreamweaver來實現比較容易。
後面兩種方法涉及到的東西比較多。

7、網頁設計中如何更換滑鼠指針，求步驟

<span style="cursor:pointer;">測試</span>
pointer是滑鼠指針的樣式，這里是手指型的，下面有更多類型的
default 默認游標（通常是一個箭頭）
auto 默認。瀏覽器設置的游標。
crosshair 游標呈現為十字線。
pointer 游標呈現為指示鏈接的指針（一隻手）
move 此游標指示某對象可被移動。
e-resize 此游標指示矩形框的邊緣可被向右（東）移動。
ne-resize 此游標指示矩形框的邊緣可被向上及向右移動（北/東）。
nw-resize 此游標指示矩形框的邊緣可被向上及向左移動（北/西）。
n-resize 此游標指示矩形框的邊緣可被向上（北）移動。
se-resize 此游標指示矩形框的邊緣可被向下及向右移動（南/東）。
sw-resize 此游標指示矩形框的邊緣可被向下及向左移動（南/西）。
s-resize 此游標指示矩形框的邊緣可被向下移動（南）。
w-resize 此游標指示矩形框的邊緣可被向左移動（西）。
text 此游標指示文本。
wait 此游標指示程序正忙（通常是一隻表或沙漏）。
help 此游標指示可用的幫助（通常是一個問號或一個氣球）。

8、在網頁製作中,滑鼠經過圖片,圖片轉換怎麼做?

用CSS來實現copy比較簡單
<style type="text/css">

</style>
<a href="#">你的鏈接</a>

導航:首頁 > 萬維百科 > 網頁設計滑鼠換圖片

網頁設計滑鼠換圖片

與網頁設計滑鼠換圖片相關的知識