主页面中的两个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 相关文章推荐
正则表达式判断是否存在中文和全角字符和判断包含中文字符串长度
Sep 27 Javascript
jQuery实现切换页面布局使用介绍
Oct 09 Javascript
JavaScript高级程序设计(第3版)学习笔记10 再访js对象
Oct 11 Javascript
JQuery 图片滚动轮播示例代码
Mar 24 Javascript
ajax提交表单实现网页无刷新注册示例
May 08 Javascript
JavaScript正则表达式匹配 div  style标签
Mar 15 Javascript
Javascript 函数的四种调用模式
Nov 05 Javascript
jQGrid动态填充select下拉框的选项值(动态填充)
Nov 28 Javascript
vue.js实现数据动态响应 Vue.set的简单应用
Jun 15 Javascript
小程序开发基础之view视图容器
Aug 21 Javascript
vue scroll滚动判断的实现(是否滚动到底部、滚动方向、滚动节流、获取滚动区域dom元素)
Jun 11 Javascript
简单聊聊TypeScript只读修饰符
Apr 06 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
PHP 的 __FILE__ 常量
2007/01/15 PHP
php 移除数组重复元素的一点说明
2008/11/27 PHP
将数组写入txt文件 var_export
2009/04/21 PHP
ajax实现无刷新分页(php)
2010/07/18 PHP
Codeigniter实现处理用户登录验证后的URL跳转
2014/06/12 PHP
Smarty模板变量调节器用法分析
2016/05/23 PHP
javascript生成/解析dom的CDATA类型的字段的代码
2007/04/22 Javascript
javascript cookies 设置、读取、删除实例代码
2010/04/12 Javascript
JavaScript判断DOM何时加载完毕的技巧
2012/11/11 Javascript
Javascript遍历Html Table示例(包括内容和属性值)
2014/07/08 Javascript
JavaScript使用setTimeout实现延迟弹出警告框的方法
2015/04/07 Javascript
微信小程序 触控事件详细介绍
2016/10/17 Javascript
利用浮层使select不可选的实现方法
2016/12/03 Javascript
jQuery多选框选择数量限制方法
2017/02/08 Javascript
JS中正则表达式全局匹配模式 /g用法详解
2017/04/01 Javascript
关于vue-router路径计算问题
2017/05/10 Javascript
详解KOA2如何手写中间件(装饰器模式)
2018/10/11 Javascript
如何阻止小程序遮罩层下方图层滚动
2019/09/05 Javascript
axios如何取消重复无用的请求详解
2019/12/15 Javascript
JS函数基本定义与用法示例
2020/01/15 Javascript
JavaScript代码模拟鼠标自动点击事件示例
2020/08/07 Javascript
微信小程序基于ColorUI构建皮皮虾短视频去水印组件
2020/11/04 Javascript
深入解析Python中的WSGI接口
2015/05/11 Python
讲解Python中运算符使用时的优先级
2015/05/14 Python
十条建议帮你提高Python编程效率
2016/02/16 Python
解决Django Haystack全文检索为空的问题
2020/05/19 Python
Python使用Chrome插件实现爬虫过程图解
2020/06/09 Python
Python ConfigParser模块的使用示例
2020/10/12 Python
详解pandas apply 并行处理的几种方法
2021/02/24 Python
Myprotein丹麦官网:欧洲第一运动营养品牌
2019/04/15 全球购物
ktv中秋节活动方案
2014/01/30 职场文书
《奇妙的国际互联网》 教学反思
2014/02/25 职场文书
护士找工作求职信
2014/07/02 职场文书
在HTML5 localStorage中存储对象的示例代码
2021/04/21 Javascript
matplotlib之pyplot模块实现添加子图subplot的使用
2021/04/25 Python
使用Ajax实现无刷新上传文件
2022/04/12 Javascript