欧美一区二区三区爱爱,91久久国产综合久久,日本a黄

拖動(dòng)效果封裝已經(jīng)修改，適應(yīng)火狐

藍(lán)色理想 2009/5/2 21:35:40 深山行者字體:大中小瀏覽 12580

以下為詳細(xì)代碼

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>拖動(dòng)效果 封裝 已經(jīng)修改，適應(yīng)火狐</title>
<style type="text/css">

</style>
<script type="text/javascript">
/*
十三妖
qq:181907667
msn:wl181907667@hotmail.com
郵箱:thirdteendevil@163.com
*/
function dragClass(){
	this.mouseState = document.all ? 1 : 0 ;
	this.x;
	this.y;
	this.dragId = null;
	this.index = 100;
	document.onselectstart = function(){return false;};
}
dragClass.prototype = {
	dragStar:function(dragId,moveId){//拖動(dòng)入口函數(shù)
		var _this = this;	
		_this.$(dragId).style.cursor = "move";	
		_this.$(dragId).onmousedown = function(e){
			var e = e ? e : event;
			//_this.$(moveId).style.zIndex = _this.index++;
			if(e.button == _this.mouseState)
			{
				_this.setDragInfo(e,moveId,moveId);
				_this.dragPro(moveId);
			}			
		},
		_this.$(moveId).onmousedown = function(e){
			_this.$(moveId).style.zIndex = _this.index++;
		},		
		_this.$(dragId).onmouseup = function(){
			_this.clearDragId();
		}
		document.onmouseup = function(){
			_this.clearDragId();
		}
	},
	setDragInfo:function(e,dragId,moveId){//拖動(dòng)初始化
		this.x = e.clientX;
		this.y = e.clientY;
		this.dragId = dragId;
		if(this.$(moveId).style.position != "absolute")
		{
			this.$(moveId).style.width = this.$(moveId).offsetWidth + "px";	
			this.$(moveId).style.height = this.$(moveId).offsetHeight + "px";
			this.$(moveId).style.position = "absolute";
			this.$(moveId).style.left = this.$(moveId).offsetLeft + "px";
			this.$(moveId).style.top = this.$(moveId).offsetTop + "px";
		}				
	},
	clearDragId:function(){ //清除拖動(dòng)ID
		this.dragId = null;
	},
	dragPro:function(moveId){
		var _this = this;
		document.onmousemove = function(e){
			var e = e ? e : event;
			if(e.button == _this.mouseState && _this.dragId != null)
			{
				var x = e.clientX;
				var y = e.clientY;
				//_this.$(moveId).style.left = (_this.$(moveId).offsetLeft + (x - _this.x)) + "px";
				//_this.$(moveId).style.top = (_this.$(moveId).offsetTop + (y - _this.y)) + "px";
				_this.$(moveId).style.left = (parseInt(_this.$(moveId).style.left) + (x - _this.x)) + "px";
				_this.$(moveId).style.top = (parseInt(_this.$(moveId).style.top) + (y - _this.y)) + "px";
				_this.x = x;
				_this.y = y;
				//alert(_this.$(dragId).style.left);
			}
			
		}
	},
	$:function(o){//獲取對(duì)象
		if(typeof(o) == "string")
		{
			if(document.getElementById(o))
			{
				return document.getElementById(o);
			}
			else
			{
				alert("errId \""+ o + "\"!");
				return false;
			}
		}
		else
		{
			return o;
		}
	}
}
window.onload = function(){
	var c = new dragClass();
	c.dragStar("b","a");
	c.dragStar("d","c");
}
</script>
</head>
<body>
<div class="bodyer">
	<h1 class="t_rt">
		鼠標(biāo)拖動(dòng)層封裝類
	</h1>
	
	<h2>
		效果預(yù)覽
	</h2>
	
	<div class="preview">
		<div class="scrolldoorFrame">
			<div id="a" style="width:200px;height:150px;background:#FFF;border:1px solid #DDD;">
				<div id="b" style="height:20px;margin:1px;line-height:22px;overflow:hidden;background:#999;font-size:12px;font-weight:bold;color:#FFF;padding-left:15px;">
				拖動(dòng)層1
				</div>
				&nbsp;&nbsp;&nbsp;&nbsp;移動(dòng)層
			</div>
			
			<div id="c" style="width:200px;height:150px;background:#FFF;border:1px solid #DDD;">
				<div id="d" style="height:20px;margin:1px;line-height:22px;overflow:hidden;background:#999;font-size:12px;font-weight:bold;color:#FFF;padding-left:15px;">
				拖動(dòng)層2
				</div>
				&nbsp;&nbsp;&nbsp;&nbsp;移動(dòng)層
			</div>
		</div>
	</div>
	
	<h2>
		源代碼
	</h2>
	
	<div class="textDiv">
		<textarea id="sourse">
