落伍者站长论坛's Archiver

野汉子 发表于 2004-3-17 16:48

落伍者论坛特效代码收集……_ by 野汉子 〔更新无止境〕

[size=5][color=Blue]希望大家有好的也推荐[/color][/size]
;)

[color=Red]滚动条 [/color]
[code] 1.overflow内容溢出时的设置(设定被设定对象是否显示滚动条)
overflow-x水平方向内容溢出时的设置
overflow-y垂直方向内容溢出时的设置
以上三个属性设置的值为visible(默认值)、scroll、hidden、auto。

2.scrollbar-3d-light-color立体滚动条亮边的颜色(设置滚动条的颜色)
scrollbar-arrow-color上下按钮上三角箭头的颜色
scrollbar-base-color滚动条的基本颜色
scrollbar-dark-shadow-color立体滚动条强阴影的颜色
scrollbar-face-color立体滚动条凸出部分的颜色
scrollbar-highlight-color滚动条空白部分的颜色
scrollbar-shadow-color立体滚动条阴影的颜色

我们通过几个实例来讲解上述的样式属性:
1.让浏览器窗口永远都不出现滚动条
没有水平滚动条
<body style="overflow-x:hidden">
没有垂直滚动条
<body style="overflow-y:hidden">
没有滚动条
<body style="overflow-x:hidden;overflow-y:hidden">或<body
style="overflow:hidden">

2.设定多行文本框的滚动条

没有水平滚动条
<textarea style="overflow-x:hidden"></textarea>

没有垂直滚动条
<textarea style="overflow-y:hidden"></textarea>

没有滚动条
<textarea style="overflow-x:hidden;overflow-y:hidden"></textarea>
或<textarea style="overflow:hidden"></textarea>

3.设定窗口滚动条的颜色
设置窗口滚动条的颜色为红色<body style="scrollbar-base-color:red">
scrollbar-base-color设定的是基本色,一般情况下只需要设置这一个属性就可以达到改变滚动条颜色的目的。
加上一点特别的效果:
<body style="scrollbar-arrow-color:yellow;scrollbar-base-color:lightsalmon">

4.在样式表文件中定义好一个类,调用样式表。
<style>
.coolscrollbar{scrollbar-arrow-color:yellow;scrollbar-base-color:lightsalmon;}
</style>
这样调用:
<textarea class="coolscrollbar"></textarea>
[/code]
[color=red]无边框窗口代码[/color]
制作无边框页面的代码

[code]//第一步:把如下代码加入<head></head>区域中
<script language=javascript>
minimizebar="minimize.gif"; //视窗右上角最小化「按钮」的图片
minimizebar2="minimize2.gif"; //滑鼠悬停时最小化「按钮」的图片
closebar="close.gif"; //视窗右上角关闭「按钮」的图片
closebar2="close2.gif"; //滑鼠悬停时关闭「按钮」的图片
icon="icon.gif"; //视窗左上角的小图标

