当前位置: 首页 > 编程日记 > 正文

可控制的页面内滚动区域

效果预览

下面我们就来详细讲解一下这种效果的制作方法:

首先,我们在样式表里加入“.opacity {FILTER: alpha(opacity=100)”,看下面!

<style type="text/css">
<!--
.opacity {FILTER: alpha(opacity=100)}
-->
</style>

然后在html代码中加入:

<script>
function movstar(a,time){
movx=setInterval("mov("+a+")",time)
}
function movover(){
clearInterval(movx)
}
function mov(a){
scrollx=new_date.document.body.scrollLeft
scrolly=new_date.document.body.scrollTop
scrolly=scrolly+a
new_date.window.scroll(scrollx,scrolly)
}
function o_down(theobject){
object=theobject
while(object.filters.alpha.opacity>60){
object.filters.alpha.opacity+=-10}
}
function o_up(theobject){
object=theobject
while(object.filters.alpha.opacity<100){
object.filters.alpha.opacity+=10}
}
function wback(){
if(new_date.history.length==0){window.history.back()}
else{new_date.history.back()}
}
</script>

然后在向上箭头图片的代码中加入“class="opacity" onMouseDown=movover();movstar(-3,2) onMouseOut=movover();o_up(this) onMouseOver=movstar(-1,20);o_down(this) onMouseUp=movover();movstar(-1,20) alt="点住不放可以快速向上滚动"”。

如下所示:

<img src="images/up.gif" width=19 height=27 class="opacity" onMouseDown=movover();movstar(-3,2) onMouseOut=movover();o_up(this) onMouseOver=movstar(-1,20);o_down(this)onMouseUp=movover();movstar(-1,20) alt="点住不放可以快速向上滚动">

这就是控制文字向上滚动的代码,当鼠标移动到up.gif图片上时文字向上滚动,按动箭头文字会加快向上滚动速度。

向下箭头图片的制作方法同上。在代码中加入“class="opacity" onMouseDown=movover();movstar(3,2) onMouseOut=movover();o_up(this) onMouseOver=movstar(1,20);o_down(this) onMouseUp=movover();movstar(1,20) alt="点住不放可以快速向下滚动"”。

如下所示:

<img src="images/down.gif" width=19 height=19 class="opacity" onMouseDown=movover();movstar(3,2) onMouseOut=movover();o_up(this) onMouseOver=movstar(1,20);o_down(this) onMouseUp=movover();movstar(1,20) alt="点住不放可以快速向下滚动">

之后在要显示文字的区域加上以下这段代码:

<iframe border=0 frameborder=0 framespacing=0 height=120 marginheight=0 marginwidth=0 name=new_date noResize scrolling=no src="iframe.htm" width=200 vspale="0"></iframe>

连接一个叫iframe.htm的页面。其中height=120 width=200控制iframe.htm页面在当前页面的显示面积大小。编辑iframe.htm文件,放入你要更新的内容就行了。

相关文章:

提升对ASP.NET网站性能和多并发的设计的讨论

对于如何提高应用程序的性能&#xff08;无论是互联网应用还是企业级应用&#xff09;我的观点一直是考虑一个核心&#xff1a;IO处理。因为我认为目前的CPU的处理能力已经是非常高了&#xff0c;正常编写的在内存中处理的代码没有太严重的问题都不会对CPU造成很大的影响&#…

算力至上?四大AI芯片大对决

来源 | 老石谈芯&#xff08;ID: laoshi_tanxin&#xff09;目前&#xff0c;全世界超过90%的数据都是在过去的两三年之内产生的。随着人工智能、自动驾驶、5G、云计算等各种技术的不断发展&#xff0c;海量数据都将会继续源源不断的产生。预计到2025年&#xff0c;数据总量将比…

JavaScript作用域原理——预编译

JavaScript是一种脚本语言, 它的执行过程, 是一种翻译执行的过程。并且JavaScript是有预编译过程的&#xff0c;在执行每一段脚本代码之前, 都会首先处理var关键字和function定义式&#xff08;函数定义式和函数表达式&#xff09;。 一、变量执行之前&#xff0c;会被赋为unde…

VC++实现QQ聊天工具【源代码】

http://down.51cto.com/data/53416转载于:https://blog.51cto.com/6297123/1094981

​炸了!程序员现在没有这点技能都还不能就业了?

数据正在变得越来越常见&#xff0c;小到我们每个人的社交网络、消费信息、运动轨迹……&#xff0c;大到企业的销售、运营数据&#xff0c;产品的生产数据&#xff0c;交通网络数据……如何从海量数据中获得别人看不见的知识&#xff0c;如何利用数据来武装营销工作、优化产品…

javascript表单之间的数据传递

今天有朋友问我关于用javascript来进行页面各表单之间的数据传递的问题&#xff0c;我以前也写过&#xff0c;不过从来没有注意&#xff0c;今天总结了一下&#xff0c;希望能够给大家一些帮助&#xff0c;也帮助我总结以前学过&#xff0c;用过的知识。 一&#xff0c;最简单的…

Vue从Hello World到打包(后端适读)

Vue从Hello World到上线 Vue 简介 Vue是个MVVM框架。 特点&#xff1a;简单易学、体积小、性能高。并且它的源码耦合性非常低&#xff0c;了解它的过程也就是思想进步的过程。 当然&#xff0c;只学这一个框架&#xff0c;无法完成前端的全部工作&#xff0c;除了Vue之外&#…

Android和iOS那个好?

Android和iOS那个好&#xff1f; 应该先往哪个上面投入资源&#xff1f; 多次被人问到此类问题&#xff0c;笔者刚好自己的项目也需要考虑iOS版本。就索性进行了一番调研&#xff0c;于是有了本文&#xff08;本次不讨论越狱的iOS&#xff09; 首先从情感上&#xff0c;你…

对话谢宝友:搞真正自研的国产操作系统,而不是伪创新

作者 | 郑丽媛责编 | 屠敏出品 | CSDN&#xff08;ID&#xff1a;CSDNnews&#xff09;从国外操作系统的长期垄断到中国自主研发操作系统数十年的起落浮沉&#xff0c;技术自主创新独立已成为国产基础软件的主要突破口。近几年间&#xff0c;随着物联网时代的到来&#xff0c;以…

ASP.NET 学习历程

[注意我不推荐高级技术的书&#xff0c;因为你如果是个高手了就可以自己选择甄别书了&#xff0c;此文只对初学者&#xff0c;因为他们此时没有辨别好快的能力&#xff0c;本人几乎买尽所有的.NET书&#xff0c;有好有坏。] 你所看的第一本书对你以后影响最重要&#xff01;&a…

http头部消息中的cache-control解释

网页的缓存是由HTTP消息头中的“Cache-control”来控制的&#xff0c;max-age&#xff1a;&#xff08;只接受 Age 值小于 max-age 值&#xff0c;并且没有过期的对象&#xff09;max-stale&#xff1a;&#xff08;可以接受过去的对象&#xff0c;但是过期时间必须小于 max-st…

iframe自动调整高度能在IE5里实现吗

偶已经理解到style"height:expression(main.document.body.scrollHeight)"只对第一次显示的内嵌网页有效&#xff0c;如果里面的内容更新必须把主页刷新一遍才能自动适应新的高度&#xff0c;那么惟一的解决办法就是点击链接后整个页面都刷新一次&#xff0c;如何写成…

SQL Server-流程控制 5,Goto 语句

ylbtech-SQL Server:SQL Server-流程控制 5,Goto 语句SQL Server 流程控制中的 Goto 语句。 1&#xff0c;Goto 语句1 --2 -- 1, Goto语句3 -- Desc:Goto语句可以让程序跳转到一个指定的标签处并执行其后的代码。Goto语句和标签可以在程序4 -- 、批处理和语句块中的任意位置使用…

MLPerf基准测试再发榜,浪潮AI服务器刷新18项纪录

近日&#xff0c;全球倍受瞩目的权威AI基准测试MLPerf公布今年的推理测试榜单&#xff0c;其中浪潮AI服务器NF5488A5一举创造18项性能纪录&#xff0c;在数据中心AI推理性能上遥遥领先其他厂商产品。 MLPerf是当前全球最具影响力的AI计算基准评测组织&#xff0c;由图灵奖得主大…

Web充斥着存在漏洞的过期JavaScript库

虽然使用第三方软件库通常会降低开发的时间&#xff0c;但同时也会增加网站暴露出的攻击表面&#xff0c;对此我们应有充分的认识。因此需要保持第三方软件库的最新版本依赖&#xff0c;以便从安全更新中获益。即便如此&#xff0c;一份近期研究表明&#xff0c;在Alexa排名前7…

asp.net实现C#代码加亮显示

以下是代码片段&#xff1a;StringWriter textBuffer new StringWriter();Match match Regex.Match(HTMLStr,"/",RegexOptions.IgnoreCase | RegexOptions.Compiled);if(matchnull){Response.Write(HTMLStr);return;} string codeType match.Groups["codeType…

应用在大规模推荐系统,Facebook提出组合embedding方法 | KDD 2020

来源 | 深度传送门&#xff08;ID: deep_deliver&#xff09;Facebook团队考虑embedding的存储瓶颈&#xff0c;提出了一种新颖的方法&#xff0c;通过利用类别集合的互补分区为每个类别生成唯一的embedding向量&#xff0c;无需明确定义&#xff0c;从而以端到端的方式减小emb…

Android大图裁剪解决办法

某些功能需要拍照或者从相册选择照片后经过裁剪再上传的时候&#xff0c; cropp_w_picpath 可以调用手机自带的com.android.camera.action.CROP这个Intent进行裁剪 通过设置输出大小可以得到图片的大小&#xff1a; intent.putExtra(“outputX”, outputX); intent.putExtra(“…

day03-字符编码与转换

1、编码常识 在python 2中默认编码是 ASCII&#xff0c;而在python 3中默认编码是 unicodeunicode 分为utf-32 (占4个字节),utf-16(占两个字节)&#xff0c;utf-8(占1-4个字节)&#xff0c;所以utf-16 是最常用的unicode版本&#xff0c;但是在文件里存的还是utf-8&#xff0c;…

Asp.Net下的DataGrid的多层表头

先看下表&#xff1a; 业务员地 区 北京上海深圳张三100200300实际上Asp.Net下的DataGrid只不过是一个HtmlTable&#xff0c;只不过在HtmlTable的基础上添加了很多属性、方法&#xff0c;纳入ViewState机制&#xff0c;来生成、控制它&#xff1b;有了这一点认识&#xff0c;事…

Selenium的延迟等待

2019独角兽企业重金招聘Python工程师标准>>> Selenium的延迟等待分为 显式等待(Explicit Wait) & 隐式等待(Implicit Wait). 1.显式等待 显式等待,就是明确的要等到某个元素的出现或者是某个元素的可点击等条件,等不到,就一直等,除非在规定的时间之内都没找到…

瞧瞧,这样的代码才叫Pythonic

来源 | Python编程时光&#xff08;ID: Cool-Python&#xff09;Python由于语言的简洁性&#xff0c;让我们以人类思考的方式来写代码&#xff0c;新手更容易上手&#xff0c;老鸟更爱不释手。要写出 Pythonic&#xff08;优雅的、地道的、整洁的&#xff09;代码&#xff0c;还…

linux基础(一)安装系统Centos6.5

安装有常用有&#xff1a;远程网络安装、U盘安装、光盘安装三种方式&#xff0c;以下为光盘进行安装1.出现引导界面&#xff0c;选择安装或升级现有系统&#xff0c;选择第一个安装系统。Install or upgrade an existing system 安装或升级现有的系统 install system with basi…

使用 .NET 对事件进行编程

作者:Ted Pattison  您可能已经对事件进行编程若干年了&#xff0c;但是迁移到 .NET Framework 仍然需要您重新检查事件的内部工作&#xff0c;因为 .NET Framework 中的事件位于委托的顶层。 对委托的了解越多&#xff0c;对事件进行编程时所具有的驾驭能力越强。 开始使用公…

tomcat项目自动发布脚本.脚本运行效果

./update -------------------------------------------------------------- | 确定特定用户执行,否则退出 | -------------------------------------------------------------- Yes,we are the user of testtomcat --------------------------------------------------…

11.11大促来袭,京东如何保障云安全?

2020年4月&#xff0c;国家发改委首次就“新基建”概念作出正式解释。云计算被纳入信息基础设施中的新技术基础设施。据IDC统计&#xff0c;2019年全球云计算基础设施规模超过传统IT基础设施&#xff0c;占全球IT基础设施的50%以上。云计算发展势如破笋&#xff0c;云计算也成为…

分享Kali Linux 2017年第11周镜像文件

分享Kali Linux 2017年第11周镜像文件 Kali?Linux官方于3月12日发布2017年的第11周镜像。这次维持了11个镜像文件的规模。默认的Gnome桌面的4个镜像&#xff0c;E17、KDE、LXDE、MATE、XFCE桌面的各一个&#xff0c;手机版的包括ARMEL和ARMHF。有最近要安装Kali?Linux系统的&…

实现无刷新DropDownList联动效果

在做一个文章添加功能时&#xff0c;想在选择大类后&#xff0c;自动将其所属二级小类显示出来&#xff0c;使用DropDownList的SelectedIndexChanged事件可以很容易实现&#xff0c;但每次选择后页面总要刷新一次&#xff0c;让人感觉很不爽。为实现DropDownList无刷新二级联动…

偷天换日,逼真的天空置换算法

责编 | 晋兆雨来源 | Jack Cui头图 | CSDN付费下载于视觉中国前言天空&#xff0c;是摄像中的一个关键元素。游戏的天空&#xff0c;我们可以随意调节&#xff0c;可以是晴空万里&#xff0c;也可以是风雨交加。现实的天空&#xff0c;我们也可以使用算法进行调整&#xff0c;算…

office2003/2007/2010版本降低宏安全设置方法

如果在公司内部环境中&#xff0c;因为各种系统对Office环境的要求&#xff0c;需要通过降低Office宏安全性的方法来提高系统访问效率的话&#xff0c;可以参考一下方法设置。 Office2003所需的设置如下&#xff1a; 1、打开Office2003&#xff0c;选择"工具"&#x…