Tag: css3

CSS3 / JS在动画期间获取元素的位置

我需要获得元素的位置(使用jQuery) $(“.mydiv”).position().left; 但是我需要在css3 translate animation期间这样做。 div位置的此动画转换包含在position()数据中。 是否有可能在动画期间获取元素的位置,但是没有任何翻译的位置(就像没有动画一样)?

使用CSS3 rotate属性时jQuery .position()奇怪

我正在使用jQuery .position()方法绝对定位旋转元素位置,然后使用jQuery .css(pos)设置与位置相关的属性(顶部,左侧.css(pos) ,其中pos是.position()返回的数据。 我认为它会把元素留在它的位置,但元素的位置正在发生变化。 如何使用设置旋转元素位置,以便它按预期放置? 也许有一个系数取决于改变位置的角度? 我正在使用谷歌Chrome v.9,Windows XP进行测试。 HTML CSS #container { position: relative; border: 1px solid #999; padding: 5px; height: 300px; width:300px; } #element { position: absolute; top:50px; left: 60px; width: auto; border: 1px solid #999; padding: 5px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); } JS $(document).ready(function(){ var $el = $(‘#element’), // getting position […]

检测背景大小的支持:封面

什么是检测CSS3 背景大小支持的保存方式:封面 ,特别是在IE <9? 以下测试在IE <9中返回误报,因为它实际上设置了背景大小以涵盖 : div.style.backgroundSize = ‘cover’; 测试时我得到的唯一真实结果: if (‘backgroundSize’ in div.style) 但根据网站http://www.standardista.com/css3/css3-background-properties/#bg11,IE 6/7/8应该返回auto ,只支持cover和contains。 编辑: 我想使用我自己的解决方案,但我检查了Modernizr使用的代码 。 似乎他们使用相同的技术,在IE <9中设置假阳性结果:设置backgroundSize =’cover’ ,然后检查style.backgroundSize ==’cover’ 。 看我的JSFiddle 。

垂直和水平居中div没有定义的高度

我想在页面的中心显示一个div,而不必为元素定义一个设置高度,以便高度动态地适合页面的内容。 这可能吗? 我愿意使用JS / jQuery解决方案,只要它们有优雅的后备,但我更喜欢纯CSS解决方案。 这是我当前的代码,它将以div为中心,但我必须包含一个高度。 HTML Lorem ipsum dolor sit amet, minim molestie argumentum est at, pri legere torquatos instructior ex. Vis id odio atomorum oportere, quem modo fabellas sit at, dicat semper est ne. Apeirian detraxit pri eu. No solum accusam has. Ius ne harum mundi clita, eu pro tation audiam. CSS .card […]

使用jQuery关闭CSS3动画?

我有一个加载页面时有动画的对象: .logo-mark { -webkit-animation: spin 2s 1 cubic-bezier(0.000, 0.000, 0.230, 1.000); -moz-animation: spin 2s 1 cubic-bezier(0.000, 0.000, 0.230, 1.000); -ms-animation: spin 2s 1 cubic-bezier(0.000, 0.000, 0.230, 1.000); animation: spin 2s 1 cubic-bezier(0.000, 0.000, 0.230, 1.000); } 在某个时候,我希望JavaScript打开一个无休止地发生的特定动画,直到JavaScript停止所述动画。 所以我只创建了另一个名为.logo-load的类,并且在某些时候,jQuery执行了一个addClass和一个removeClass。 .logo-loading { -webkit-animation: spin 4s infinite linear; -moz-animation: spin 4s infinite linear; -ms-animation: spin 4s infinite linear; […]

对齐Jquery移动标题标题

只是想知道是否有人知道如何覆盖Jquery移动设备中的默认行为以将标题标题左对齐并保持相同的格式。 我似乎无法让它排队。 这就是我所拥有的: Add New Record Cancel Submit 现在,这成功地将标题移到左侧,但文本不保持相同的格式。 它变大了,间距都错了。 有没有人有任何成功左对齐标题? 提前致谢。 对不起,如果这是一个菜鸟问题。 我刚刚从原生移动应用程序转移到Web …

CSS媒体查询作为浏览器resize?

我认为CSS媒体查询不起作用,因为用户调整浏览器的大小? 用户必须刷新页面才能使媒体查询生效? 如何使用JS更新媒体查询? 目前我在resize时使用JS检测窗口大小添加addClass()

适用于所有设备的HTML5应用的媒体查询

任何人都有想法,关于所有有助于检测单个设备的媒体查询,例如: iOS,iPhone 5,iPhone Ratina显示屏,Android手机。 ,iPad,平板电脑atc?

CSS垂直进度条

垂直进度条 这个酒吧的正确造型需要: 进度条必须由包含多个横条的元素覆盖。 没有图像(即使用横条的图像)。 进度条必须连接到原点的底部,并向上延伸。 最重要的是,进度条的包装宽度必须保持动态(%),而不是静态定义。 条形图的宽度根据其容器组件的宽度而延伸 纯CSS解决方案是最好的,但JQuery是公平的游戏。 进度条HTML: attendance JS Fiddle包括HTML标记和所有CSS类: http://jsfiddle.net/q2SAK/ 我的进步: http://jsfiddle.net/q2SAK/2/ 奖金: 我为每个交叉开关实现了唯一的类,以实现上面显示的它们之间的增加的边距。 如果您知道如何在没有类的情况下实现效果,请竖起大拇指。 在你的JS小提琴中显示它。

是否可以旋转单词的字符而不是使用css3旋转整个单词

我试图使用onload窗口事件转换div文本。 我知道transform: rotate(360deg) scaleX(-1); 使整个单词旋转,但我需要旋转文本字符并在加载时将它们返回到相同的位置。 我的小提琴,并在mysite初始化它 将答案标记为正确。仍然需要更好的答案!