草庐IT

4.CSS盒子模型

全部标签

javascript - 自定义 Webpack CSS-loader "localIdentName"查询标记占位符?

我是Webpack的新手,一直在玩弄css-loader。OntheGithubpageunder"LocalScope"有关于使用您自己的自定义值指定localIdentName查询标记的信息,例如:[path][name]---[local]---[hash:base64:5]。这个标签允许我们指定类在被处理后应该如何命名。我们是否可以为此查询标记定义我们自己的自定义值占位符,即css-loader?localIdentName=[MyCustomMethod]-[hash:base64:5]? 最佳答案 我认为不可能在那里放置

javascript - AngularJS 1.4.8 - 选择中的 ngOptions - 当我在 ngOptions 中的选项之前以编程方式设置模型时无限 $digest() 循环

我在从1.2.14迁移到1.4.8时遇到了这个问题。这在1.2.14中工作正常,但我在1.4.8中得到无限的$digest()循环。这是一个Fiddle证明问题。Fiddle比这篇文章更容易看,但它让我包含代码我有一个select看起来像这样的元素:我的选项是对象,像这样:$scope.options=[{id:1,label:'one'},{id:2,label:'two'}];我想为ngOptions指令提供的选项数组取决于条件;有时我只想给它$scope.options,但有时我想包括另一个选项。$scope.getOptions=function(){if($scope.sho

javascript - CSS动画宽度从右到左,高度从下到上

我正在尝试解决从右到左扩展div的宽度以及从下到上扩展不同容器的高度的问题。我正在尝试创建将在正方形中旋转并模仿此处边界的CSS动画是指向我的CodePen的链接https://codepen.io/Archezi/pen/xReqvq?editors=0100如果有帮助的话。这是我的HTML.container是一个主要的包装器.circle是一个动画line1-line4是我要制作动画的方形边框。这是我的CSSbody{margin:0auto;}.container{position:relative;margin:50pxauto;width:800px;height:800p

javascript - 如何绑定(bind)CSS动画持续时间滚动

我想制作类似这样的网站,您可以在其中向下滚动,滚动时会跟随一些动画,如果您向上滚动,它会反转。我看到了一些像this这样的库但我想看看是否可以用更简单的方法来完成?谢谢$(document).ready(function(){varlastScrollTop=0;$(document).scroll(function(event){varst=$(this).scrollTop();if(st>lastScrollTop){$('div').removeClass('scrollUp').addClass('scrollDown');}else{$('div').removeClass

javascript - CSS 背景图像转换使视频标记缓冲区

我有一个视频标签,我想连续播放,而用户可以同时在网站上做一些事情。但是我发现,如果视频开始缓冲的背景图像之间的背景转换。我在下面的代码片段中有一个可运行的示例。注意:如果代码段正常运行,缓冲似乎不会发生,但如果将代码段放在“整页”中,缓冲就会发生。functionchangeBackground(){constrandomColor='#'+Math.floor(Math.random()*16777215).toString(16);constelement=document.getElementById('background');constcurrentOpacity=eleme

javascript - 如何计算与 CSS3 创建的边框半径匹配的曲线上的点?几何天才?

我有一个用css3边框半径(图像部分)创建的弯曲div。我旁边有文本行,我想将其与曲线对齐20px左右,就像这样(不能发布图片,不记得旧登录名):诀窍是曲线会根据窗口大小而变化,因此我希望能够计算曲线上文本应该偏移的点,本质上是创建一个真正的手动文本换行。最终我需要能够使用javascript进行计算和更新。(根据下面的评论编辑添加):用于演示目的的曲线css是border-bottom-left-radius:316px698px;但这是根据脚本的页面大小计算的。另外,值得一提的是,我根本不需要支持IE或FireFox——只需要webkit(独立信息亭应用程序)。

javascript - 没有集合的主干模型。向服务器发送重复数据?

我有一个由Rails后端提供支持的Backbone应用程序。我有一个Invitation资源,我可以通过向邀请Controller的创建操作发送POST请求来发送邀请。我的Backbone模型看起来像这样(coffeescript):classInvitationextendsBackbone.ModelurlRoot:'/invitations'发送邀请的表单模板如下。我试图让它尽可能接近普通的rails形式,因为看起来Rails会处理得最好:这是该模型和模板的主干ViewclassInvitationViewextendsBackbone.View#thisisthetemplat

javascript - 在获取/保存后更新 Backbone 子模型

在我的Backbone应用程序中,我有一个模型,该模型由几个作为参数的子模型组成。我是这样定义的:app.Models.Account=Backbone.Model.extend({initialize:function(){this.set({info:newapp.Models.Info(),logins:newapp.Collections.Logins(),billing:newapp.Models.Billing(),});}});问题出在获取和保存时。例如,当我获取JSON响应时包括info的对象,logins的数组和billing的对象。Backbone自动将它们分配为普

javascript - "scroll"到css修改输入值后输入结束

我有一个该用户写入,有时使用字典中的建议。选择建议后,我会:varinput=$('#inp');input.val(input.val()+suggestedText+'');input.focus();//thatisbecausethesuggestcanbeselectedwithmouse一切都很好,但是在添加一个建议后,结果是input.val()太长而无法容纳在编辑字段中,光标位于字符串的末尾(这很好),但在编辑字段中只有字符串的开头可见,因此光标也被隐藏了。只要按下一个键(一个改变值的键),“滚动”就会转到字符串的末尾,隐藏开头...如何自动触发此行为,而无需按键?我找

javascript - 通过正则表达式从盒子阴影中获取每个值

我正在为我现在遇到的问题寻找建议。我希望能够以编程方式更改框阴影的值,即:box-shadow:h-shadowv-shadowblurspreadcolorinset;。我的问题最严重,我需要它至少是2个属性。chrome的示例输出:box-shadow:rgb(0,0,0)0px5px10px,rgb(255,255,255)0px4px10px插入;所以我的问题是我怎样才能首先将这两种样式分开,只是.split(",")不会剪切它,因为它创建了一个数组,因为rgb(,,)如果我要拆分它,如何处理HEX、rgb或rgba,正则表达式是否足够?编辑:我必须能够在浏览器中进行拆分,这就