`
annan211
  • 浏览: 460917 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

小悬浮窜口 div

阅读更多
<div class="confirmimage-ctn">
			          <h3>层级树</h3>
			          	<div  style="float:right;margin-right:130px;">
							<p class="dtTree_btn"><a href="javascript: dtTree.openAll();">打开树列表</a> | <a href="javascript: dtTree.closeAll();">关闭树列表</a></p>
								<div class="intermediaryTree-ctn">
								</div>
						<div class="clearfix"></div>
					</div>
			          <span class="icon"></span>
		        </div>


下面是样式表
  	.confirmimage-ctn{
	position:absolute;
	bottom: 450px;
	right: 600px;
	width:400px;
	padding:5px;
	border:3px solid #666;
	height:300px;
	background-color: #fff;
}
	.confirmimage-ctn h3{ font-size:16px; padding-bottom:5px; border-bottom:2px solid #eee; margin-bottom: 10px}
	.confirmimage-ctn li{float:left; width:200px; text-align:center; height:125px; }
	.confirmimage-ctn .icon{
	position:absolute; top:135px; left:-33px;
	border-width: 15px;
	border-style: solid;
	border-color: #F8F8F8 #666 #F8F8F8 #F8F8F8;
}
  • 大小: 13.8 KB
分享到:
评论

相关推荐

    四种悬浮DIV提示效果

    四种悬浮DIV提示效果四种悬浮DIV提示效果四种悬浮DIV提示效果四种悬浮DIV提示效果四种悬浮DIV提示效果

    悬浮固定DIV悬浮固定DIV

    在网页设计中,"悬浮固定DIV"是一种...文件列表中的`悬浮DIV.html`很可能是包含上述HTML、CSS和JavaScript代码的示例文件,用于展示悬浮固定DIV的实现效果。你可以下载这个文件并用浏览器打开,查看并学习其工作原理。

    div悬浮在canvas上

    &lt;div class="floating-div"&gt;悬浮的div&lt;/div&gt; &lt;canvas id="myCanvas"&gt;&lt;/canvas&gt; ``` 3. **JavaScript交互**: 如果需要在canvas上进行动态交互,比如点击canvas时检测是否与div重叠,或者让div跟随鼠标移动,...

    DIV滚动悬浮层(滚动条动,层不动)

    在网页设计中,"DIV滚动悬浮层"是一种常见的交互效果,它使得某个元素(通常是一个包含重要信息或功能的div)在用户滚动页面时始终保持在屏幕的特定位置,提供持续的可视性和可访问性。这种效果可以用于侧边栏菜单、...

    悬浮DIV层(javascript实现)

    当页面滚动条滚动到某个高度时,div开始悬浮,当页面滚动到底部时停止浮动,高度记录为最后的浮动高度.

    磁悬浮DIV制作过程资料.rar

    磁悬浮技术在日常生活中主要应用于高速列车等领域,但在这个场景中,我们讨论的是一个与网页设计相关的主题——“磁悬浮DIV”(Floating DIV)。在网页设计中,DIV元素是一种非常重要的布局工具,它允许开发者通过...

    悬浮DIV弹出窗体实现登录

    在网页设计中,"悬浮DIV弹出窗体实现登录"是一种常见的交互设计手法,它能够为用户提供更加便捷和美观的登录体验。这种设计通常将登录表单以浮动窗口的形式展示,用户无需离开当前页面就可以完成登录操作,提升了...

    Div 悬浮层 Demo

    在网页设计中,"Div 悬浮层"是一种常见的元素,用于实现类似广告的效果,它通常出现在页面的右下角,并能以动画形式渐渐弹出,吸引用户的注意力。Div是HTML中的一个布局容器,用于组织网页内容,而悬浮层则是通过CSS...

    悬浮层div

    在网页设计中,"悬浮层div"是一种常见的交互设计元素,它主要用于提供额外的信息或功能,当用户将鼠标悬停在某个元素上时,该div会像浮现在页面上一样出现。这种效果可以用于提示、菜单、广告或其他交互式内容。下面...

    jquery实现div悬浮中央的效果(原创)

    在另一段提供的代码中,还进行了一个小优化:在窗口大小变化时,先隐藏`&lt;div&gt;`,再重新计算位置,最后再次显示。这样做是为了避免页面重绘,提高性能。 ```javascript if ($("#checkBookingInfo").is(":visible")) ...

    js鼠标浮动显示div

    在JavaScript(JS)中,"鼠标浮动显示div"是一种常见的交互设计,通常用于创建提示框、下拉菜单或工具提示。这种技术的核心是利用事件监听器来捕捉鼠标的移动,并根据鼠标的移动来控制div元素的显示与隐藏。在本案例...

    jquery.实现div悬浮

    在网页设计中,"div悬浮"是一种常见的效果,它使得某个div元素在用户滚动页面时始终保持在屏幕的特定位置,通常用于侧边栏导航、广告条或其他需要固定显示的元素。这个实例是基于jQuery库来实现的,jQuery是...

    DIV悬浮-纯CSS实现.html

    纯CSS实现的DIV悬浮效果,兼容常用的浏览器:IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗等。

    悬浮右下角div

    悬浮右下角的div

    用div实现悬浮窗+锁屏(防弹出窗体)

    在"悬浮窗"的实现中,通常会创建一个`div`作为弹出窗口的容器,然后使用CSS定位使其悬浮在页面的特定位置。这可以通过设置`position`属性为`absolute`或`fixed`,并调整`top`, `bottom`, `left`, 和 `right`属性来...

    css+div悬浮.zip

    本教程通过“css+div悬浮.zip”压缩包中的示例,着重讲解如何利用CSS和div元素来创建一个始终位于右侧底部的悬浮效果,这一效果在网页中常见于“返回顶部”的按钮或者侧边栏广告。 首先,我们来理解CSS的定位属性...

    网页上自由运动的小球div,处于页面顶层,鼠标悬浮静止

    本话题将探讨如何在HTML中创建一个自由运动的小球div,并让它在鼠标悬浮时停止运动,始终保持在页面的顶层,即使页面滚动也不会受到影响。 首先,我们需要创建一个基本的HTML结构,包含一个小球div元素。这个div将...

    纯js实现可拖拽和点击的悬浮球

    &lt;div id="draggableBall" class="ball"&gt;悬浮球&lt;/div&gt; ``` 接下来,我们需要编写CSS来定义悬浮球的样式,例如圆角、颜色和位置: ```css .ball { width: 50px; height: 50px; border-radius: 50%; background-...

    div层悬浮窗和锁屏

    在网页设计和开发中,"div层悬浮窗和锁屏"是一个常见的需求,尤其是在构建交互式用户界面时。Div层通常被用作HTML布局的基本构建块,可以用来创建各种元素,如弹出框、提示信息或者浮动窗口。悬浮窗则是指在用户滚动...

    微信小程序中悬浮窗功能的实现代码

    微信小程序实现悬浮窗功能涉及到的几个关键知识点包括小程序的基础组件使用、定位方式(fixed定位)、事件处理(拖拽和点击事件)以及特定场景下的兼容性处理方法。 首先,了解微信小程序中“悬浮窗”的含义。在...

Global site tag (gtag.js) - Google Analytics