草庐IT

CSS定位div

全部标签

javascript - 使用javascript设置CSS动画延迟

我的css文件中有一些关键帧动画。已经指定了一个动画延迟。包装器div具有属性数据延迟。我想获取css文件中的animation-delay,并为其添加data-delay的值。然后我希望动画以新的延迟开始。我尝试了ele[i].style.animationDelay。但似乎这会返回null,直到我为其设置一个值。如果我设置ele[i].style.animationDelay='5s'动画仍然会随着css文件的延迟运行。HTMLHitest!CSSbody{font-size:300%;}#wrapperh1{position:absolute;}#hi{transform:tra

javascript - javascript 中的 bg 颜色、悬停、!important 和 .css

我遇到了一个问题。我已经创建了一些“选项卡”功能,如演示中所示:http://jsfiddle.net/4FLCe/计划是,当您将鼠标悬停在选项卡上时,其颜色变为颜色A,当您单击选项卡时,其颜色变为颜色B。从演示中可以看出,单击后悬停时背景颜色停止变化。我想在悬停的背景颜色中添加!important,结果可以看到:http://jsfiddle.net/4FLCe/1/但是这并不像我想要的那样执行,悬停现在可以在javascript设置的背景颜色上工作。然后我将!important添加到javascript中的颜色集。这导致了一些可怕的事情。唯一理解我想要实现的目标的浏览器是Opera

javascript - 在窗口调整大小时调整 div 大小

我有这个代码html,body{width:100%;margin:0;padding:0;}#main{margin:0auto;width:963px;height:642px;}#preload{display:block;position:absolute;width:100%;height:100%;}.loading{position:absolute;top:43%;left:47%;z-index:2;display:none;}$(document).ready(function(){$(window).on('resize',function(){varmaxWid

javascript - 如何选择下一个div?

我在一个页面中多次出现这个部分:Views我现在正在为a.showComment点击事件在js文件中编写代码。现在我想选择下一个div.writeComment。如何选择它? 最佳答案 在变量nextDiv中你可以做任何你想做的事情使用.nextAll()方法允许我们在DOM树中搜索这些元素的后继元素,并从匹配元素构造一个新的jQuery对象。使用.next()搜索您点击的DOM元素试试这个:$('.showComment').click(function(){varnextDiv=$(this).nextAll("div.writ

javascript - Gridster - 保存 div 的 html 内容以动态加载网格

我已经用gridster做了一些测试,我可以保存一些gridster数据,比如坐标、大小、ids等。但我无法保存填充gridster的div的内容,我可以稍后加载每个元素的gridster坐标。这是我的代码:$(document).ready(function(){vargrid_canvas=$("#homepage>#grid").gridster({widget_margins:[10,10],widget_base_dimensions:[140,140],widget_selector:".gs_w",shift_larger_widgets_down:false,seria

javascript - 可在特定的 div 内拖动

我正在从事一个使用了可拖动事件的元素。现在的问题是draggable()事件对我来说效果很好......但是因为我想存储我的位置,所以我使用了以下javascript。这个也很好用......但问题是它适用于整个屏幕。我只是希望它仅通过使用此代码在特定的parentdiv上运行。那有可能吗?function$(el){returndocument.getElementById(el);}vartzdragg=function(){return{move:function(divid,xpos,ypos){vara=$(divid);$(divid).style.left=xpos+'p

javascript - 我可以使用 Javascript 为同一个 CSS 属性设置多个值吗?

我想以编程方式将CSScursor值设置为-webkit-grab和-moz-grab。例如,在样式表中,它将表示为mySelector{cursor:-webkit-grab;cursor:-moz-grab;}所以在这里,mySelector元素定义了两次光标。Webkit浏览器使用第一个定义,Firefox使用第二个。我想知道Javascript中是否有任何方法可以做同样的事情。我意识到我可以设置一个类(class),但我的问题更多是出于好奇,看看是否可行,而不是解决我目前遇到的现实问题。编辑澄清一下-我发布的CSS(尽管有一个有效的选择器)在两种浏览器中都有效。我只是想知道是否

javascript - 在 Div 后面画线

我正在看这个fiddle:http://jsfiddle.net/kDs2Q/45/有没有办法以某种方式对div/行进行分层,以便该行位于其他div的后面?我希望能够从一个div的中心到另一个div的中心绘制一条线,但看不到该线穿过实际的框。这就是我对中心到中心的看法:varoff1=getOffset(div1);varoff2=getOffset(div2);varx1=off1.left+off1.width/2;vary1=off1.top+off1.height/2;varx2=off2.left+off1.width/2;vary2=off2.top+off1.height

javascript - 如何使用 Google Chrome 扩展更改所选文本的 CSS

我正在为使用contextMenus更改所选文本的CSS的Chrome浏览器制作一个扩展程序。但我无法访问HTML结构,即所选文本的parentNode,因为在本例中我可以非常轻松地做到这一点。varselection=window.getSelection();如果在浏览器中默认使用,这将返回所选文本的parentNode,稍后我可以使用它来更改CSS。如何使用Chrome浏览器扩展程序实现这一点? 最佳答案 由于Chrome不允许您使用上下文菜单与您单击的元素进行交互,因此您必须创建一个contentscript存储在页面上被右

javascript - 你怎么能抓取dom中的元素并在没有id的情况下应用不同的css?

我在这里有点困惑。我正在做一个动态元素,我想应用不同的css具有相同类但没有id的div。我如何将不同的css应用到具有相同类的第一个div,然后不同的css到同一类的第二个div等等......假设我将fullwidthContainer类应用于3divs对于第一个div,我想要宽度1000px,第二个我想要800px等等。我不能在这里给出id或其他类,因为它是动态生成的。请帮忙。谢谢。好的,我是用javascript做的functionemphatic(){vartotalContainers=document.getElementsByClassName('fullwidthCo