javascript2

来源:互联网 发布:淘宝收货地址在哪里改 编辑:程序博客网 时间:2024/04/28 00:18


※ 效果演示 ※
 

 
 
左右移?的?片[修改?片名?即可][共2步]

====1、?以下代?加入到HEML的<head></head>之?:

<script LANGUAGE="JavaScript"><!--
step = 0;
obj = new Image();
function anim(xp,xk,smer) //smer = direction
{
obj.style.left = x;
x += step*smer;
if (x>=(xk+xp)/2) {
if (smer == 1) step--;
else step++;
}
else {
if (smer == 1) step++;
else step--;
}
if (x >= xk) {
x = xk;
smer = -1;
}
if (x <= xp) {
x = xp;
smer = 1;
}
// if (smer > 2) smer = 3;
setTimeout('anim('+xp+','+xk+','+smer+')', 50);
}
function moveLR(objID,movingarea_width,c)
{
if (navigator.appName=="Netscape") window_width = window.innerWidth;
else window_width = document.body.offsetWidth;
obj = document.images[objID];
image_width = obj.width;
x1 = obj.style.left;
x = Number(x1.substring(0,x1.length-2)); // 30px -> 30
if (c == 0) {
if (movingarea_width == 0) {
right_margin = window_width - image_width;
anim(x,right_margin,1);
}
else {
right_margin = x + movingarea_width - image_width;
if (movingarea_width < x + image_width) window.alert("No space for moving!");
else anim(x,right_margin,1);
}
}
else {
if (movingarea_width == 0) right_margin = window_width - image_width;
else {
x = Math.round((window_width-movingarea_width)/2);
right_margin = Math.round((window_width+movingarea_width)/2)-image_width;
}
anim(x,right_margin,1);
}
}
//--></script>

====2、?以下代?加入到HEML的<body></body>之?:

<img src="要?示的?片名?.gif" name="picture"
style="position: absolute; top: 70px; left: 30px;" BORDER="0" WIDTH="140" HEIGHT="40">
<script LANGUAGE="JavaScript"><!--
setTimeout("moveLR('picture',300,1)",10);
//--></script>
 

 

※ 效果演示 ※
 

 
 
??片?片固定在?面左上角[根据?明修改即可共1步]

====1、?以下代?加入到HEML的<body></body>之?

<SCRIPT language=JavaScript>
<!-- Hide the script from old browsers --
// 1) 做一?88*31的LOGO。
if (document.images)
var staticlogo=new Image(88,31)
// 2) ?置LOGO的路?。
staticlogo.src="?片的名?1.gif"
// 3) 以下是LOGO代表的?接。
var logolink="http://www.happydrips.com"
// 4) ?置ALT?性。
var alttext="快??滴"
// 5) ?置下列?性? 1或者0(1是IE特有的,使LOGO??)
var fadeintoview=1
/* 6) 最后?置LOGO?示的??,例如12 秒,?值?0表示一直?示
*/
var visibleduration=12
/////////////////////////以下不要改?/////////////////////////
function regenerate(){
window.location.reload()
}
function regenerate2(){
if (document.layers)
setTimeout("window.onresize=regenerate",400)
}
var fadeset=''
if (fadeintoview)
fadeset="filter:alpha(opacity=0)"
if (document.all)
document.write('<span id="logo"" style="'+fadeset+';position:absolute;top:100;width:'+staticlogo.width+';height:'+staticlogo.height+'"></span>')
function bringintoview(){
if (logo.filters.alpha.opacity<=95)
logo.filters.alpha.opacity+=5
else{
clearInterval(viewit)
if (visibleduration!=0)
setTimeout("logo.style.visibility='hidden'",visibleduration*1000)
}
}
function createlogo(){
staticimage=new Layer(100)
staticimage.left=-300
staticimage.top=120
staticimage.document.write('<a href="'+logolink+'"><img src="'+staticlogo.src+'" border=0 alt="'+alttext+'"></a>')
staticimage.document.close()
staticimage.visibility="show"
regenerate2()
staticitns()
}
if (document.layers)
window.onload=createlogo;
if (document.all){
w=2
h=2
logo.style.left=w
logo.style.top=h
}
function logoit(){
var w2=document.body.scrollLeft+w
var h2=document.body.scrollTop+h
logo.style.left=w2
logo.style.top=h2
}
function logoit2(){
staticimage.left=pageXOffset+2
staticimage.top=pageYOffset+2
}
function insertimage(){
logo.innerHTML='<a href="'+logolink+'"><img src="'+staticlogo.src+'" border=0 alt="'+alttext+'"></a>'
if (fadeintoview)
viewit=setInterval("bringintoview()",100)
else{
if (visibleduration!=0)
setTimeout("logo.style.visibility='hidden'",visibleduration*1000)
}
}
if (document.all){
window.onscroll=logoit
window.onresize=new Function("window.location.reload()")
window.onload=insertimage
}
function staticitns(){
setInterval("logoit2()",90)
if (visibleduration!=0)
setTimeout("staticimage.visibility='hide'",visibleduration*1000)
}
//-->
</SCRIPT>
 

 