function dragClass(){
	this.mouseState = document.all ? 1 : 0 ;
	this.x;
	this.y;
	this.dragId = null;
	this.index = 100;
	document.onselectstart = function(){return false;};
}
dragClass.prototype = {
	dragStar:function(dragId,moveId){//拖動(dòng)入口函數(shù)
		var _this = this;	
		_this.$(dragId).style.cursor = "move";	
		_this.$(dragId).onmousedown = function(e){
			var e = e ? e : event;
			//_this.$(moveId).style.zIndex = _this.index++;
			if(e.button == _this.mouseState)
			{
				_this.setDragInfo(e,moveId,moveId);
				_this.dragPro(moveId);
			}			
		},
		_this.$(moveId).onmousedown = function(e){
			_this.$(moveId).style.zIndex = _this.index++;
		},		
		_this.$(dragId).onmouseup = function(){
			_this.clearDragId();
		}
		document.onmouseup = function(){
			_this.clearDragId();
		}
	},
	setDragInfo:function(e,dragId,moveId){//拖動(dòng)初始化
		this.x = e.clientX;
		this.y = e.clientY;
		this.dragId = dragId;
		if(this.$(moveId).style.position != "absolute")
		{
			this.$(moveId).style.width = this.$(moveId).offsetWidth + "px";	
			this.$(moveId).style.height = this.$(moveId).offsetHeight + "px";
			this.$(moveId).style.position = "absolute";
			this.$(moveId).style.left = this.$(moveId).offsetLeft + "px";
			this.$(moveId).style.top = this.$(moveId).offsetTop + "px";
		}				
	},
	clearDragId:function(){ //清除拖動(dòng)ID
		this.dragId = null;
	},
	dragPro:function(moveId){
		var _this = this;
		document.onmousemove = function(e){
			var e = e ? e : event;
			if(e.button == _this.mouseState && _this.dragId != null)
			{
				var x = e.clientX;
				var y = e.clientY;
				//_this.$(moveId).style.left = (_this.$(moveId).offsetLeft + (x - _this.x)) + "px";
				//_this.$(moveId).style.top = (_this.$(moveId).offsetTop + (y - _this.y)) + "px";
				_this.$(moveId).style.left = (parseInt(_this.$(moveId).style.left) + (x - _this.x)) + "px";
				_this.$(moveId).style.top = (parseInt(_this.$(moveId).style.top) + (y - _this.y)) + "px";
				_this.x = x;
				_this.y = y;
				//alert(_this.$(dragId).style.left);
			}
			
		}
	},
	$:function(o){//獲取對(duì)象
		if(typeof(o) == "string")
		{
			if(document.getElementById(o))
			{
				return document.getElementById(o);
			}
			else
			{
				alert("errId \""+ o + "\"!");
				return false;
			}
		}
		else
		{
			return o;
		}
	}
}
		</textarea>
	</div>
	
	<h2>
		使用方法
	</h2>
	
  <div class="preview">
		1.把以上代碼引進(jìn)你的頁面 &lt;script type=&quot;text/javascript&quot; src=&quot;dragClass.js&quot;&gt;&lt;/script&gt;<br/>
		2.在頁面的"&lt;/body&gt;"標(biāo)簽前加入以下代碼:<br/>
		<div class="example">			
			&lt;script type=&quot;text/javascript&quot;&gt;<br/>
			window.onload = function(){<br />
	var c = new dragClass();//創(chuàng)建對(duì)象<br />
	c.dragStar(&quot;拖動(dòng)id&quot;,&quot;移動(dòng)層id&quot;);<br />
}<br/>
			&lt;/script&gt;
		</div>	
		其中sd方法中的參數(shù)為:<br/>
			參數(shù)一 "拖動(dòng)id":鼠標(biāo)經(jīng)過時(shí)候鼠標(biāo)樣式變成移動(dòng)樣式模樣的元素的id<br/>
			參數(shù)二 "移動(dòng)層id":即將移動(dòng)的元素的id<br/>	
		<span class="red">3.建議移動(dòng)層是絕對(duì)定位(position:absolute;).</span>		
  </div>
	
</div>
<div class="authorInfo">
	<div class="cont">
		十三妖 ThirdteenDevil <br/>
		[qq:181907667] [msn:wl181907667@hotmail.com] [e-mail:thirdteendevil@163.com]
	</div>
</div>
</body>
</html>

前一頁:兼容IE和FF的收藏本站、設(shè)為首頁代碼