function noBorderWin(fileName,w,h,titleBg,moveBg,titleColor,titleWord,scr) //定义一个弹出无边视窗的函数,能数意义见下面「参数说明」,实际使用见最後的实例。
/*
------------------参数说明-------------------
fileName :无边视窗中显示的文件。
w     :视窗的宽度。
h     :视窗的高度。
titleBg :视窗「标题栏」的背景色以及视窗边框颜色。
moveBg :视窗拖动时「标题栏」的背景色以及视窗边框颜色。
titleColor :视窗「标题栏」文字的颜色。
titleWord :视窗「标题栏」的文字。
scr :是否出现卷轴。取值yes/no或者1/0。
--------------------------------------------
*/
{
var contents="<html>"+
"<head>"+
"<title>"+titleWord+"</title>"+
"<META http-equiv=\"Content-Type\" content=\"text/html; charset=gb2312\">"+
"<object id=hhctrl type='application/x-oleobject' classid='clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11'><param name='Command' value='minimize'></object>"+
"</head>"+
"<body topmargin=0 leftmargin=0 scroll=no onselectstart='return false' ondragstart='return false'>"+
" <table height=100% width=100% cellpadding=0 cellspacing=1 bgcolor="+titleBg+" id=mainTab>"+
" <tr height=18 style=cursor:default; onmousedown='x=event.x;y=event.y;setCapture();mainTab.bgColor=\""+moveBg+"\";' onmouseup='releaseCapture();mainTab.bgColor=\""+titleBg+"\";' onmousemove='if(event.button==1)self.moveTo(screenLeft+event.x-x,screenTop+event.y-y);'>"+
" <td width=18 align=center><img height=12 width=12 border=0 src="+icon+"></td>"+
" <td width="+w+"><span style=font-size:12px;color:"+titleColor+";font-family:宋体;position:relative;top:1px;>"+titleWord+"</span></td>"+
" <td width=14><img border=0 width=12 height=12 alt=最小化 src="+minimizebar+" onmousedown=hhctrl.Click(); onmouseover=this.src='"+minimizebar2+"' onmouseout=this.src='"+minimizebar+"'></td>"+
" <td width=13><img border=0 width=12 height=12 alt=关闭 src="+closebar+" onmousedown=self.close(); onmouseover=this.src='"+closebar2+"' onmouseout=this.src='"+closebar+"'></td>"+
" </tr>"+
" <tr height=*>"+
" <td colspan=4>"+
" <iframe name=nbw_v6_iframe src="+fileName+" scrolling="+scr+" width=100% height=100% frameborder=0></iframe>"+
" </td>"+
" </tr>"+
" </table>"+
"</body>"+
"</html>";
pop=window.open("","_blank","fullscreen=yes");
pop.resizeTo(w,h);
pop.moveTo((screen.width-w)/2,(screen.height-h)/2);
pop.document.writeln(contents);
if(pop.document.body.clientWidth!=w||pop.document.body.clientHeight!=h) //如果无边视窗不是出现在纯粹的IE视窗中
{
temp=window.open("","nbw_v6");
temp.close();
window.showModalDialog("about:<"+"script language=javascript>window.open('','nbw_v6','fullscreen=yes');window.close();"+"</"+"script>","","dialogWidth:0px;dialogHeight:0px");
pop2=window.open("","nbw_v6");
pop2.resizeTo(w,h);
pop2.moveTo((screen.width-w)/2,(screen.height-h)/2);
pop2.document.writeln(contents);
pop.close();
}
}
</script>
//第二步:把如下代码加入<body></body>区域中
<a href=#none onclick=noBorderWin('rate.htm','400','240','#000000','#333333','#CCCCCC','一个无边视窗的测试例子','yes');>open〈/a〉[/code]

[color=Red]让新窗口总在一个窗口弹出[/color]
新开一个的窗口(name=screen)
再在这个窗口内打开链接(target=screen)

[color=Red]网页内容顶格[/color]
[code]<BODY leftMargin=0 topMargin=0 marginwidth="0" marginheight="0" >[/code]

[[i] Last edited by 野汉子 on 2004-7-7 at 09:22 [/i]]

[[i] 本帖最后由 野汉子 于 2005-11-25 00:08 编辑 [/i]]

野汉子 发表于 2004-3-17 16:54

横向不间断滚动广告