※ 效果演示 ※
 

  
?片的??播放[推荐][根据下面的?明?行共3步,修改?片的名?及路?即可]
第三步的top:120px;left:240px可以?定?示的位置

====1、?下面的代?插入到HEML的<head></head>之?:

<script language=javaScript>
<!--//
sandra0 = new Image();
sandra0.src = "image1.gif";
sandra1 = new Image();
sandra1.src = "image2.gif";
sandra2 = new Image();
sandra2.src = "image3.gif";
var i_strngth=1
var i_image=0
var imageurl = new Array()
imageurl[0] ="?片名?1.gif"
imageurl[1] ="?片名?2.gif"
imageurl[2] ="?片名?3.gif"
function showimage() {
if(document.all) {
if (i_strngth <=110) {
testimage.innerHTML="<img style='filter:alpha(opacity="+i_strngth+")' src="+imageurl[i_image]+" border=0>";
i_strngth=i_strngth+10
var timer=setTimeout("showimage()",100)
}
else {
clearTimeout(timer)
var timer=setTimeout("hideimage()",1000)
}
}
if(document.layers) {
clearTimeout(timer)
document.testimage.document.write("<img src="+imageurl[i_image]+" border=0>")
document.close()
i_image++
if (i_image >= imageurl.length) {i_image=0}
var timer=setTimeout("showimage()",2000)
}
}
function hideimage() {
if (i_strngth >=-10) {
testimage.innerHTML="<img style='filter:alpha(opacity="+i_strngth+")' src="+imageurl[i_image]+" border=0>";
i_strngth=i_strngth-10
var timer=setTimeout("hideimage()",100)
}
else {
clearTimeout(timer)
i_image++
if (i_image >= imageurl.length) {i_image=0}
i_strngth=1
var timer=setTimeout("showimage()",500)
}
}
//-->
</script>

====2、修改<body>?句?:

<body onLoad="showimage()">

====3、?下面的代?加入到HEML的<body></body>之?:

<div id="testimage" style="position:absolute;visibility:visible;top:120px;left:240px"></div>
 

 

※ 效果演示 ※
 

 
 
?片展示??[很棒的?片展示?本所有?片尺寸??一致才好]

====1、以下代?放在HTML的<body></body> ?即可:

<CENTER>
<img width=200 height=223 src="?片名字.jpg" name="x1">
</CENTER>
//以上是程序初始??示的?片。
<FORM>
<CENTER>
<SELECT onChange="document.x1.src=options[selectedIndex].value">
<option value="?片名字1.jpg">看看?片1</option>
<option value="?片名字2.jpg">看看?片2</option>
<option value="?片名字3.jpg">看看?片3</option>
<option value="?片名字4.jpg">看看?片4</option>
</SELECT>
</CENTER>
</FORM>
 

 

※ 效果演示 ※
 

 
 
不停??的?片[修改?示的?片及?接地址后根据?明?行共1步]

====1、以下代?放在一?新建?面的HTML的<body></body> ?即可:[?面上必?什么都?有]

<HTML>
<HEAD>
<TITLE>Blink image</TITLE>
</HEAD>
<BODY ONLOAD="soccerOnload()" topmargin="0">
<DIV ID="soccer" STYLE="position:absolute; left:150; top:0">
<a href="http://?片的?接.com" target="_blank">
<IMG SRC="要?示的?片.gif" border="0"></a>
</DIV>
<SCRIPT LANGUAGE="JavaScript">
var msecs = 500; //改???得到不同的???隔;
var counter = 0;
function soccerOnload() {
setTimeout("blink()", msecs);
}
function blink() {
soccer.style.visibility =
(soccer.style.visibility == "hidden") ? "visible" : "hidden";
counter +=1;
setTimeout("blink()", msecs);
}
</SCRIPT>
</BODY>
</HTML>
 

 

※ 效果演示 ※
 

 
 
???中的文字[修改?示的文字后复制到<body></body>]

