草庐IT

CSS定位div

全部标签

javascript - CSS/HTML5 :hover state remains after drag and drop

我正在使用html5的拖放功能在屏幕上重新排列dom元素-我在执行此操作时将css行为附加到拖放的各种状态,但我遇到的问题是悬停状态保持均匀在我拖放和鼠标移出DOM元素之后。这是我的代码:JavaScript:functionaddDragListeners(){$('.segmentListItem').each(function(index){$(this)[0].addEventListener('dragstart',handleDragStart,false);//rolloverforcurrent$(this)[0].addEventListener('drop',han

javascript - Dynamicpage div 在加载新内容后不久闪烁

我正在使用动态页面脚本通过Ajax将内容加载到我的页面中。除了1期外,一切正常。我有一个页面,其中的div彼此堆叠在一起例如:header-banner-nav-content-likebox-twitterwidget-footer。如果我更改页面,例如,如果我从家里去联系,然后我会看到我的likebox和twitterwidget在不到一秒钟的时间内转到页面顶部(导航下方)。之后一切都正确加载,但是在显示联系页面之前看到框在顶部闪烁很烦人。如何修改dynamicpage.js脚本,使其不会很快将内容下方的div移动到顶部?这是我的脚本:$(function(){varnewHash

javascript - MSIE9 -- 当同时调整宽度和填充的 CSS 时,输入/文本区域中的文本不服从当前填充

我有一个简单的脚本,可以分别在focus/blur的文本区域/输入中添加和删除padding-left。这是为了在字段左侧为一个绝对定位的小按钮腾出空间,而不会阻挡其下方的文本。[编辑]它还同时更改元素的宽度,以保持block的总大小一致。在几乎所有浏览器中,这都工作得很好,但MSIE9除外。[编辑]尽管框保持相同大小,表明两个属性的CSS已正确更新,但输入/文本区域中的文本表现得好像填充没有改变。我知道focus/blur事件的回调会正确触发和更新DOM对象的样式属性,因为获取属性的当前值总是会为您提供预期的值。即varfield=$(field);field.css({'paddi

javascript - 调整大小的 CSS 调整大小句柄 : both property

我正在使用CSS3属性:resize:both;overflow:none;这会在元素的右下角放置一个调整大小的handle。我的第一个问题是:我可以使用这个CSS属性在元素上放置其他句柄吗?即我可以在右边缘放置一个handle吗?我知道这并不总是有效,除非元素是绝对定位的。第二个问题是:我可以将handle的样式设置为更适合我的应用程序吗?我不能使用可调整大小的jQuery;我用我正在尝试做的事情(CKEditor中的Div)对其进行了测试,但它不起作用。如果没有人能解决上述问题,也许可以使用替代插件? 最佳答案 看看这个帖子也是

javascript - 没有提示的地理定位

我知道HTML5的地理定位方式,但需要注意的是它必须提示用户获得许可。navigator.geolocation.getCurrentPosition当我想直接在主页上进行地理定位以根据位置提供定制内容时,这变得特别烦人:没有人喜欢在他或她每次访问您的网站时都得到提示。想法是使用外部服务根据IP地址或类似的东西进行地理定位,以不太准确地估计用户的位置,并仅在该位置确实不在时才提示用户。关于我可以为此目的使用的服务,有什么好的建议吗?我知道Google已经这样做了:currentlocation.它会显示您当前的位置,而不会给您任何提示。有谁知道如何做到这一点?MaxMind数据库很好,

javascript - Ajax 响应后无法重新触发 CSS 3 动画

这是一个HTML表单:Username:Password:这里是调用的JavaScript函数的相关代码if(xmlhttp.readyState==4&&xmlhttp.status==200){if(xmlhttp.responseText)document.getElementById("loginForm").submit()else{document.getElementById("report").style.webkitAnimationName="";setTimeout(function(){document.getElementById("report").styl

javascript - 移动设备上的 100% 高度和 CSS

我敢肯定这个问题以前有人问过,但我找不到任何非常相似的东西(有些问题略有相似)移动浏览器的趋势是在您向下滚动时隐藏地址栏,这很好,但对于严重依赖基于百分比的元素高度的网站来说存在问题,例如我现在制作的响应式网站。问题是,视口(viewport)大小会根据地址栏的可见性而变化。意思是,地址栏不可见时的100%高度大于其可见时的大小。当您滚动时,这会导致网站重新配置不稳定。这在移动版GoogleChrome上尤其成问题,因为每当您在页面中的任何位置向上滚动时,地址栏都会返回。大量不稳定的重新配置。我希望100%在没有地址栏的浏览器中表示100%。无论我采取什么解决方案,它都需要一些Java

javascript - 3D CSS 变换 : translateZ causes elements to disappear in Chrome

我正在使用Javascript在Chrome中操作CSS转换,我注意到当translateZ值变得太低(很远)时,元素将会消失。这似乎只有在有大量元素时才会发生。这似乎与元素的z-index有关。这是问题的一个例子:http://jsbin.com/iZAYaRI/26/edit将鼠标悬停在输出上以查看问题。有人知道为什么会这样吗?更新:看起来该元素并没有真正消失,而是移动了一千个像素左右。 最佳答案 在我的例子中,z平移属性大约为零。将我的零翻译从0更改为1解决了我的问题。在safari中运行的原始代码:transform:sca

javascript - 如何使同步两个 Divs 滚动位置更平滑

我正在尝试同步两个可滚动的DIVS滚动位置。遵循的方法:Method-1:on-scroll事件设置其他DIV的scrollTop。问题:滚动事件最后执行,UI在iOSSafari中缓慢。Method-2:使用setInterval来同步两个滚动位置。问题:iOS在滚动期间不执行定时器功能,所以滚动位置在最后同步。同样,这更加缓慢。尝试过,许多博客中提到的计时器已修复,但仍然没有优雅。Method-3:尝试自定义滚动条,所以iScroll并尝试在scroll事件上同步两者,问题:这看起来好多了,但在iOS中仍然很慢!!!Method-4:尝试自定义滚动条,所以iScroll并尝试在sc

javascript - 如何通过 url 重写在 Web 元素中正确缩小/合并 CSS/JS

我已经努力了好几个小时,试图设置真正重写url的适当缩小。我用过useref和usemin,它们在扫描html、聚合所有JS和CSS并输出到一个文件方面做得很好。但是,对于我来说,我无法使url重写以正常工作。我的结构很简单:\rootindex.htmlapplication.css//minifiedapplication.js//minified\vendor\bootstrap\fonts//fontfilesherebootstrap.css//pre-minifiedbootstrap.css使用相对url引用字体文件-font/bootstrap_font.ttf当boo