急求鼠标后跟随文字的几个网页特效代码
你随便弄个网页
以下代码插入<head>标签之内,保存预览,就可以看到很漂亮的文字环绕鼠标:
<SCRIPT
LANGUAGE="JavaScript">
if
(document.all)
{
yourLogo
=
"我想有个家一个温暖的家";
//自己根据要求设置//
logoFont
=
"宋体";
logoColor
=
"#00ccff";
yourLogo
=
yourLogo.split('');
L
=
yourLogo.length;
TrigSplit
=
360
/
L;
Sz
=
new
Array()
logoWidth
=
100;
logoHeight
=
-30;
ypos
=
0;
xpos
=
0;
step
=
0.03;
currStep
=
0;
document.write('<div
id="outer"
style="position:absolute;top:0px;left:0px"><div
style="position:relative">');
for
(i
=
0;
i
<
L;
i++)
{
document.write('<div
id="ie"
style="position:absolute;top:0px;left:0px;'
+'width:10px;height:10px;font-family:'+logoFont+';font-size:12px;'
+'color:'+logoColor+';text-align:left">'+yourLogo[i]+'</div>');
}
document.write('</div></div>');
function
Mou()
{
ypos
=
event.y;
xpos
=
event.x
-
5;
}
document.onmoumove=Mou;
function
animateLogo()
{
outer.style.pixelTop
=
document.body.scrollTop;
for
(i
=
0;
i
<
L;
i++)
{
ie[i].style.top
=
ypos
+
logoHeight
*
Math.sin(currStep
+
i
*
TrigSplit
*
Math.PI
/
180);
ie[i].style.left
=
xpos
+
logoWidth
*
Math.cos(currStep
+
i
*
TrigSplit
*
Math.PI
/
180);
Sz[i]
=
ie[i].style.pixelTop
-
ypos;
if
(Sz[i]
<
5)
Sz[i]
=
5;
ie[i].style.fontSize
=
Sz[i]
/
1.7;
}
currStep
-=
step;
tTimeout('animateLogo()',
20);
}
window.onload
=
animateLogo;
}
</script>
鼠标悬停特效代码怎么写,鼠标放在小图片上旁边显示一张大图片?
代码有bug,修改后如下:
需要注意,拷贝下面这段代码,保存为 html后缀名的文件;需要自己在相同的目录下,放置两张图片,小图片.jpg 大图片.jpg
效果如下图:当鼠标悬停在小图片上面的时候,会显示大图片;鼠标移出,隐藏大图片。
问题:定位需要读者自己去实现一下吧,偷懒了。感谢楼上分享!
<!doctypehtml>
<html>
<head>
<metachart=utf-8>
</head>
<body>
你要显示特效的html
<imgsrc="小图片.jpg"width="200px"height="200px"id="littleimg"onmouout="hoverHiddendiv()"onmouenter="hoverShowDiv()"/>
<divstyle="width:200px;height:80px;border:1pxsolide#aaccff;display:none;"id="divHover">
大图片显示如下
<imgsrc="大图片.jpg"width="500px"height="300px"id="bigimg"/>
</div>
<scripttype="text/javascript">
letdivHover=document.getElementById("divHover");
functionhoverShowDiv(){
console.log("显示大图片");
divHover.style.display="block";
divHover.style.top=document.getElementById("littleimg").style.top+10;
divHover.style.left=document.getElementById("littleimg").style.left+10;
}
functionhoverHiddendiv(){
console.log("显示小图片");
divHover.style.display="none";
}
</script>
</body>
</html>
鼠标特效代码要怎么使用
通过鼠标的事件来激发!随便找了些鼠标特效的网站: http://www.wangqi.com/c262.aspxjs鼠标事件大全 资料来源: http://hsyd.javaeye.com/blog/382930onClick IE3|N2|O3 鼠标点击事件,多用在某个对象控制的范围内的鼠标点击
onDblClick IE4|N4|O 鼠标双击事件
onMouDown IE4|N4|O 鼠标上的按钮被按下了
onMouUp IE4|N4|O 鼠标按下后,松开时激发的事件
onMouOver IE3|N2|O3 当鼠标移动到某对象范围的上方时触发的事件
onMouMove IE4|N4|O 鼠标移动时触发的事件
onMouOut IE4|N3|O3 当鼠标离开某对象范围时触发的事件
onKeyPress IE4|N4|O 当键盘上的某个键被按下并且释放时触发的事件.[注意:页面内必须有被聚焦的对象]
onKeyDown IE4|N4|O 当键盘上某个按键被按下时触发的事件[注意:页面内必须有被聚焦的对象]
onKeyUp IE4|N4|O 当键盘上某个按键被按放开时触发的事件[注意:页面内必须有被聚焦的对象]
页面相关事件 事件 浏览器支持 描述
onAbort IE4|N3|O 图片在下载时被用户中断
onBeforeUnload IE4|N|O 当前页面的内容将要被改变时触发的事件
onError IE4|N3|O 捕抓当前页面因为某种原因而出现的错误,如脚本错误与外部数据引用的错误
onLoad IE3|N2|O3 页面内空完成传送到浏览器时触发的事件,包括外部文件引入完成
onMove IE|N4|O 浏览器的窗口被移动时触发的事件
onResize IE4|N4|O 当浏览器的窗口大小被改变时触发的事件
onScroll IE4|N|O 浏览器的滚动条位置发生变化时触发的事件
onStop IE5|N|O 浏览器的停止按钮被按下时触发的事件或者正在下载的文件被中断
onUnload IE3|N2|O3 当前页面将被改变时触发的事件
表单相关事件 事件 浏览器支持 描述
onBlur IE3|N2|O3 当前元素失去焦点时触发的事件 [鼠标与键盘的触发均可]
onChange IE3|N2|O3 当前元素失去焦点并且元素的内容发生改变而触发的事件 [鼠标与键盘的触发均可]
onFocus IE3|N2|O3 当某个元素获得焦点时触发的事件
onRet IE4|N3|O3 当表单中RESET的属性被激发时触发的事件
onSubmit IE3|N2|O3 一个表单被递交时触发的事件
滚动字幕事件 事件 浏览器支持 描述
onBounce IE4|N|O 在Marquee内的内容移动至Marquee显示范围之外时触发的事件
onFinish IE4|N|O 当Marquee元素完成需要显示的内容后触发的事件
onStart IE4|N|O 当Marquee元素开始显示内容时触发的事件
编辑事件 事件 浏览器支持 描述
onBeforeCopy IE5|N|O 当页面当前的被选择内容将要复制到浏览者系统的剪贴板前触发的事件
onBeforeCut IE5|N|O 当页面中的一部分或者全部的内容将被移离当前页面[剪贴]并移动到浏览者的系统剪贴板时触发的事件
onBeforeEditFocus IE5|N|O 当前元素将要进入编辑状态
onBeforePaste IE5|N|O 内容将要从浏览者的系统剪贴板传送[粘贴]到页面中时触发的事件
onBeforeUpdate IE5|N|O 当浏览者粘贴系统剪贴板中的内容时通知目标对象
onContextMenu IE5|N|O 当浏览者按下鼠标右键出现菜单时或者通过键盘的按键触发页面菜单时触发的事件 [试试在页面中的<body>中加入onContentMenu="return fal"就可禁止使用鼠标右键了]
onCopy IE5|N|O 当页面当前的被选择内容被复制后触发的事件
onCut IE5|N|O 当页面当前的被选择内容被剪切时触发的事件
onDrag IE5|N|O 当某个对象被拖动时触发的事件 [活动事件]
onDragDrop IE|N4|O 一个外部对象被鼠标拖进当前窗口或者帧
onDragEnd IE5|N|O 当鼠标拖动结束时触发的事件,即鼠标的按钮被释放了
onDragEnter IE5|N|O 当对象被鼠标拖动的对象进入其容器范围内时触发的事件
onDragLeave IE5|N|O 当对象被鼠标拖动的对象离开其容器范围内时触发的事件
onDragOver IE5|N|O 当某被拖动的对象在另一对象容器范围内拖动时触发的事件
onDragStart IE4|N|O 当某对象将被拖动时触发的事件
onDrop IE5|N|O 在一个拖动过程中,释放鼠标键时触发的事件
onLoCapture IE5|N|O 当元素失去鼠标移动所形成的选择焦点时触发的事件
onPaste IE5|N|O 当内容被粘贴时触发的事件
onSelect IE4|N|O 当文本内容被选择时的事件
onSelectStart IE4|N|O 当文本内容选择将开始发生时触发的事件
数据绑定 事件 浏览器支持 描述
onAfterUpdate IE4|N|O 当数据完成由数据源到对象的传送时触发的事件
onCellChange IE5|N|O 当数据来源发生变化时
onDataAvailable IE4|N|O 当数据接收完成时触发事件
onDatatChanged IE4|N|O 数据在数据源发生变化时触发的事件
onDatatComplete IE4|N|O 当来子数据源的全部有效数据读取完毕时触发的事件
onErrorUpdate IE4|N|O 当使用onBeforeUpdate事件触发取消了数据传送时,代替onAfterUpdate事件
onRowEnter IE5|N|O 当前数据源的数据发生变化并且有新的有效数据时触发的事件
onRowExit IE5|N|O 当前数据源的数据将要发生变化时触发的事件
onRowsDelete IE5|N|O 当前数据记录将被删除时触发的事件
onRowsInrted IE5|N|O 当前数据源将要插入新数据记录时触发的事件
数据绑定 事件 浏览器支持 描述
onAfterPrint IE5|N|O 当文档被打印后触发的事件
onBeforePrint IE5|N|O 当文档即将打印时触发的事件
onFilterChange IE4|N|O 当某个对象的滤镜效果发生变化时触发的事件
onHelp IE4|N|O 当浏览者按下F1或者浏览器的帮助选择时触发的事件
onPropertyChange IE5|N|O 当对象的属性之一发生变化时触发的事件
onReadyStateChange IE4|N|O 当对象的初始化属性值发生变化时触发的事件 仅供参考!
鼠标特效代码
006-05-03 15:12:34 评论 ┆ 举报
最佳答案此答案由提问者自己选择,并不代表百度知道知识人的观点
回答:慕容星沉
学弟
5月3日 17:34 第一种方式比较简单.如我用的这个(效果见http://sina.kosoo.cn),鼠标是一个旋转的蓝宝石,当指向连接时则显示的是我名字
代码<STYLE type=text/css>
a:hover {cursor:url('http://www1.pzmwl.com/upload/MuRongXingChen.cur')}
BODY {cursor:url('http://image2.sina.com.cn/dongman/pictcol/2005-11-04/U1111P55T4D74746F422DT20051104171606.ani')</STYLE>
你更换鼠标地址为你喜欢的样式即可
如果每次刷新主页,都会出现不同风格的鼠标指针,那种变幻莫测的感觉一定很不错吧!感兴趣的话就 Follow me!
(1)在既有面板中加入下面的代码(作用是随机调用CSS文件);
(2)用记事本创建数个CSS文件(依实际要求而定),分别命名为style1.css、tyle2.css……
(3)将创建的CSS全部上传,务使其都在同一目录下。
javascript 代码:
<link id="stt" type="text/css" rel="stylesheet" href="b_sty.css">
<script Language="javascript">
<!-- Begin
var Folder = "CSS文件所在目录";
var how_many_ads = 鼠标指针套数;
var now = new Date();
var c = now.getSeconds();
var ad = c % how_many_ads;
var css = "";
ad +=1;
if (ad == 1) {css = "style1.css";}
if (ad == 2) {css = "style2.css";}
……
lf.stt.href = Folder + css
//-->
</script>
★ “CSS文件所在目录”是CSS文件除去文件名的网址,比如你的CSS文件所在网址为http://www1.freehostingguru.com/bimzcy/style1.css
那么你CSS文件所在的目录就是http://www1.freehostingguru.com/bimzcy/
★ 鼠标指针套数是指刷新主页后鼠标指针不同的次数,一套鼠标指针图片包括一张或两张鼠标指针图片。如果鼠标指针套数是2套,那么该处值为2。
★ 省略号(……)处是和你鼠标指针的图片套数是相关的,如果你的鼠标指针的图片套数是2套,那么写到if (ad == 2) {css = "style2.css";}就可以了,如果是3套,就继续写if (ad== 3) {css = "style3.css";},依次类推。
★ 提供.css文件上传的网页空间地址:http://www1.freehostingguru.com/logincn.php4
★ 鼠标指针大全网站(就是大家熟悉的山水呵):http://myok.blogchina.com/2081936.html
★ 包含322个鼠标指针图片的下载包:http://www.windown.net/soft/235.htm
★ 提供鼠标指针图片文件(.cur、.ani)上传的网页空间地址:
飘之梦网络文件上传:http://www1.pzmwl.com/
华尔兹上传空间:http://bzwaltz.w1.net.cn/upload/upload.asp
揪错 ┆ 评论1 ┆ 举报
关于qq空间鼠标跟随特效代码
注意:将鼠标移动到黑色区域即可查看效果
(友情提示:其中有一些以前发过,但是地址基本上全部失效,以下是最新整理,地址永久有效)
如何放到空间:
点自定义---模块--添加模块---flash动画模块--设置透明,循环,自动播放,边框无,确定即可!!
Qzone最热门的几款鼠标效果FLASH:
第一款:鼠标滑过出现心效果
第一款地址:/UploadFile/201009/25/EC163338107.swf?url=xin1
第二款:鼠标滑过星星下落效果
第二款地址:/UploadFile/201009/25/EC163338107.swf?url=xin2
第三款:鼠标滑过画出一个心(白色版)
第三款地址:/UploadFile/201009/25/EC163338107.swf?url=xin3
鼠标滑过画出一个心(绿色版)
/UploadFile/201009/25/EC163338107.swf?url=xin4
鼠标滑过画出一个心(红色版)
/UploadFile/201009/25/EC163338107.swf?url=xin5
鼠标滑过画出一个心(**版)
/UploadFile/201009/25/EC163338107.swf?url=xin6
第四款:鼠标滑过出现漂亮的心
第四款地址:/UploadFile/201009/25/EC163338107.swf?url=xin8
第五款:鼠标滑过出现蓝色幻彩光点
第五款地址:/UploadFile/201009/25/EC163338107.swf?url=lan
第六款:鼠标滑过出现白色幻彩光点
第六款地址:/UploadFile/201009/25/EC163338107.swf?url=bai
第七款:鼠标滑过出现红色幻彩光点
第七款地址:/UploadFile/201009/25/EC163338107.swf?url=hong
第八款:鼠标滑过出现绿色幻彩光点
第八款地址:/UploadFile/201009/25/EC163338107.swf?url=lv
第九款:旋转白点散开、分散特效
第九款地址:/UploadFile/201009/25/64163339600.swf?id=mou/1&.swf
鼠标划过蓝色光点:
/UploadFile/201009/25/EC163338107.swf?url=1
跟随鼠标旋转的特效:
/UploadFile/201009/25/EC163338107.swf?url=2
鼠标滑过旋转散花效果:
/UploadFile/201009/25/EC163338107.swf?url=3
鼠标滑过变幻光点:
/UploadFile/201009/25/EC163338107.swf?url=4
鼠标跟随蓝色星星:
/UploadFile/201009/25/EC163338107.swf?url=5
鼠标跟随蓝幻光斑:
/UploadFile/201009/25/EC163338107.swf?url=6
在Dreamweaver中的鼠标跟踪特效的代码应该怎么写?
要用到 JavaScript 特效
把如下代码加入<head>区域中
图片跟踪鼠标代码:
QQ.jpg 是图片
<SCRIPT language="JavaScript">
<!--
B=document.all;
C=document.layers;
T1=new Array("qq.jpg",38,35,"qq.jpg",30,31,"qq.jpg",28,26,"qq.jpg",22,21,"qq.jpg",16,16)
nos=parInt(T1.length/3)
rate=50
ie5fix1=0;
ie5fix2=0;
for (i=0;i<nos;i++){
createContainer("CUR"+i,i*10,i*10,i*3+1,i*3+2,"","<img src='"+T1[i*3]+"' width="+T1[(i*3+1)]+" height="+T1[(i*3+2)]+" border=0>")}
function createContainer(N,Xp,Yp,W,H,At,HT,Op,St){
with (document){
write((!B) ? "<layer id='"+N+"' left="+Xp+" top="+Yp+" width="+W+" height="+H : "<div id='"+N+"'"+" style='position:absolute;left:"+Xp+"; top:"+Yp+"; width:"+W+"; height:"+H+"; ");
if(St){
if (C)
write(" style='");
write(St+";' ")
}
el write((B)?"'":"");
write((At)? At+">" : ">");
write((HT) ? HT : "");
if (!Op)
cloContainer(N)
}
}
function cloContainer(){
document.write((B)?"</div>":"</layer>")
}
function getXpos(N){
return (B) ? parInt(B[N].style.left) : C[N].left
}
function getYpos(N){
return (B) ? parInt(B[N].style.top) : C[N].top
}
function moveContainer(N,DX,DY){
c=(B) ? B[N].style :C[N];c.left=DX;c.top=DY
}
function cycle(){
//if (IE5)
if (document.all&&window.print){
ie5fix1=document.body.scrollLeft;
ie5fix2=document.body.scrollTop;
}
for (i=0;i<(nos-1);i++){
moveContainer("CUR"+i,getXpos("CUR"+(i+1)),getYpos("CUR"+(i+1)))
}
}
function newPos(e){
moveContainer("CUR"+(nos-1),(B)?event.clientX+ie5fix1:e.pageX+2,(B)?event.clientY+ie5fix2:e.pageY+2
)
}
if(document.layers)
document.captureEvents(Event.MOUSEMOVE)
document.onmoumove=newPos
tInterval("cycle()",rate)
//-->
</SCRIPT>
文字特效:
word[1]="L";word[2]="A";word[3]="O";word[4]="H";word[5]="E";
LAOHE 是你设置的字体
<SCRIPT language=javascript>
<!--//This is a JS program for Sword Jin's JoyFM homepage.All rights rerved.
var cx=0;
var cy=0;
var val=0;
function locate()
{ cx=window.event.x;
cy=window.event.y;
}
document.onmoumove=locate;
function follow(i)
{ var x;
if(i<4)x=cx-50+i*10;
el x=cx-25+i*10;
var y=cy-20+Math.floor(Math.random()*40);
w=eval("word"+i);
with(w.style)
{
left=x.toString()+"px";
top=y.toString()+"px";
}
}
function show(i)
{
var w=eval("word"+i);
with(w.style)
{
visibility="visible";
s=parInt(fontSize);
if(s>=200)s-=100;
el if(s>90&&s<=100)
{
s-=85;
clearInterval(val);
if(i<5)val=tInterval("show("+(i+1)+")",20);
}
fontSize=s;
}
}
function start()
{ for(i=1;i<=5;i++)
{
val=tInterval("show(1)",20);
tInterval("follow("+i+")",100);
}
}
//-->
</SCRIPT>
<SCRIPT language=javascript>
var word=new Array(5);
word[1]="L";word[2]="A";word[3]="O";word[4]="H";word[5]="E";
for(i=1;i<=5;i++)
document.write("<div id='word"+i+"' style='width:20px;height:20px;position:absolute;font-size:1000;visibility:hidden'><font face='Forte' color='red'>"+word+"</font></div>");start();
</SCRIPT>