主页面中的两个iframe实现鼠标拖动改变其大小
更新时间：2013年04月16日 15:55:19 作者：
iframe实现鼠标拖动改变其大小在一个页面中的两个iframe的情况下，此方法相当实用，感兴趣的各位不妨参考下，或许对你有所帮助
复制代码 代码如下:
<%@ Page Language="vb" AutoEventWireup="false" Codebehind="WebForm4.aspx.vb" Inherits="HIG_Receipt.WebForm4"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>WebForm4</title>
<meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" content="Visual Basic .NET 7.1">
<meta name=vs_defaultClientScript content="JavaScript">
<meta name=vs_targetSchema content="http://schemas.microsoft.com/intellisense/ie5">
<style type=text/css >
.resizeDivClass{
width:3px;
margin:0px 0 0px 0;
background:#ffff33;
border:5px;
cursor:e-resize;
</style>
<script type=text/javascript language =javascript >
var mousedown=false;
var aaa;
function down() {
mousedown=true;
aaa=event.clientX-td1.offsetWidth;
event.srcElement.setCapture();
}
function move() {
if(mousedown==true){
td1.style.width=Math.max(1,event.clientX-aaa);
}
}
function up() {
event.srcElement.releaseCapture();
mousedown=false;
}
</script>
</head>
<body MS_POSITIONING="GridLayout" >
<TABLE width="100%" height="100%" >
<tr>
<td id="td1" >
第一个iframe
<iframe style="WIDTH: 100%; HEIGHT: 100%" src="" frameBorder="0">
</iframe>
</td>
<td class="resizeDivClass" onmousedown="down()" onmousemove="move()" onmouseup="up()">
</td>
<td >
第二个iframe
<iframe style="WIDTH: 100%; HEIGHT: 100%" src="" frameBorder="0">
</iframe>
</td>
</td>
</table>
</body>
</html>
相关文章
JavaScript中对象property的读取和写入方法介绍
这篇文章主要介绍了JavaScript中对象property的读取和写入方法介绍,本文讲解了原型继承链中property的读取、原型继承链中property的写入等内容,需要的朋友可以参考下2014-12-12
本文给大家简单分享了一下个人项目中解决无刷新上传文件的方法和示例，有需要的小伙伴可以参考下。2015-06-06
这篇文章主要为大家详细介绍了原生JS实现简单放大镜效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-02-02
这篇文章主要介绍了基于JS实现table导出Excel并保留样式,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-05-05
这篇文章主要为大家详细介绍了js上下视差滚动的简单实现代码，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-03-03
这篇文章主要介绍了JavaScript 自定义弹出窗口的实现代码,实现一采用html编写弹出窗口内容,实现二采用JavaScript编写弹出窗口内容,结合示例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧2023-09-09
这篇文章主要为大家详细介绍了JS实现百度新闻导航栏效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-10-10
这篇文章主要介绍了js function定义函数的几种方法,需要的朋友可以参考下2014-02-02
本篇文章给大家详细介绍了javascript中的隐式调用相关知识点，对此有兴趣的可以跟着小编一起学习下。2018-02-02
由于小程序跳转的对象比较多,各自的规则又不一样,因此小程序跳转外部链接是用户咨询较多的问题之一,下面这篇文章主要给大家介绍了关于小程序安全指南之如何禁止外部直接跳转到小程序某页面的相关资料,需要的朋友可以参考下2022-09-09
最新评论