使用iframewindow的scroll方法控制iframe页面滚动_手写目录控制iframe中的pdf丝滑翻页 - CSDN文库

127 浏览量更新于2023-03-16 评论收藏 35KB PDF 举报

身份认证购VIP最低享 7 折!

领优惠券(最高得80元）

资源详情

资源评论

资源推荐

使用使用iframe window的的scroll方法控制方法控制iframe页面滚动页面滚动

在页面中如何控制内嵌的iframe滚动呢？方法是使用iframe window的scroll方法，大家可以参考下面的示例

在页面中如何控制内嵌的iframe滚动呢？方法是使用iframe window的scroll方法：

1、获取iframe的窗口对象

var iwin = document.getElementById('iframe1').contentWindow;

2 、获取iframe的窗口document对象

var doc = iwin.document;

3、调用iframe window对象的scroll方法

iwin.scroll(0,doc.body.scrollHeight);

scroll两个参数为x,y轴的滚动量

doc.body.scrollHeight为iframe页面的高度（包含未显示的部分）

一个综合应用例子如下：

复制代码代码如下:

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>hover test</title>

<style type="text/css">

ul{

background-color:#ff00ff;

display:block;

}

.toc li{

position:relative; width:10em;

background-color:#00ff00;

display:block;

}

li a {

/*display:block;*/ /*若以块的模式显示，则会占满整个父元素空间*/

background-color:#0000ff;

} /*必须让a成为块级元素*/

li a i{

display:none;

}

li a:hover{

text-align:left;

}/*这里添加的代码只是为了让IE6显示，没有特殊功能，除text-decoration，color，z-index外都可以写*/

.toc li a:hover i{

display:block;

width:6em;

position:absolute;

top:0;

left:100%; /* 这里100%指相对于元素li的宽度*/

margin:-1em 0 0 0em;

padding:1em;

background:#cde;

border:1px solid red;

text-align:left;

本内容试读结束，登录后可阅读更多

下载后可阅读完整内容，剩余1页未读，立即下载

评论0

weixin_38726193

粉丝: 12
资源: 936

会员权益专享

图片转文字

全年可省5，000元立即开通

最新资源

资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！点击此处反馈