<script language=JavaScript>
var MESSAGE="javascript源?大全"
var POSITION=100
var DELAY=5
var scroll=new statusMessageObject()
function statusMessageObject(p,d){
this.msg =MESSAGE
this.out =" "
this.pos =POSITION
this.delay=DELAY
this.i=0
this.reset=clearMessage}
function clearMessage(){
this.pos=POSITION}
function scroller(){
for (scroll.i=0;scroll.i<scroll.pos;scroll.i++){
scroll.out += " "}
if (scroll.pos >= 0)
scroll.out += scroll.msg
else scroll.out=scroll.msg.substring(-scroll.pos,scroll.msg.length)
window.status=scroll.out
scroll.out=" "
scroll.pos--
if (scroll.pos < -(scroll.msg.length)) {
scroll.reset()}
setTimeout('scroller()',scroll.delay)}
function snapIn(jumpSpaces,position){
var msg = scroll.msg
var out = ""
for(var i=0; i<position; i++)
{out+= msg.charAt(i)}
for(i=1;i<jumpSpaces;i++)
{out += " "}
out+=msg.charAt(position)
window.status = out
if(jumpSpaces <= 1) {
position++
if(msg.charAt(position) == ' ')
{position++ }
jumpSpaces = 100-position
}else if (jumpSpaces > 3)
{jumpSpaces *= .75}
else
{jumpSpaces--}
if(position != msg.length) {
var cmd = "snapIn(" + jumpSpaces + "," + position + ")";
scrollID = window.setTimeout(cmd,scroll.delay);
}else{window.status=""
jumpSpaces=0
position=0
cmd = "snapIn(" + jumpSpaces + "," + position + ")";
scrollID = window.setTimeout(cmd,scroll.delay);
return false }
return true}
snapIn(100,0);
</script>
 

 

※ 效果演示 ※
 

 
 
??文字的特殊效果[适用于IE4++]
(根据下面的?明?行共3步)

====1、?以下代?加入HEML的<head></head>之?:

<style>
<!--
#glowtext{
filter:glow(color=red,strength=2);
width:100%;
}
-->
</style>
<script language="JavaScript1.2">
function glowit(which){
if (document.all.glowtext[which].filters[0].strength==2)
document.all.glowtext[which].filters[0].strength=1
else
document.all.glowtext[which].filters[0].strength=2
}
function glowit2(which){
if (document.all.glowtext.filters[0].strength==2)
document.all.glowtext.filters[0].strength=1
else
document.all.glowtext.filters[0].strength=2
}
function startglowing(){
if (document.all.glowtext&&glowtext.length){
for (i=0;i<glowtext.length;i++)
eval('setInterval("glowit('+i+')",150)')
}
else if (glowtext)
setInterval("glowit2(0)",150)
}
if (document.all)
window.onload=startglowing
</script>

====2、?以下代?加入到HEML的<body></body>之?[适?的位置]:

<span id="glowtext">?里是要?示的文字</span>

====3、[可??]改?文字?色和背景色可以得到不同的效果。文字?色修改,只要修改filter:glow(color=red,strength=2); 中的color?,strength??色的深度值 。
 

 

※ 效果演示 ※
 

 
 
淡入淡出的文字效果[根据下面的?明?行共3步]

====1、以下代?放在HTML的<head></head>之?:

<script language="javaScript">
<!--
function checkBrowserForVersion4(){
var x=navigator.appVersion;
y=x.substring(0,4);
if(y>=4) Effect();}
var isNav=(navigator.appName.indexOf("Netscape")!=-1);
var colors=new Array
("FFFFFF","FFFFFF","FFFFFF","FFFFFF","FFFFFF","FFFFFF","FFFFFF","F9F9F9","F1F1F1","E9E9E9","E1E1E1","D9D9D9","D1D1D1","C9C9C9","C1C1C1","B9B9B9","B1B1B1","A9A9A9","A1A1A1","999999","919191","898989","818181","797979","717171","696969","616161","595959","515151","494949","414141","393939","313131","292929","212121","191919","111111","090909","000000")
a=0,b=1
function Effect(){
color=colors[a];
//*改改下面的文字?容即可,可使用HTML?法,但是注意引?不要混用。?引??是?引?。*//
aa="<font size='5'><font face='Arial, Helvetica, sans-serif'><font color="+color+">Save page and Get Code !<p>Enjoy All These Free Javascripts ......</font></font></font>"
if(isNav) {document.object1.document.write(aa);document.object1.document.close();}
else object1.innerHTML=aa
a+=b;if (a==38) b-=2;if (a==0) b+=2;xx=setTimeout("Effect()",10);}
//-->
</script>

====2、以下代?放在HTML的<body></body>之?[适?的位置]:
<body onload="checkBrowserForVersion4()" >
<div id="object1" style="position:absolute; visibility:show; left:181px; top:113px; z-index:2"></div>

====3、特??明:只要改?上面的TOP值和LEFT值即可确定文字?示的??位置。TOP表示文字距离屏幕?部的距离(象素),LEFT是离屏幕左?的距离。上面有一大堆?七八糟的字符是确定??的?色??。