[code]<script language="JavaScript">
imgArr=new Array()
imgArr[0]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://image0.sina.com.cn/images/bizsite/promote/l/lisababy6617.gif border=0></a>"
imgArr[1]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://image0.sina.com.cn/images/bizsite/promote/t/testool4434.gif border=0></a>"
imgArr[2]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://image0.sina.com.cn/images/bizsite/promote/s/sxyuda6549.gif border=0></a>"
imgArr[3]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://image0.sina.com.cn/images/bizsite/promote/q/qeji4041.gif border=0></a>"
imgArr[4]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://image0.sina.com.cn/images/bizsite/promote/i/ieasytraining3984.gif border=0></a>"
imgArr[5]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://image0.sina.com.cn/images/bizsite/promote/t/trainings1442.gif border=0></a>"
imgArr[6]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://image0.sina.com.cn/images/bizsite/promote/r/renhebj002indexasp2486.gif border=0></a>"
imgArr[7]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://image0.sina.com.cn/images/bizsite/promote/e/efeedlink6085.gif border=0></a>"
imgArr[8]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://image0.sina.com.cn/images/bizsite/promote/k/kaixingou5811.gif border=0></a>"
imgArr[9]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://image0.sina.com.cn/images/bizsite/promote/h/9happyindex8htm5912.gif border=0></a>"
imgArr[10]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://image0.sina.com.cn/images/bizsite/promote/c/chinaroom6034.gif border=0></a>"
var moveStep=4        //步长,单位:pixel
var moveRelax=100    //移动时间间隔,单位:ms

ns4=(document.layers)?true:false

var displayImgAmount=4    //视区窗口可显示个数
var divWidth=125    //每块图片占位宽
var divHeight=60    //每块图片占位高

var startDnum=0
var nextDnum=startDnum+displayImgAmount
var timeID
var outHover=false

var startDivClipLeft
var nextDivClipRight

function initDivPlace(){
    if (ns4){
        for (i=0;i<displayImgAmount;i++){
            eval("document.divOuter.document.divAds"+i+".left="+divWidth*i)
        }
        for (i=displayImgAmount;i<imgArr.length;i++){
            eval("document.divOuter.document.divAds"+i+".left="+divWidth*displayImgAmount)
        }
    }else{
        for (i=0;i<displayImgAmount;i++){
            eval("document.all.divAds"+i+".style.left="+divWidth*i)
        }
        for (i=displayImgAmount;i<imgArr.length;i++){
            eval("document.all.divAds"+i+".style.left="+divWidth*displayImgAmount)
        }
    }
}

function mvStart(){
    timeID=setTimeout(moveLeftDiv,moveRelax)
}

function mvStop(){
    clearTimeout(timeID)
}

function moveLeftDiv(){
    if (ns4){
        for (i=0;i<=displayImgAmount;i++){
            eval("document.divOuter.document.divAds"+parseInt((startDnum+i)%imgArr.length)+".left=document.divOuter.document.divAds"+parseInt((startDnum+i)%imgArr.length)+".left-moveStep")
        }

        startDivClipLeft=parseInt(eval("document.divOuter.document.divAds"+startDnum+".clip.left"))
        nextDivClipRight=parseInt(eval("document.divOuter.document.divAds"+nextDnum+".clip.right"))

        if (startDivClipLeft+moveStep>divWidth){
            eval("document.divOuter.document.divAds"+nextDnum+".clip.right="+divWidth)
            
            eval("document.divOuter.document.divAds"+startDnum+".left="+divWidth*displayImgAmount)
            eval("document.divOuter.document.divAds"+parseInt((nextDnum+1)%imgArr.length)+".left=document.divOuter.document.divAds"+nextDnum+".left+"+divWidth)
            eval("document.divOuter.document.divAds"+parseInt((nextDnum+1)%imgArr.length)+".clip.left=0")
            
            
            startDnum=(++startDnum)%imgArr.length
            nextDnum=(startDnum+displayImgAmount)%imgArr.length
            
            startDivClipLeft=moveStep-(divWidth-startDivClipLeft)
            nextDivClipRight=moveStep-(divWidth-nextDivClipRight)
        }else{
            eval("document.divOuter.document.divAds"+nextDnum+".clip.left=0")
            startDivClipLeft+=moveStep
            nextDivClipRight+=moveStep
        }
        eval("document.divOuter.document.divAds"+startDnum+".clip.left="+startDivClipLeft)
        eval("document.divOuter.document.divAds"+nextDnum+".clip.right="+nextDivClipRight)
    }else{
        for (i=0;i<=displayImgAmount;i++){
            eval("document.all.divAds"+parseInt((startDnum+i)%imgArr.length)+".style.left=document.all.divAds"+parseInt((startDnum+i)%imgArr.length)+".style.pixelLeft-moveStep")
        }
   
        startDivClipLeft=parseInt(eval("document.all.divAds"+startDnum+".currentStyle.clipLeft"))
        nextDivClipRight=parseInt(eval("document.all.divAds"+nextDnum+".currentStyle.clipRight"))
   
        if (startDivClipLeft+moveStep>divWidth){
            eval("document.all.divAds"+nextDnum+".style.clip='rect(0,"+divWidth+","+divHeight+",0"+")'")
            
            eval("document.all.divAds"+startDnum+".style.left="+divWidth*displayImgAmount)
            eval("document.all.divAds"+parseInt((nextDnum+1)%imgArr.length)+".style.left=document.all.divAds"+nextDnum+".style.pixelLeft+"+divWidth)
            
            startDnum=(++startDnum)%imgArr.length
            nextDnum=(startDnum+displayImgAmount)%imgArr.length
            
            startDivClipLeft=moveStep-(divWidth-startDivClipLeft)
            nextDivClipRight=moveStep-(divWidth-nextDivClipRight)
        }else{
            startDivClipLeft+=moveStep
            nextDivClipRight+=moveStep
        }
        eval("document.all.divAds"+startDnum+".style.clip='rect(0,"+divWidth+","+divHeight+","+startDivClipLeft+")'")
        eval("document.all.divAds"+nextDnum+".style.clip='rect(0,"+nextDivClipRight+","+divHeight+",0)'")
    }

    if (outHover){
        mvStop()
    }else{
        mvStart()
    }
   
   
}

