可控制的页面内滚动区域
效果预览 下面我们就来详细讲解一下这种效果的制作方法: 首先,我们在样式表里加入“.opacity {FILTER: alpha(opacity=100)”,看下面! <style type="text/css"> 然后在html代码中加入: <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="data: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="data: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文件,放入你要更新的内容就行了。 |
可控制的页面内滚动区域相关推荐
- 微信小程序弹窗打开时,控制页面不能滚动
问题:微信小程序里,页面上有一个弹窗,弹窗里有可滚动列表,弹窗列表滚动时页面的列表也会滚动. 解决方法:在wxml页面上添加<page-meta page-style="{{ cart ...
- 【教程】Spire.PDF教程:C# 从 PDF 页面的指定区域内提取文本
Spire.PDF是一个专业的PDF组件,能够独立地创建.编写.编辑.操作和阅读PDF文件,支持 .NET.Java.WPF和Silverlight. [下载Spire.PDF最新试用版] 有时我们可 ...
- h5页面实现固定div内滚动
h5页面实现固定div内滚动实现方法: 注意: 因为h5页面没有scroll-view这样的组件,这里使用css实现滚动, 父元素flex布局,高度100%,页面从上到下正常铺,需要实现滚动的div ...
- php页面如何加入滚动广告,前端页面内实现左右摇摆广告
这次给大家带来前端页面内实现左右摇摆广告,前端页面内实现左右摇摆广告的注意事项有哪些,下面就是实战案例,一起来看一下. 代码解读 定义 dom,容器中包含公告牌.挂公告牌的细绳和固定绳子的 3 个图钉 ...
- 解决H5页面无法滚动
问题一: 在苹果手机可以,但安卓手机不可以. H5页面没有使用任何滚动插件,比如: iscroll.min.js 或者 Better Scroll. 这里是因为: * {touch-action: ...
- 数控是用计算机来计算的吗,数控机床的完美控制—帮助页面和计算器
数控机床的完美控制-帮助页面和计算器 来源:-- 作者:-- 浏览:1173 时间:2016-08-10 14:18 标签: 摘要: 毋庸置疑,数控技术使得当今机床产能大大提高,或者说,是那些界面,比 ...
- 猫客页面内组件的动态化方案-Tangram 2.0
Tangram 2.0 库 Android Tangram-Android Virtualview-Android iOS Tangram-iOS Virtualview-iOS 背景 技术背景 一直 ...
- JS 页面内锚点跳转
JS 实现页面内锚点跳转 //平滑的跳转 let element = document.getElementById("id"); if (element) {element.sc ...
- html关闭ios橡皮筋效果,禁止ios浏览器页面上下滚动 (橡皮筋效果)
在ios任何版本的浏览器(包括ios微信内置的浏览器),滚动页面的时候会出现整个页面上下滚动的效果(百度说是橡皮筋效果),虽然不耽误使用,但是让人心烦,所以要禁止掉这个行为. 有两种方法可以解决这个问 ...
最新文章
- oracle坏块 戴明明,云和恩墨:基于PCIE 闪存卡的 Oracle 数据
- aggr代码 cellranger_单细胞转录组测序数据分析流程-数据预处理
- 《看透springmvc源码分析与实践》读书笔记一
- Linux内核功能及架构
- 7、MySQL默认值(DEFAULT)
- PHP __compare 魔术方法的实现
- python画海绵宝宝_脑洞大开的万圣节,10招带你和宝宝花式玩南瓜
- 利用Java实现串口全双工通讯
- docker mysql优势_前端使用docker有什么优势呢?
- python提交事务_事务提交和回滚
- [ffmpeg 扩展第三方库编译系列] 关于libopenjpeg mingw32编译问题
- 蓝桥杯 算法训练 Sticks
- 【LINUX系列】之字符串搜索命令
- 前端vue项目开发流程
- [C#]方法示例:判断是否闰年
- position based dynamics
- tomcat 配置https 访
- 随机对偶动态规划 SDDP,报童模型的一个 python 例子
- 关于GPIO的内部结构及编程步骤
- 线程池:newCachedThreadPool、newFixedThreadPool、newSingleThreadExecutor、newScheduleThreadPool
热门文章
- c语言实现图形界面实现四则运算,C语言实现四则运算的生成器
- Windows HTML本地快速渲染轨迹线
- (一)神经网络训练不起来怎么办:局部最小值(local minia)与鞍点(saddle point)
- archlinux安装TensorFlow带GPU
- vs中.exe运行闪退的解决办法
- LeetCode刷题记录2——217. Contains Duplicate(easy)
- java保存多张图片格式_从多个URL下载多个图像文件并保存到本地计算机(使用R)...
- python中意外缩进是什么意思_与python中的“意外缩进”怎么办?
- F-LOAM:基于激光雷达的快速里程计和建图
- 一条命令下载google壁纸,含错误解决方法