主页面中的两个iframe实现鼠标拖动改变其大小


Posted in Javascript onApril 16, 2013
<%@ 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>

主页面中的两个iframe实现鼠标拖动改变其大小
Javascript 相关文章推荐
jquery提取元素里的纯文本不包含span等里的内容
Sep 30 Javascript
文本框倒叙输入让输入框的焦点始终在最开始的位置
Sep 01 Javascript
深入分析jquery解析json数据
Dec 09 Javascript
浅谈JavaScript字符串与数组
Jun 03 Javascript
javascript实现多栏闭合展开式广告位菜单效果实例
Aug 05 Javascript
JavaScript中三种异步上传文件方式
Mar 06 Javascript
js 基础篇必看(点击事件轮播图的简单实现)
Aug 20 Javascript
AngularJS 过滤与排序详解及实例代码
Sep 14 Javascript
JavaScript校验Number(4,1)格式的数字实例代码
Mar 13 Javascript
vue watch监听对象及对应值的变化详解
Feb 24 Javascript
vue2实现provide inject传递响应式
May 21 Vue.js
React实现动效弹窗组件
Jun 21 Javascript
拖动table标题实现改变td的大小(css+js代码)
Apr 16 #Javascript
获取offsetTop和offsetLeft值的js代码(兼容)
Apr 16 #Javascript
jquery表格内容筛选实现思路及代码
Apr 16 #Javascript
js实现图片轮换效果代码
Apr 16 #Javascript
js相册效果代码(点击创建即可)
Apr 16 #Javascript
jQuery实现点击标题输入详细信息
Apr 16 #Javascript
jQuery图片的展开和收缩实现代码
Apr 16 #Javascript
You might like
漂亮但不安全的CTB
2006/10/09 PHP
php 删除数组元素
2009/01/16 PHP
PHP 调试工具Debug Tools
2011/04/30 PHP
PHP编码转换
2012/11/05 PHP
PHP性能分析工具XHProf安装使用教程
2015/05/13 PHP
3种php生成唯一id的方法
2015/11/23 PHP
PHP 中常量的知识整理
2017/04/14 PHP
JS获得QQ号码的昵称,头像,生日的简单实例
2013/12/04 Javascript
微信小程序 图片边框解决方法
2017/01/16 Javascript
详解vue 中使用 AJAX获取数据的方法
2017/01/18 Javascript
JavaScript Date 知识浅析
2017/01/29 Javascript
D3.js中强制异步文件读取同步的几种方法
2017/02/06 Javascript
xmlplus组件设计系列之树(Tree)(9)
2017/05/02 Javascript
Vue单文件组件基础模板小结
2017/08/10 Javascript
vue select组件的使用与禁用实现代码
2018/04/10 Javascript
Vue 理解之白话 getter/setter详解
2019/04/16 Javascript
一百行JS代码实现一个校验工具
2019/04/30 Javascript
JavaScript实现抖音罗盘时钟
2019/10/11 Javascript
python操作MySQL数据库的方法分享
2012/05/29 Python
python使用htmllib分析网页内容的方法
2015/05/08 Python
Python 实现购物商城,含有用户入口和商家入口的示例
2017/09/15 Python
python实现决策树ID3算法的示例代码
2018/05/30 Python
Python PyQt5 Pycharm 环境搭建及配置详解(图文教程)
2019/07/16 Python
感知器基础原理及python实现过程详解
2019/09/30 Python
Python+Appium实现自动化清理微信僵尸好友的方法
2021/02/04 Python
英国天然有机美容护肤品:Neal’s Yard Remedies
2018/05/05 全球购物
德国前卫设计师时装在线商店:Luxury Loft
2019/11/04 全球购物
资产经营总监岗位职责
2013/12/04 职场文书
优秀毕业生就业推荐信
2014/05/22 职场文书
村级四风对照检查材料
2014/08/24 职场文书
军训通讯稿范文
2015/07/18 职场文书
公司团队口号霸气押韵
2015/12/24 职场文书
2016初一新生军训心得体会
2016/01/11 职场文书
2016大学生毕业实习心得体会
2016/01/23 职场文书
如何用 Python 子进程关闭 Excel 自动化中的弹窗
2021/05/07 Python
关于Nginx中虚拟主机的一些冷门知识小结
2022/03/03 Servers