`

可移动div弹出层

 
阅读更多
			function showTitle(event, objTitle) {
				var oEvent=arguments[0] || window.event
				create_dv(oEvent);
				$("newDiv").innerHTML = objTitle;
			}
			
			function clearTitle(divId) {
				$("newDiv").style.display="none";;
			}
			function create_dv(oEvent){
				var divObj = document.getElementById

("newDiv");
				if(divObj == null) {
					dv=document.createElement("div");
					dv.setAttribute("id","newDiv");
					with(dv.style){ 		
						width="300px";//表格宽度
						height="16px";//表格高度
						zIndex=10000;
						position="absolute";
						backgroundColor="#fff";//

背景颜色
						border="1px #aabbff  

solid";
						fontFamily="Tahoma, 

Verdana";
						fontSize="12px";
						lineHeight="18px";
						padding="1px";
						
						filter="Alpha

(Opacity=80)";
					} 
					document.body.appendChild(dv);
				}
				postion_dv(dv, oEvent);
			}
		function postion_dv(dv, oEvent){
			
			MouseX=oEvent.clientX;
			MouseY=oEvent.clientY;
			popWidth=dv.clientWidth;
			popHeight=dv.clientHeight;
			if

(MouseX+12+popWidth>document.documentElement.clientWidth)
			 	popLeftAdjust=-popWidth-30; 
			 else 
			 	popLeftAdjust=0;
			if

(MouseY+12+popHeight>document.documentElement.clientHeight)
			 	popTopAdjust=-popHeight-20; 
			else
				popTopAdjust=0;
			

dv.style.left=MouseX+document.documentElement.scrollLeft+popLeftAdjust+"p

x";	
			

dv.style.top=MouseY+12+document.documentElement.scrollTop+popTopAdjust+"p

x";
			dv.innerHTML="loading...";
			dv.style.display="block";
		}

 

分享到:
评论

相关推荐

    div弹出层打包,包括弹出图片浏览

    在网页设计中,"div弹出层"是一种常见的交互元素,用于展示额外的信息或功能,如图片预览、对话框、表单等。这个压缩包文件"div弹出层打包,包括弹出图片浏览"提供了一套解决方案,帮助开发者轻松实现这种效果。以下...

    div弹出层

    在网页设计和开发中,"div弹出层"是一个常见的交互元素,用于提供额外的信息、显示警告、进行用户确认操作等。"div弹出层"实际上是一个基于HTML `<div>` 元素构建的浮动窗口,它可以在用户与页面交互时临时出现在...

    漂亮的js可移动弹出层

    "漂亮的js可移动弹出层"是利用JavaScript和jQuery技术实现的一种增强用户体验的交互设计。这种弹出层不仅美观,而且具有可移动性,允许用户根据需要自由调整其在屏幕上的位置。 JavaScript,简称JS,是一种轻量级的...

    JS做的隐藏与显示DIV可拖动弹出层

    在"JS做的隐藏与显示DIV可拖动弹出层"这个实例中,我们将探讨如何利用JavaScript来创建一个可拖动的弹出层,并控制其显示与隐藏。 首先,让我们理解`div`层的隐藏与显示。在HTML中,我们创建一个`div`元素并为其...

    泽元div 弹出层,弹出框

    div弹出层** 在HTML中,`<div>`是一个通用的容器元素,可以用来组织页面结构。在实现弹出层时,我们通常会创建一个隐藏的`<div>`,然后通过JavaScript将其显示在页面上。这个`<div>`可以包含任何内容,比如文本、...

    div弹出层position属性小解

    ### div弹出层position属性小解 在网页布局与设计中,`position` 属性是 CSS 中一个非常重要的属性,它决定了元素如何在页面中定位。对于创建弹出层、模态框等交互式组件来说,正确理解并使用 `position` 属性至关...

    div弹出层 jquery

    在网页设计中,"div弹出层"是一种常见的交互元素,用于显示临时信息或与用户进行交互。jQuery库因其简洁的API和强大的功能,成为实现此类效果的首选工具。本主题将深入探讨如何利用jQuery来实现十种不同的弹出层效果...

    一个不错的DIV弹出层

    在网页设计中,"DIV弹出层"是一种常见的交互元素,用于显示临时信息或与用户进行交互。这个“一个不错的DIV弹出层”项目显然旨在提供一个简洁且高效的解决方案。让我们深入探讨一下这个主题,以及它与jQuery的关系。...

    Div 弹出 DIV移动 遮罩层 Div对话框 Div窗口

    Div 对话框 可移动 可设遮罩层 可以同时打开多个对话框,JS源代码

    div css移动鼠标改变样式弹出div层

    首先,我们需要创建两个`div`元素:一个作为主内容区域,另一个作为弹出层。在HTML中,可以这样编写: ```html <div class="container"> <div class="content">主内容区域</div> <div class="popup" style=...

    JS弹出层,js弹出DIV效果源码下载

    在网页交互中,弹出层和弹出DIV效果是常见的功能,它们可以用来显示通知、警告、对话框或者进行用户交互。本资源提供的"JS弹出层,js弹出DIV效果源码下载"是一个运用JQUERY库实现的此类效果。 jQuery是一个广泛使用...

    弹出div拖动层

    标签中提到的“动画”是指在div弹出和关闭时可能加入的过渡效果。这可以通过CSS3的transition属性实现,比如设置`opacity`(透明度)和`transform`(变换)属性的过渡,使得div的出现和消失更加平滑。此外,还可以...

    js弹出层居中可移动

    ### JS弹出层居中可移动技术解析 #### 一、引言 在网页开发过程中,弹出层(Modal)是一种常见的交互设计模式,用于在当前页面上展示额外的信息或功能,而无需重新加载页面。其中,弹出层能够居中显示并且可以被...

    js弹出层table运用

    本话题将深入探讨如何利用JS实现一个可移动的弹出层,并在其中嵌入表格功能。 首先,我们来理解“弹出层”。弹出层通常是通过JavaScript动态创建的DOM元素,比如`<div>`,然后通过CSS设置其位置、透明度和可见性。...

    弹出可移动的div层

    标题中的“弹出可移动的div层”是指在网页开发中实现一个可移动的浮动对话框或提示框的技术。这种技术通常用于创建模态窗口、弹出菜单或自定义警告,让用户与页面上的特定内容进行交互。在网页设计中,div(division...

    js实现div弹出层的方法

    在JavaScript中,实现一个div弹出层是一项常见的任务,特别是在构建交互式Web应用时。本篇将详细解析如何使用原生JavaScript来创建一个功能完备的div弹出层,包括使其可拖拽、可关闭,并允许用户自定义显示效果。 ...

    jquery 弹出层跟随鼠标移动

    当用户鼠标移到特定位置时,我们需要动态地创建弹出层(通常是一个包含信息的div元素)。这可以通过 `jQuery()` 或 `$()` 函数创建新元素,然后使用 `.html()` 方法填充内容,最后用 `.append()` 或 `.prepend()` ...

    可拖动的弹出层提示效果.rar

    本案例中的“可拖动的弹出层提示效果”是一个利用JavaScript(JS)实现的功能,它允许用户通过鼠标拖动来改变弹出层的位置,提升用户体验。这一技术在网页应用、移动应用以及桌面应用中都有广泛应用。 “JS特效-...

    简单实用的jquery可拖动弹出层,遮罩层

    当用户按下鼠标并在弹出层上移动时,计算偏移量并相应地更新弹出层的位置。 4. **显示和隐藏**:编写函数以控制弹出层和遮罩层的显示和隐藏。这可能涉及改变元素的CSS属性,如`display`或`visibility`。 5. **交互...

    jquery弹出层鼠标点击弹出层可浮动在屏幕滚动

    `使弹出层固定在屏幕某个位置,即使页面滚动也不会移动。 3. **jQuery事件绑定**:使用`$(document).ready()`确保DOM加载完成后执行代码。在需要触发弹出层的元素(如文字或图片)上绑定`click`事件监听器。例如,`...

Global site tag (gtag.js) - Google Analytics