网页图片特效?如何实现网页特效
你是否对于网页图片特效和如何实现网页特效感到困惑?别担心,今天小编将为您揭开这个谜团,让我们一同探索吧!
网页素材的特效
不可否认,网页特效给网页增辉不少,使网页内容丰富多彩,加入了网页特效,不仅活跃了网页的气氛,而且它打破了网页静悄悄的感觉,有时候会起到一定的亲切力,让人们在浏览网页的同时又有一种享受的快感。就仿佛是在超市购物又聆听着动听的音乐似的。
在平常的网站中,网页特效以JavaScript编写为最常见,因此了解一点JavaScript脚本对网站初学者来说是个不错的选择。
网页特效一般分为:时间日期类时间日期类页面背景类页面特效类图形图象类按钮特效类鼠标事件类 Cookie脚本文本特效类状态栏特效代码生成类导航菜单类页面搜索类在线测试类密码类技巧类综合类游戏类等等。一些广告代码除使用Flash制作外,也有相当一部分使用了JavaScript脚本编写的网页特效。为此,此处简单介绍一下JavaScript:
JavaScript是一种基于对象(Object)和事件驱动(Event Driven)并具有安全性能的脚本语言。使用它的目的是与HTML超文本标记语言、Java脚本语言(Java小程序)一起实现在一个Web页面中连接多个对象,与Web客户交互作用。从而可以开发客户端的应用程序等。它是通过嵌入或调入到标准的HTML语言中实现的。它的出现弥补了HTML语言的缺陷,它是Java与HTML折衷的选择,具有以下几个基本特点:是一种脚本编写语言、基于对象的语言、简单性、安全性、动态性的、跨平台性。
可以说掌握好JavaScript对网站建设有着举足轻重的作用。
网页素材是指从现实生活中搜索到的、未经加工提炼的用来建设网站的资料。具体到美术创作而言,素材是美术家积累的形象资料(如速写、素描、照片、图片等)和文字材料(如有关的历史事件、神话故事、文学作品等等文字研究材料)等等素材的总和。
求网页特效代码
有创意,只是目前还不知道脚本里面那个函数控制拖动的~~~~
用表格实现不大可能,但可以虚画一个表格,然后用javascript的层定位技术应该可以实现的,
不知道你用来做什么的?
不过第一次看到这中问题,我可以尝试一下
哈哈,效果出来了。看看下面的效果,另存为.htm就可以看到效果了。是否为你要的效果呢?
点一下图片就可以拖动了,在点一下图片停止拖动。(注:拖动的时候不需要一直点住图片)
<html>
<head>
<title>shiyan</title>
<style
type='text/css'id='defaultPopStyle'>
*{
margin:5px.;padding:0;
}
.cPopText
{
left:200;
background-color:
#ff5555
;color:
#ffffff
;
border:10px
solid
#3333cc;
margin:10px;solid:#aa0000;bordercolor:
#000000;font-size:
18px;height:
40px;
padding-right:
10px;
padding-left:
10px;
padding-top:
4px;
padding-bottom:
4px;
}
#feixue{
text-align:center;font-size:14pt;color:#2222ff;}
</style>
<script
language="javascript">
kk=-1
function
ss(dypopLayer)
{
if(kk==1)
{
dypopLayer.style.visibility="visible"
MouseX=event.x;
MouseY=event.y;
dypopLayer.style.left=MouseX+document.body.scrollLeft-50;//使得鼠标在图片上
dypopLayer.style.top=MouseY+document.body.scrollTop-50;//使得鼠标在图片上
}
}
function
s2()
{
dypopLayer.style.visibility="hidden"
}
</script>
</head>
<body>
<h2>shiyan</h2>
<div
id="feixue">我的样式</div>
点一下图片就可以拖动了,在点一下图片停止拖动。(注:拖动的时候不需要一直点住图片)
<br>
<div
id='dypopLayer'
align="center"
style='position:absolute;z-index:1000;visibility:visibility'
class='cPopText'
onMouseDown="kk=kk*(-1)"
onmousemove=ss(dypopLayer)>
i
love
you<br><img
src="dansh2.jpg"
alt="图片"
width="150"
height="130"></div>
<div
id='dypopLayer2'
align="center"
style='position:absolute;z-index:1000;visibility:visibility'
class='cPopText'
onMouseDown="kk=kk*(-1)"
onmousemove=ss(dypopLayer2)>
i
love
you<br><img
src="dansh2.jpg"
alt="图片"
width="150"
height="130"></div>
<div
id='dypopLayer3'
align="center"
style='position:absolute;z-index:1000;visibility:visibility'
class='cPopText'
onMouseDown="kk=kk*(-1)"
onmousemove=ss(dypopLayer3)>
i
love
you<br><img
src="dansh2.jpg"
alt="图片"
width="150"
height="130"></div>
<br>
<br>
</body>
</html>
if
do
it
According
to
what
you
mean~~!
i
think
that
must
be
a
big
system,and
the
question
should
not
be
find
in
here~!?
maybe
you
should
find
a
Software
companie
to
solve
it.
about
you??
如何实现网页特效
图片不间断滚动代码:
</p>
<div id=demo style=overflow:hidden;height:300;width:150>
<div id=demo1>
<img src='roll/1.png'><br>
<img src='roll/2.png'><br>
<img src='roll/3.png'><br>
<img src='roll/4.png'><br>
<img src='roll/5.png'><br>
<img src='roll/6.png'><br>
<img src='roll/7.png'><br>
<img src='roll/8.png'><br>
<img src='roll/3.png'><br>
<img src='roll/4.png'><br>
<img src='roll/5.png'><br>
<img src='roll/6.png'><br>
<img src='roll/7.png'><br>
<img src='roll/8.png'><br>
<img src='roll/2.png'><br>
</div>
<div id=demo2></div>
</div>
<p>
<script>
var speed=30;
demo2.innerHTML=demo1.innerHTML
function Marquee()
{
if(demo2.offsetTop-demo.scrollTop<=0)
demo.scrollTop-=demo1.offsetHeight;
else
demo.scrollTop++;
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function(){clearInterval(MyMar)}
demo.onmouseout=function(){MyMar=setInterval(Marquee,speed)}
</script>
</p>
插入音乐代码:
1.如何贴rm,ra,ram类型的音乐,代码如下:
<embed width="0" height="0" type="audio/x-pn-realaudio-plugin" autostart="true" controls="ControlPanel" src="http://guest.anyp.cn/uploads/01.rm";>
2.如何贴midi,asf,wma,asx类型的音乐,代码如下:
<embed autostart="true" loop="-1" controls="ControlPanel" width="0" height="0" src="http://guest.anyp.cn/uploads/01.mid";>
滚动字幕代码:
1.建立第一个滚动字幕。代码:
<marquee width="200" height="100" direction="right" behavior="alternate" scrollamount="6" scrolldelay="88">欢迎光临1</marquee>
2.各参数详解:
a)scrollAmount。它表示速度,值越大速度越快。如果没有它,默认为6,建议设为1~3比较好。
b)width和height,表示滚动区域的大小,width是宽度,height是高度。特别是在做垂直滚动的时候,一定要设height的值。
c)direction。表示滚动的方向,默认为从右向左:←←←。可选的值有right、down、up。滚动方向分别为:right表示→→→,up表示↑,down表示↓。
d)scrollDelay,这也是用来控制速度的,默认为90,值越大,速度越慢。通常scrollDelay是不需要设置的。
e)behavior。用它来控制属性,默认为循环滚动,可选的值有alternate(交替滚动)、slide(幻灯片效果,指的是滚动一次,然后停止滚动)
文章到此结束,希望我们对于网页图片特效的问题能够给您带来一些启发和解决方案。如果您需要更多信息或者有其他问题,请随时联系我们。