网页设计鼠标换图片_网页设计中把鼠标改变成自己喜欢的图案

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>

导航:首页 > 万维百科 > 网页设计鼠标换图片

网页设计鼠标换图片

与网页设计鼠标换图片相关的知识