function writeDivs(){
    if (ns4){
        document.write("<ilayer name=divOuter width=750 height="+divHeight+">")
        
        for (i=0;i<imgArr.length;i++){
            document.write("<layer name=divAds"+i+">")
            document.write(imgArr[i]+" ")
            document.write("</layer>")
        }
        document.write("</ilayer>")
        document.close()
        for (i=displayImgAmount;i<imgArr.length;i++){
            eval("document.divOuter.document.divAds"+i+".clip.right=0")
        }
    }else{
        document.write("<div id=divOuter style='position:relative' width=750 height="+divHeight+">")
        
        for (i=0;i<imgArr.length;i++){
            document.write("<div id=divAds"+i+" style='position:absolute;clip:rect(0,"+divWidth+","+divHeight+",0)'>")
            document.write(imgArr[i]+" ")
            document.write("</div>")
        }
        document.write("</div>")
        for (i=displayImgAmount;i<imgArr.length;i++){
            eval("document.all.divAds"+i+".style.clip='rect(0,0,"+divHeight+",0)'")
        }
    }
}
</script>
<BODY onload=javascript:mvStart()>
<SCRIPT language=JavaScript>writeDivs();initDivPlace();</SCRIPT>[/code]

野汉子 发表于 2004-3-19 09:48

电击图片弹出无边自定义窗口

[code]<a href="#"><img src="image/tx.gif" alt="更换头像" width="16" height="16" hspace=10 border=0  onClick="MM_openBrWindow('tx.htm','tx','status=yes,scrollbars=yes,width=280,height=45')"></a>[/code]

xtyzboy 发表于 2004-3-19 09:50

不错不错,请你做我版主怎样

野汉子 发表于 2004-3-19 10:49

无边框对话框窗口可以在myie中弹出

