在Dreamweaver中,如何实现鼠标经过文字时在鼠标旁边自动出现图片?
在Dreamweaver中,如何实现鼠标经过文字时在鼠标旁边自动出现想要的图片?我查了一下,说是可以用层设置来实现,可是具体怎么做?怎么设置?求助!!...
在Dreamweaver中,如何实现鼠标经过文字时在鼠标旁边自动出现想要的图片?
我查了一下,说是可以用层设置来实现,可是具体怎么做?怎么设置?
求助!! 展开
我查了一下,说是可以用层设置来实现,可是具体怎么做?怎么设置?
求助!! 展开
展开全部
您好,关于这个层,我的代码如下:
首先给你说说思路,你把鼠标移动到文字上面,这个时候其实你鼠标旁边就有一个隐藏的层,层里面有一个img图片的样式框,接下来就是调用就是一个onmoseover()事件,然后用这个事件调用一个函数,函数里面将这个层显示并且获得当前鼠标移动位置的坐标即可。这是我的思路,虽然美工方面和代码没有那么标准,我也算是个新手,呵呵,希望多多交流
代码如下:
<script language="javascript" type="text/javascript">
var x,y;
document.onmousemove=showplace;//鼠标位置记录
function showdiv()
{
//显示一个隐藏的层
var showdiv = document.getElementById("showdiv");
if(showdiv.style.display=="none")
{
showdiv.style.display = "block";
showdiv.style.marginLeft=x;
showdiv.style.marginTop=y;
}
else
showdiv.style.display = "none";
}
//获取当前鼠标位置
function showplace()
{
x= window.event.clientX;
y= window.event.clientY;
}
</script>
<body>
<!--当鼠标移上来的时候,出发这个事件-->
<b onmouseover="showdiv()" onmouseout="showdiv()">
asd1231231312321
</b>
<div id="showdiv" style="border:1px #009 solid; display:none; width:100px; height:100px; background-image:url(fightingReport.jpg);">
</div>
<div id="p1">
</div>
<div id="p2">
</div>
</body>
首先给你说说思路,你把鼠标移动到文字上面,这个时候其实你鼠标旁边就有一个隐藏的层,层里面有一个img图片的样式框,接下来就是调用就是一个onmoseover()事件,然后用这个事件调用一个函数,函数里面将这个层显示并且获得当前鼠标移动位置的坐标即可。这是我的思路,虽然美工方面和代码没有那么标准,我也算是个新手,呵呵,希望多多交流
代码如下:
<script language="javascript" type="text/javascript">
var x,y;
document.onmousemove=showplace;//鼠标位置记录
function showdiv()
{
//显示一个隐藏的层
var showdiv = document.getElementById("showdiv");
if(showdiv.style.display=="none")
{
showdiv.style.display = "block";
showdiv.style.marginLeft=x;
showdiv.style.marginTop=y;
}
else
showdiv.style.display = "none";
}
//获取当前鼠标位置
function showplace()
{
x= window.event.clientX;
y= window.event.clientY;
}
</script>
<body>
<!--当鼠标移上来的时候,出发这个事件-->
<b onmouseover="showdiv()" onmouseout="showdiv()">
asd1231231312321
</b>
<div id="showdiv" style="border:1px #009 solid; display:none; width:100px; height:100px; background-image:url(fightingReport.jpg);">
</div>
<div id="p1">
</div>
<div id="p2">
</div>
</body>
展开全部
这个很简单,不用JS。用css完全可以。而且也不用层,主要利用,background:url()的属性。
这个要是用JS,那也太夸张了。
这个要是用JS,那也太夸张了。
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
这个得用到js语句,就是取当前鼠标的位置再追加一个层,层内放图
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询