草庐IT

CSS定位div

全部标签

javascript - div 完成动画后的事件?

如何让函数在某个元素完成动画后运行?这是一个像动画一样的向下滑动,元素是隐藏的,当点击某些东西时,它会通过向下滑动它的内容(+高度)而变得可见。我无法控制那个元素的动画函数,所以我不能使用$.animate函数的回调选项...现在我有类似的东西$('.trigger').click(function(){//哪个有用,但我不喜欢,感觉很老套 最佳答案 如果您使用的是jQuery1.5+,则可以使用jQuerypromise()方法:http://jsfiddle.net/rGBk7/例如/*doanimation*/$("div")

javascript - 如何以编程方式将 CSS 定义应用于整个页面?

我确定信息已经存在,但我找不到;抱歉:-/我想使用JavaScript创建CSS规则,并将它们应用到整个页面,就好像它们在文档头部的样式元素中一样。我不想通过生成CSS文本来实现-我想将规则保留为我可以更改的实体(JavaScript变量),从而在以后更改页面的外观。任何帮助将不胜感激! 最佳答案 我找到了我想要的:http://www.javascriptkit.com/dhtmltutors/externalcss3.shtml.(感谢所有回答和评论的人。我想要的——并最终找到了,见上面的链接——是一个实际的CSS规则对象,我可

像 css3 转换一样的 Javascript

我想做一些类似-moz-transition的效果,给我一个动画旋转图片。或将图片从包装底部移到顶部。为了阐明我想要的方式,请看一下ThisLink并查看slider下方的四张图片。它使用-moz-transitionCSS3效果,但我想用js或jQuery来制作动画,即使在IE中也是如此。有插件吗?非常感谢 最佳答案 jQuery的.animate()将以跨浏览器的方式执行此操作。$('.button').animate({top:'-=50'},400); 关于像css3转换一样的J

javascript - 使用 jQuery 或 JavaScript 绑定(bind)到自定义 CSS 动画结束事件?

我们对同一个对象有多个动画。当每个动画结束时,我们需要采取不同的操作。现在,我们绑定(bind)到webkitAnimationEnd事件,并使用粗糙的if/then语句以不同方式处理每个动画。有没有一种方法可以从根本上创建自定义webkitAnimationEnd事件,从而允许我们在特定动画结束时触发特定事件处理程序?例如,在animation1结束时触发handler1,在animation2结束时触发handler2。我们正在为Webkit浏览器构建,特别是MobileSafari。谢谢! 最佳答案 对于一个简单的事件触发器,

javascript - 如何根据百分比获取 div 位置?

使用这段代码,您可以获得基于像素的div位置。$('#div').position();但是如何根据百分比给div位置呢? 最佳答案 使用窗口大小。varposition=$('#div').position();varpercentLeft=position.left/$(window).width()*100;varpercentTop=position.top/$(window).height()*100;此代码将为您提供顶部和左侧的位置百分比。 关于javascript-如何根据

javascript - 使用旋转/缩放/平移在 Google map 上定位图像

我正在开发一个用于在谷歌地图上定位图像的用户界面。我从:http://overlay-tiler.googlecode.com/svn/trunk/upload.html开始这非常接近我想要的。但是我想要一个旋转工具、一个缩放工具和一个平移工具(后者存在)而不是3个接触点。我尝试添加一个旋转工具,但它没有像我预期的那样工作:我在左下角放了一个点来控制旋转(围绕图像的中心)。鼠标拖动控制点,我计算其他3个点。我的代码基于mover对象,但我更改了onMouseMove函数:overlaytiler.Rotater.prototype.rotateDot_=function(dot,the

javascript - 屏幕旋转时 WKWebView CSS 渲染问题

首先,所有可能的iOS版本上的UIWebView都可以完美运行,所以这是一个特定的WKWebView问题。在我完成WKWebView的实现后,我遇到了一个巨大的图形错误/问题。在纵向模式下,我的应用程序运行良好,但是当我将它旋转为横向时,会发生一些奇怪的事情,我的页眉和页脚无法正确呈现。如果我查看我的网络代码,我可以看到DOM中的CSS宽度正在使用正确的数据进行更新,但我只能看到页眉/页脚的纵向宽度(320px),即使它显示为style=“width:568px;”在DOM中。我正在使用positioning:fixed但如果我更改为positioning:relative它会在屏幕旋

javascript - 相对于鼠标定位图像/背景图像

我想知道动画图像(或背景图像)相对于鼠标的位置的有效方法是什么。以Github为例:https://github.com/thispagedoesntexist这是一个非常性感的404页面。我想对我的用户产生影响,我认为这肯定会影响。问题1)如何做到这一点?2)只是CSS?CSS和JS?3)最后,有这样的库吗? 最佳答案 这是使用名为Plax的jQuery插件制作的. 关于javascript-相对于鼠标定位图像/背景图像,我们在StackOverflow上找到一个类似的问题:

javascript - 带有CSS动画的Jquery removeClass不起作用

我有以下表格行背景的css规则,tr.unread{background:rgba(237,239,245,0.70)nonerepeatscroll00;-webkit-transition:background1slinear;-moz-transition:background1slinear;-o-transition:background1slinear;transition:background1slinear;}我想从tr中删除带有淡出动画的.unread类(如果可能,不使用Javascript/Jquery)。但它只是删除了没有任何动画的类。Javascript:$('

javascript - 获取关于在 contenteditable div 中拖动图像的通知

我有一个div,它有contenteditable="true"并且包含一些html。此html可能包含图片。由于contenteditable="true"用户可以通过将图像拖动到新位置来移动它们。但是我需要在每次移动图像时通知我的代码,以一种我同时获得正在移动的图像元素和放置图像的目标节点的方式。我该怎么做?我当前的解决方案向我的div元素添加了一个Drop监听器,它是contenteditable,然后每次用户移动图像时我都会收到一个drop事件,但我无法获得包含用户移动的图像的dom节点.另外:拖动图像,似乎是复制DOM节点,而不是移动它。这是真的?(在Firefox中测试)。