<select>
<option>FFF</option>
</select>
<div id='pageBase_Div' style='display:none; z-index: 12001; background-color:#FFFF00 ;text-align:center; position:absolute;padding:5px 6px 0px 6px;border:1px solid red;left:0px;top:0px;'>AAAAAAAAAAAAAAAAA</div>
<iframe id="pageBase_iframe" src="javascript:false;" scrolling="no" frameborder="0" style="position:absolute; top:0px; left:0px; display:none;">
</iframe>
JS代码:
<script type="text/javascript">
var pagebase_div = document.getElementById('pageBase_Div');
var pagebase_iframe = document.getElementById('pageBase_iframe');
pagebase_div.style.display = "block";
pagebase_iframe.style.width = pagebase_div.offsetWidth;
pagebase_iframe.style.height = pagebase_div.offsetHeight;
pagebase_iframe.style.top = pagebase_div.style.top;
pagebase_iframe.style.left = pagebase_div.style.left;
pagebase_iframe.style.zIndex = pagebase_div.style.zIndex - 1;
pagebase_iframe.style.display = "block";
</script>
------------------------------------------------------------------------
直接设置绝对定位,设置层。 position:absolute;top:expression(eval(document.body.scrollleft + 50));
分享到:
相关推荐
用DIV模仿SELECT下拉框 function replaceSelects() { try{ for (i=0;i;i++){ // 隐藏 select selects[i].style.display = 'none'; select_divTag = document.createElement('div'); select_divTag.id = ...
"DIV模拟select下拉框"就是一种利用JavaScript库,如jQuery,来实现这一目标的技术。它通过用CSS样式化的DIV元素替换原生的SELECT元素,从而提供更灵活的外观和交互体验。 标题中的"DIV模拟select下拉框"意味着我们...
select ——使用DIV 实现 Select js源码
在网页设计中,有时出于美观或者交互性的考虑,开发者会使用`div`元素来模拟`select`下拉菜单的效果。这种做法通常被称为“div模拟select”。本教程将深入探讨如何利用`div`实现这一功能,并提供一个实用版的示例。 ...
div 模拟 select 多选 实现还有点bug,望大家一起改正。
`div模拟select自定义下拉列表框`是一种常见做法,它利用JavaScript(如jQuery)和CSS来实现,可以提供比原生`<select>`元素更丰富的样式控制和交互体验。本篇将详细介绍这种技术及其应用。 一、为什么使用div模拟...
select 在ie6下覆盖div bug 解决方案。 div 模拟select 单选 在 body onload事件中调用init_select方法就可,参数传相关背景图片就可。我都已经放到资源包下了。
web前端小问题,select 选择事件,当选择select同一值触发onchange事件
在网页设计中,有时会遇到一个常见的问题,即`Div`元素下的下拉菜单(`Select`元素)会被`Div`本身挡住,导致用户无法正常交互。这个问题在标题和描述中提到,我们可以从HTML和CSS的角度来探讨解决方法。 首先,...
本教程将围绕“Div实现仿SelectDemo”这一主题,探讨如何利用jQuery创建一个高度可定制的Select插件。 首先,"Div实现仿SelectDemo"意味着我们不再依赖HTML的Select标签,而是用一个简单的Div元素作为基础结构。...
然后,我们将在`div`内嵌套一个`<select>`元素,并将其`position`设置为`absolute`,这样可以使其脱离正常文档流并定位在`div`的特定位置。 接下来,我们需要用CSS来定制`select`的外观。由于`select`元素在不同...
在这个"div模拟下拉菜单(select)jquery插件.gz"压缩包中,包含的就是这样一个基于`div`和jQuery的自定义下拉菜单解决方案。 首先,`demo.html`是演示页面,它展示了如何在实际项目中应用这个插件。这个页面会包含一...
为了突破这些限制,开发者经常使用`div`和`css`来模拟`select`下拉菜单,以实现更丰富的视觉效果和交互体验。这种技术被称为“div+css模拟select”。 一、为什么使用div+css模拟select? 1. **样式可控**:使用...
在网页设计中,有时我们需要通过不同的交互方式来切换页面上的元素显示,比如通过下拉框(select)的选择来改变div图层的展示。本示例就是利用jQuery库来实现这样的功能,使得用户在select中选择不同的选项时,对应...
在互联网的早期,Internet Explorer 6 (简称IE6) 是一款广泛应用的浏览器,但它的兼容性和渲染机制存在诸多问题,其中一个问题就是“select穿透div”的现象。这个问题在现代浏览器中通常不会出现,但在IE6中,`...
在网页设计中,有时会遇到一个常见的问题,即`div`元素被`select`下拉框遮挡。这个问题主要源于浏览器的默认样式和渲染机制。`select`元素通常具有较高的Z轴顺序(z-index),因此它会覆盖其他层叠元素,如`div`。在...
本文将介绍如何使用CSS和Div来优化SELECT样式,并提供兼容性写法,帮助开发者创建更美观且一致的界面。 首先,我们可以看到一个简单的例子,它使用Div包裹SELECT元素,通过CSS来调整样式。代码如下: ```css ....
jQuery div仿select下拉选项菜单美化获取html jQuery div仿select下拉选项菜单美化获取html jQuery div仿select下拉选项菜单美化获取html jQuery div仿select下拉选项菜单美化获取html
divcss模拟select 下拉框 select 改变样式