[code]
<script Language="JavaScript">
function 页面名称(WINwidth, WINheight) {
        showx = event.screenX - event.offsetX - 4 - WINwidth ; // + deltaX;
        showy = event.screenY - event.offsetY + 18; // + deltaY;

        newWINwidth = WINwidth + 4 + 18;
        var features =
                'dialogWidth:'  + newWINwidth  + 'px;' +
                'dialogHeight:' + WINheight + 'px;' +
                'dialogLeft:'   + showx     + 'px;' +
                'dialogTop:'    + showy     + 'px;' +
                'directories:no; localtion:no; menubar:no; status=no; toolbar=no;scrollbars:no;Resizeable=no';

        var endtarget = "弹出页面.htm";

//        window.open(endtarget, '', '');
        window.showModalDialog(endtarget, " ", features);
}
</script>[/code]


[code]<input name="image" type=image onClick="页面名称(230, 35);return false;" src="代替按扭的图片.gif" alt="鼠标经过显示的文字" width="16" height="16" >[/code]

[[i] Last edited by 野汉子 on 2004-3-19 at 10:50 AM [/i]]

含烟 发表于 2004-3-19 10:53

谢谢,收藏先

野汉子 发表于 2004-3-19 11:19

Java代码容错

[code]<SCRIPT LANGUAGE="JavaScript">
<!-- Hide

function killErrors() {
return true;
}

window.onerror = killErrors;

// -->
</SCRIPT>[/code]

loguin 发表于 2004-3-19 11:21

不错,这些我也经常到网上找,以后直接找这个帖子了!

keep369 发表于 2004-3-19 11:45

谢谢!瘦长

野汉子 发表于 2004-3-23 09:07

flash透明

[code]<PARAM NAME="wmode" VALUE="transparent"> [/code]

Pizza 发表于 2004-3-23 09:12

好~收藏

心宇 发表于 2004-3-23 09:13

*** 作者被禁止或删除 内容自动屏蔽 ***

justray 发表于 2004-3-23 09:14

有[b][color=Red]状态栏[/color][/b]的特效吗??

军军 发表于 2004-3-23 09:23

好~收藏

黑夜鸟 发表于 2004-3-23 09:24

[quote]Originally posted by [i]Pizza[/i] at 2004-3-23 09:12 AM:
好~收藏 [/quote]

野汉子 发表于 2004-3-23 11:09

状态栏 +在body中就ok

[quote]Originally posted by [i]justray[/i] at 2004-3-23 09:14 AM:
有[b][color=Red]状态栏[/color][/b]的特效吗?? [/quote]
[color=Red]<script language="JavaScript">
   var MESSAGE  =   "  欢迎来到落伍者论坛谢谢!    "
   var POSITION = 150
   var DELAY    = 10
   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>[/color]

谁知道 发表于 2004-3-23 11:23

[quote]Originally posted by [i]心宇[/i] at 2004-3-23 09:13 AM:
不错
日一下 [/quote]:o:o哇
同志来拉

逃跑

野汉子 发表于 2004-3-23 11:51

同页面的超级连接不同颜色

[code]<html>
<head>
<style>
a.a1:link {
    font-size: 9pt;
    color: #000000;
    text-decoration: none;
}
a.a1:visited {
    font-size: 9pt;
    color: #999999;
    text-decoration: none;
}
a.a1:hover {
    font-size: 9pt;
    color: #FF6600;
    position: relative;
    top: 1px;

}
a.a1:active {
    font-size: 9pt;
    color: #333333;
    text-decoration: none;
}
a.a2:link {
    font-size: 9pt;
    color: #00ff00;
    }
a.a2:hover {
    font-size: 10pt;
    color: #FF3300;
    position: relative;
    top: 5px;

}
a.a2:active {
    font-size: 9pt;
    color: #fffff;
    text-decoration: none;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>

<body>
<center>
<br>
<br>
<br>
<br>
<a href="" class="a1">123456</a>
<a href="" class="a2">000000</a>
</center>
</body>
</html>[/code]

我来看看 发表于 2004-3-23 11:51

好,我来 吭吃C 一下

絕望的生魚片 发表于 2004-3-23 11:55

日一下~~好东西1

页: [1] 2 3 4 5 6 7 8 9 10

Powered by Discuz! Archiver 6.1.0  © 2001-2007 Comsenz Inc.