滚动条例子
❶ 如何获得浏览器滚动条变化事件
在做js返回顶部的效果时，要监听网页滚动条滚动事件，这个事件就是：window.onscroll。当onscroll事件发生时，用js获得页面的scrollTop值，判断scrollTop为一个设定值时，显示“返回面部”
js网页滚动条滚动事件
<style type="text/css">
#top_div{
position:fixed;
bottom:80px;
right:0;
display:none;
}
</style>
<script type="text/javascript">
window.onscroll = function(){
var t = document.documentElement.scrollTop || document.body.scrollTop;
var top_div = document.getElementById( "top_div" );
if( t >= 300 ) {
top_div.style.display = "inline";
} else {
top_div.style.display = "none";
}
}
</script>
<a name="top">顶部<a>
<div id="top_div"><a href="#top">返回顶部</a></div>
<br />
<br />
<div>
这里尽量多些<br />以便页面出现滚动条，限于篇幅本文此处略去
</div>
例子语法解释
在 style 标签中首先定义 top_div css 属性：position:fixed;display:none; 是关键
javascript 语句中，t 得到滚动条向下滚动的位置，|| 是为了更好兼容性考虑
当滚动超过 300 （像素）时，将 top_div css
display 属性设置为显示(inline)，反之则隐藏(none)
必须设定 DOCTYPE 类型，在 IE 中才能利用 document.documentElement 来取得窗口的宽度及高度
❷ 谁有c#滚动条的例程
VScrollBar的Scroll事件处理函数
private void vScrollBar1_Scroll(object sender, System.Windows.Forms.ScrollEventArgs e)
ScrollEventArgs.ThumbTrack处理滚动条正在被移动的消息。
如何区分是在向上滚动还是向下滚动？？
在c#中控制滚动条
// First import the SendMessage function from user32.dll:
[DllImport("user32.dll", EntryPoint = "SendMessageA")]
internal static extern int SendMessage(int hwnd, int wMsg, int wParam, int lParam);
// Then add this constants to your codes
private const int WM_VSCROLL = 0x115;
private const int WM_HSCROLL = 0x114;
private const int SB_LINEDOWN = 1;
private const int SB_LINEUP = 0;
private const int SB_TOP = 6;
private const int SB_BOTTOM = 7;
private const int SB_PAGEUP = 2;
private const int SB_PAGEDOWN = 3;
then:
SendMessage(rbox.Handle.ToInt32(), WM_VSCROLL, SB_LINEUP, 0);
❸ 如何获取网页滚动条滚动事件
1、首先新建一个html文件，在文件内引入script标签备用：
❹ HTML 滚动条背景可以加图片吗 举个例子谢谢
可以的
页面代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<!--<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>-->
</head>
<style>
.box {
height: 150px;
width: 300px;
overflow: auto;
}
.box p {
height: 300px;
}
.box::-webkit-scrollbar {
width: 10px;
height: 1px;
}
.box::-webkit-scrollbar-thumb {
border-radius: 5px;
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
background: url(img/banner01.jpg);
}
.box::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
border-radius: 5px;
background: url(img/123.jpg);
}
.box .srcoll::-webkit-scrollbar {
width: 10px;
height: 1px;
}
.box .srcoll::-webkit-scrollbar-thumb {
border-radius: 5px;
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
background: #ccc;
}
.box .srcoll::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
border-radius: 5px;
background: #EDEDED;
}
/*滚动条样式 end*/
</style>
<body>
<div class="box">
<p>11111</p>
</div>
</body>
</html>
//记得改一下css的图片路径
❺ 如何实现jquery滚动条间隔滚动 文字间隔向上滚动效果示例
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>checkbox</title>
<script src="js/jquery-1.3.2.js" type="text/javascript"></script>
<script src="js/1.js" type="text/javascript"></script>
</head>
<body>
<table id="table1">
<tr>
<td><input type="checkbox" value="1"/>1</td>
<td id="k_1"><input type="text" name="student" id="s_1" readonly="true"/></td>
</tr>
<tr>
<td><input type="checkbox" value="2"/>2</td>
<td id="k_2"><input type="text" name="student" id="s_2" readonly="true"/></td>
</tr>
<tr>
<td><input type="checkbox" value="3"/>3</td>
<td id="k_3"><input type="text" name="student" id="s_3" readonly="true"/></td>
</tr>
<tr>
<td><input type="checkbox" value="4"/>4</td>
<td id="k_4"><input type="text" name="student" id="s_4" readonly="true"/></td>
</tr>
</table>
</body>
</html>
-------------------------------------------------------------
$(document).ready(function() {
$("td[id^='k_']").hide();
var check = $(":checkbox"); //得到所有被选中的checkbox
var actor_config; //定义变量
check.each(function(i){
actor_config = $(this);
actor_config.click(
function(){
if($(this).attr("checked")==true){
$("#k_"+$(this).val()).show();
}else{
$("#k_"+$(this).val()).hide();
}
}
);
});
});
❻ 怎么用js为div做滚动条实例
<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js滚动条特效</title>
<style type="text/css">
*{ margin:0; padding:0;}
p{ height:1000px;}
#mainBox{ width:400px; height:500px; border:1px #bbb solid; position:relative; overflow:hidden; margin:50px auto;}
#content{ height:2500px; position:absolute; left:0; top:0; background:url(/jscss/demoimg/logo_demo1.gif) }
.scrollDiv{ width:18px; position:absolute; top:0; background:#666; border-radius:10px;}
</style>
</head>
<body>
<div id="mainBox">
<div id="content"></div>
</div>
<p></p>
<script type="text/javascript">
var doc=document;
var _wheelData=-1;
var mainBox=doc.getElementById('mainBox');
function bind(obj,type,handler){
var node=typeof obj=="string"?$(obj):obj;
if(node.addEventListener){
node.addEventListener(type,handler,false);
}else if(node.attachEvent){
node.attachEvent('on'+type,handler);
}else{
node['on'+type]=handler;
}
}
function mouseWheel(obj,handler){
var node=typeof obj=="string"?$(obj):obj;
bind(node,'mousewheel',function(event){
var data=-getWheelData(event);
handler(data);
if(document.all){
window.event.returnValue=false;
}else{
event.preventDefault();
}
});
//火狐
bind(node,'DOMMouseScroll',function(event){
var data=getWheelData(event);
handler(data);
event.preventDefault();
});
function getWheelData(event){
var e=event||window.event;
return e.wheelDelta?e.wheelDelta:e.detail*40;
}
}
function addScroll(){
this.init.apply(this,arguments);
}
addScroll.prototype={
init:function(mainBox,contentBox,className){
var mainBox=doc.getElementById(mainBox);
var contentBox=doc.getElementById(contentBox);
var scrollDiv=this._createScroll(mainBox,className);
this._resizeScorll(scrollDiv,mainBox,contentBox);
this._tragScroll(scrollDiv,mainBox,contentBox);
this._wheelChange(scrollDiv,mainBox,contentBox);
this._clickScroll(scrollDiv,mainBox,contentBox);
},
//创建滚动条
_createScroll:function(mainBox,className){
var _scrollBox=doc.createElement('div')
var _scroll=doc.createElement('div');
var span=doc.createElement('span');
_scrollBox.appendChild(_scroll);
_scroll.appendChild(span);
_scroll.className=className;
mainBox.appendChild(_scrollBox);
return _scroll;
},
//调整滚动条
_resizeScorll:function(element,mainBox,contentBox){
var p=element.parentNode;
var conHeight=contentBox.offsetHeight;
var _width=mainBox.clientWidth;
var _height=mainBox.clientHeight;
var _scrollWidth=element.offsetWidth;
var _left=_width-_scrollWidth;
p.style.width=_scrollWidth+"px";
p.style.height=_height+"px";
p.style.left=_left+"px";
p.style.position="absolute";
p.style.background="#ccc";
contentBox.style.width=(mainBox.offsetWidth-_scrollWidth)+"px";
var _scrollHeight=parseInt(_height*(_height/conHeight));
if(_scrollHeight>=mainBox.clientHeight){
element.parentNode.style.display="none";
}
element.style.height=_scrollHeight+"px";
},
//拖动滚动条
_tragScroll:function(element,mainBox,contentBox){
var mainHeight=mainBox.clientHeight;
element.onmousedown=function(event){
var _this=this;
var _scrollTop=element.offsetTop;
var e=event||window.event;
var top=e.clientY;
//this.onmousemove=scrollGo;
document.onmousemove=scrollGo;
document.onmouseup=function(event){
this.onmousemove=null;
}
function scrollGo(event){
var e=event||window.event;
var _top=e.clientY;
var _t=_top-top+_scrollTop;
if(_t>(mainHeight-element.offsetHeight)){
_t=mainHeight-element.offsetHeight;
}
if(_t<=0){
_t=0;
}
element.style.top=_t+"px";
contentBox.style.top=-_t*(contentBox.offsetHeight/mainBox.offsetHeight)+"px";
_wheelData=_t;
}
}
element.onmouseover=function(){
this.style.background="#444";
}
element.onmouseout=function(){
this.style.background="#666";
}
},
//鼠标滚轮滚动，滚动条滚动
_wheelChange:function(element,mainBox,contentBox){
var node=typeof mainBox=="string"?$(mainBox):mainBox;
var flag=0,rate=0,wheelFlag=0;
if(node){
mouseWheel(node,function(data){
wheelFlag+=data;
if(_wheelData>=0){
flag=_wheelData;
element.style.top=flag+"px";
wheelFlag=_wheelData*12;
_wheelData=-1;
}else{
flag=wheelFlag/12;
}
if(flag<=0){
flag=0;
wheelFlag=0;
}
if(flag>=(mainBox.offsetHeight-element.offsetHeight)){
flag=(mainBox.clientHeight-element.offsetHeight);
wheelFlag=(mainBox.clientHeight-element.offsetHeight)*12;
}
element.style.top=flag+"px";
contentBox.style.top=-flag*(contentBox.offsetHeight/mainBox.offsetHeight)+"px";
});
}
},
_clickScroll:function(element,mainBox,contentBox){
var p=element.parentNode;
p.onclick=function(event){
var e=event||window.event;
var t=e.target||e.srcElement;
var sTop=document.documentElement.scrollTop>0?document.documentElement.scrollTop:document.body.scrollTop;
var top=mainBox.offsetTop;
var _top=e.clientY+sTop-top-element.offsetHeight/2;
if(_top<=0){
_top=0;
}
if(_top>=(mainBox.clientHeight-element.offsetHeight)){
_top=mainBox.clientHeight-element.offsetHeight;
}
if(t!=element){
element.style.top=_top+"px";
contentBox.style.top=-_top*(contentBox.offsetHeight/mainBox.offsetHeight)+"px";
_wheelData=_top;
}
}
}
}
new addScroll('mainBox','content','scrollDiv');
</script>
</body>
</html>
❼ VB题目 滚动条控件的实例
你昨晚问的我已经回答你了，怎么又来提问了啊？
第一个：(这个你要用do while...loop的，其实这个更适合用do...loop until语句）
Private Sub Command1_Click()
Dim N As Integer, SUM As Integer, I As Integer
Me.Cls
N = InputBox("请输入一个整数：", "输入")
Do While N <> 0
I = I + 1
SUM = SUM + N
Me.Print "第" & I & "个数：" & N
N = InputBox("请输入一个整数：", "输入")
Loop
Me.Print "共" & I & "个数"
Me.Print "和：" & SUM
Me.Print "平均值："; SUM / I
End Sub
第二个：
Private Sub HScroll1_Change()
Text1.Text = HScroll1.Value
End Sub
Private Sub HScroll1_Scroll()
Label1.Caption = "Moving to " & HScroll1.Value
End Sub
❽ 谁知道以下图片中excel插入滚动条例子怎么实现的
开发者工具里，插入控件。如果没开发者工具的话，去excel选项里设置下即可。
三级下拉菜单。
❾ 求大神给一个 VB.NET 窗体带滚动条的例子源码
思路：
利用几个可以作为容器的控件，添加滚动条就可以了：
我举个例子：（这个问题我记得回答过的！）
添加1个PicTureBox1，作为容器
在PicTureBox1里添加PicTureBox2，在窗体上添加一个垂直滚动条。
把你所谓的许多控件放到PicTureBox2里，滚动条改变的是PicTureBox2在PicTureBox1里的Top属性，我想你通过一定的空间想象力，可以想到效果了吧？
注意：默认状态设置PicTureBox2的Top属性为0，当该属性为负值的时候，PicTureBox2显示的效果是向上移动，即下面原来隐藏的内容为可见了。
要设置PicTureBox2的AutoRedraw 属性为True。
若要左右移动效果，那么改变其 Left 属性，原理不再赘述了。