后一頁:漂亮的頁面loading等待頁面特效(3)

相關(guān)閱讀: 深山工作室; 長(zhǎng)春海外旅行社; ASP操作access或sqlserver數(shù)據(jù)庫的函數(shù)庫; 長(zhǎng)城國際集團(tuán)有限公司; 深山旅行社網(wǎng)站管理系統(tǒng) v1.6; Asp.net中防止用戶多次登錄的方法; asp經(jīng)典正則表達(dá)式應(yīng)用收藏; 過濾輸入字符串中的危險(xiǎn)符號(hào)

共有0條關(guān)于《拖動(dòng)效果封裝已經(jīng)修改，適應(yīng)火狐》的評(píng)論: 發(fā)表評(píng)論

正在加載評(píng)論......

返回頂部發(fā)表評(píng)論

呢稱:
表情:
內(nèi) 容:	評(píng)論內(nèi)容:不能超過 1000 字,需審核,請(qǐng)自覺遵守互聯(lián)網(wǎng)相關(guān)政策法規(guī)。
驗(yàn)證碼:

網(wǎng)友評(píng)論聲明,請(qǐng)自覺遵守互聯(lián)網(wǎng)相關(guān)政策法規(guī)。

您發(fā)布的評(píng)論即表示同意遵守以下條款:
一、不得利用本站危害國家安全、泄露國家秘密,不得侵犯國家、社會(huì)、集體和公民的合法權(quán)益;
二、不得發(fā)布國家法律、法規(guī)明令禁止的內(nèi)容;互相尊重,對(duì)自己在本站的言論和行為負(fù)責(zé);
三、本站對(duì)您所發(fā)布內(nèi)容擁有處置權(quán)。

更多信息>>欄目類別選擇: 百度小程序開發(fā); 微信小程序開發(fā); 微信公眾號(hào)開發(fā); uni-app; asp函數(shù)庫; ASP; DIV+CSS; HTML; python

更多>>同類信息: jquery下拉到某個(gè)固定位置然后某些元素發(fā)生改變樣式狀態(tài); canvas繪制的文字如何換行; 兼容pc、移動(dòng)端用js實(shí)現(xiàn)復(fù)制內(nèi)容到剪切板（支持蘋果safari瀏覽器）; js兼容多個(gè)瀏覽器右下角漂浮廣告; 兼容ie6+和火狐的禁止右鍵; 做在線客服時(shí)，聊天窗口的div滾動(dòng)條始終在底部

更多>>最新添加文章: dw里面查找替換使用正則刪除sqlserver里面的CONSTRAINT; Android移動(dòng)端自動(dòng)化測(cè)試：使用UIAutomatorViewer與Selenium定位元素; 抖音直播音掛載小雪花懂車帝小程序; javascript獲取瀏覽器指紋可以用來做投票; 火狐Mozilla Firefox出現(xiàn)：無法載入您的Firefox配置文件它可能已經(jīng)丟失或是無法訪問問題解決集合處理辦法; 在Android、iOS、Windows、MacOS中微信小程序的文件存放路徑; python通過代碼修改pip下載源讓下載庫飛起; python里面requests.post返回的res.text還有其它的嗎

更多>>隨機(jī)抽取信息: 佳達(dá)國際貨運(yùn)代理有限公司; 愛尚學(xué)生網(wǎng); 昌平歡樂之旅旅行社; 文本框禁止方式; javascript實(shí)現(xiàn)圖片預(yù)覽功能; 利用asp正則功能去除網(wǎng)頁中自定義HTML標(biāo)記（來自eWebEditor）

更多標(biāo)簽熱門標(biāo)簽

灰色自動(dòng)獲取點(diǎn)擊偽類豎排獲得商城工具無限貨幣放大強(qiáng)聊適應(yīng) 版權(quán)聲明比例上一頁蓋樓表達(dá)式漸隱深山行者V1.2旅行社網(wǎng)站管理系統(tǒng) 搜索選擇符 weatherxml 拖動(dòng) 管理系統(tǒng) 打字 cpu 加減背景旅行社層 rss JavaScript實(shí)現(xiàn)文本框提示效果 relative display 處理版權(quán) getElementById 靜態(tài) div 翻滾 web2.0 標(biāo)簽首頁憂化驗(yàn)證碼變化表格 checkbox 提交

能看的av_午夜黄色av_在线观看国产视频_天天爱综合_国产精品亚洲成在人线_日韩一

拖動(dòng)效果 封裝 已經(jīng)修改，適應(yīng)火狐

拖動(dòng)效果封裝已經(jīng)修改，適應(yīng)火狐