主頁面中的兩個iframe實現(xiàn)鼠標(biāo)拖動改變其大小
更新時間：2013年04月16日 15:55:19 作者：
iframe實現(xiàn)鼠標(biāo)拖動改變其大小在一個頁面中的兩個iframe的情況下，此方法相當(dāng)實用，感興趣的各位不妨參考下，或許對你有所幫助
復(fù)制代碼 代碼如下:
<%@ 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>
相關(guān)文章
這篇文章主要介紹了JS徹底弄懂GMT和UTC時區(qū)，對時間感興趣的同學(xué)，可以參考下2021-04-04
如果你無法理解博文在講什么，請回顧前面的系列博文。文章比較深入，如有不對之處，望請指正，謝謝。2010-10-10
layui 實現(xiàn)加載動畫以及非真實加載進度的方法
今天小編就為大家分享一篇layui 實現(xiàn)加載動畫以及非真實加載進度的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
如何給ListBox添加雙擊事件，想必有很多的新手朋友們都不會吧，下面有個不錯的示例，感興趣的朋友可以參考下2013-12-12
這篇文章主要介紹了一文理解JavaScript裝飾器模式，文章基于JavaScript的相關(guān)資料展開詳細介紹，具有一定的參考價值，需要的小伙伴可以參考一下2022-04-04
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)HSL拾色器，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-05-05
這篇文章主要介紹了一個小時快速搭建微信小程序的方法步驟，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-04-04
這篇文章主要為大家介紹了前端進階之IntersectionObserver示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-04-04
這篇文章主要介紹了基于JavaScript實現(xiàn)仿京東圖片輪播效果，代碼簡單易懂，需要的小伙伴參考下吧2015-11-11
這篇文章主要介紹了javascript實現(xiàn)圖片偽異步上傳過程解析,文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-04-04