论坛特效代码收集(落伍转发-不错)


Posted in Javascript onDecember 02, 2006

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>

无边框窗口代码
//第一步:把如下代码加入<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〉

Javascript 相关文章推荐
js控制frameSet示例
Sep 10 Javascript
JavaScript中的函数重载深入理解
Aug 04 Javascript
$(&quot;&quot;).click与onclick的区别示例介绍
Sep 25 Javascript
JS版元素周期表实现方法
Aug 05 Javascript
基于Jquery和CSS3制作数字时钟附源码下载(CSS3篇)
Nov 24 Javascript
解决JavaScript数字精度丢失问题的方法
Dec 03 Javascript
JS组件Bootstrap实现弹出框和提示框效果代码
Dec 08 Javascript
JavaScript过滤字符串中的中文与空格方法汇总
Mar 07 Javascript
AjaxUpLoad.js实现文件上传
Mar 05 Javascript
微信小程序实现banner图轮播效果
Jun 28 Javascript
vue使用keep-alive保持滚动条位置的实现方法
Apr 09 Javascript
微信小程序返回上一页传参并刷新过程解析
Dec 13 Javascript
线路分流自动跳转代码;希望对大家有用!
Dec 02 #Javascript
phpwind放自动注册方法
Dec 02 #Javascript
一段好玩的JavaScript代码
Dec 01 #Javascript
[原创]网络复制内容时常用的正则+editplus
Nov 30 #Javascript
JavaScript中令你抓狂的魔术变量
Nov 30 #Javascript
小议Function.apply()之二------利用Apply的参数数组化来提高 JavaScript程序性能
Nov 30 #Javascript
小议Function.apply() 之一------(函数的劫持与对象的复制)
Nov 30 #Javascript
You might like
PHP 反向排序和随机排序代码
2010/06/30 PHP
PHP数字字符串左侧补0、字符串填充和自动补齐的几种方法
2014/05/10 PHP
php上传中文文件名乱码问题处理方案
2015/02/03 PHP
php使用SAE原生Mail类实现各种类型邮件发送的方法
2016/10/10 PHP
如何修改yii2.0自带的user表为其它的表
2017/08/01 PHP
php读取本地json文件的实例
2018/03/07 PHP
JS 巧妙获取剪贴板数据 Excel数据的粘贴
2009/07/09 Javascript
jQuery往返城市和日期查询实例讲解
2015/10/09 Javascript
JavaScript获取各大浏览器信息图示
2015/11/20 Javascript
学习使用bootstrap3栅格系统
2016/04/12 Javascript
JavaScript 冒泡排序和选择排序的实现代码
2016/09/03 Javascript
JavaScript仿支付宝6位数字密码输入框
2016/12/29 Javascript
Bootstarp基本模版学习教程
2017/02/01 Javascript
ReactNative实现图片上传功能的示例代码
2017/07/11 Javascript
jQuery remove()过滤被删除的元素(推荐)
2017/07/18 jQuery
javascript数组拍平方法总结
2018/01/20 Javascript
微信小程序自定义底部弹出框
2020/11/16 Javascript
解决 viewer.js 动态更新图片导致无法预览的问题
2019/05/14 Javascript
vue自定义正在加载动画的例子
2019/11/14 Javascript
JavaScript ECMA-262-3 深入解析(一):执行上下文实例分析
2020/04/25 Javascript
[42:25]2018DOTA2亚洲邀请赛 4.5 淘汰赛 LGD vs Liquid 第三场
2018/04/06 DOTA
Python获取当前时间的方法
2014/01/14 Python
Python在图片中添加文字的两种方法
2017/04/29 Python
对python append 与浅拷贝的实例讲解
2018/05/04 Python
利用nohup来开启python文件的方法
2019/01/14 Python
使用已经得到的keras模型识别自己手写的数字方式
2020/06/29 Python
利用纯CSS3实现动态的自行车特效源码
2017/01/20 HTML / CSS
毕业自我鉴定
2013/11/05 职场文书
医学专业毕业生个人的求职信
2013/12/04 职场文书
办公室前台岗位职责
2014/01/04 职场文书
大学活动策划书范文
2014/01/10 职场文书
高中美术教师事迹材料
2014/08/22 职场文书
亲属关系公证书样本
2015/01/23 职场文书
2015年医院药剂科工作总结
2015/05/04 职场文书
css3实现背景图片半透明内容不透明的方法示例
2021/04/13 HTML / CSS
python实现A*寻路算法
2021/06/13 Python