小编RSG*_*RSG的帖子

使用:在CSS伪元素之前将图像添加到模态

我有一个Modal绝对定位的CSS类,z-indexed在它的父级之上,并且很好地定位于JQuery.我想在模式框的顶部添加插入符号图像(^),并且正在使用:beforeCSS伪选择器来干净地执行此操作.

图像需要绝对定位并在模态上方进行z索引,但我没有找到任何方法将相应的类添加到content属性中的图像:

.Modal:before{
  content:url('blackCarrot.png') /* with class ModalCarrot ??*/
}

.ModalCarrot{
   position:absolute;
   left:50%;
   margin-left:-8px;
   top:-16px;
}
Run Code Online (Sandbox Code Playgroud)

第二个最佳选择 - 我可以在内容属性中添加内联样式吗?

css modal-dialog pseudo-element

103
推荐指数
3
解决办法
37万
查看次数

如何为Rails控制器添加延迟进行测试?

我正在测试Web应用程序的前端,并想测试一些转换如何在AJAX请求之间出现各种延迟.有什么办法可以添加sleep(1500)到我的控制器来延迟响应吗?

ruby testing ajax ruby-on-rails ruby-on-rails-3

42
推荐指数
2
解决办法
4万
查看次数

Jquery append()是否异步运行?

我已经看到了一些帖子(假设立即附加),其中有相互矛盾的接受答案.我们正在使用JQuery 1.4(http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js),而append()似乎是异步的,这样:

编辑以在AJAX回调的上下文中显示代码

 ...
 var message = $.ajax({
   type: "GET",
   url: "/getVolumes/" +  _Id,
   async: false 
 }).responseText;
 if (parseInt(message) != 0){
   var $results = $(message);
   $MAIN_DIV.append($results);
   retrieveTargets();
 }
...    
function retrieveTargets(){
  var $targets = $(".resultTargets");
}
Run Code Online (Sandbox Code Playgroud)

按预期执行并创建页面,但目标查询在运行时不产生任何内容.在JS控制台中运行相同的代码会按预期检索元素.

如果这是JQuery中的预期行为,那么等待追加完成的正确方法是什么?

jquery asynchronous append

20
推荐指数
2
解决办法
2万
查看次数

Sass mixin用于背景透明度回到IE8

我是Sass的新手并且正在努力解决这个问题.我无法在两者中获得颜色hex(对于IE)和rgba.每一小段都令我感到沮丧,因为我还没有掌握语法,而Sass的谷歌搜索结果仍然很少.

这是混音:

@mixin transparent($hex, $a){
    /* for IEGR8 */
    background: transparent;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#{$a}#{$hex},endColorstr=#{$a}#{$hex});
    zoom: 1;
    /* for modern browsers */
    background-color: rgba(#{$hex},.#{$a});
}
Run Code Online (Sandbox Code Playgroud)

@include transparent(#FFF,.4)应该产生以下良好的,浏览器兼容的透明代码:

background: transparent;         
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#40FFFFFF,endColorstr=#40FFFFFF);
zoom: 1;
background-color: rgba(100,100,100,.40);
Run Code Online (Sandbox Code Playgroud)

几个小时后,我一直在注意以下事项:

  • #要求#RGB格式.
  • .需要RGBA阿尔法.

两者都需要包含在调用中rgba(),但是#不能包含在IE中,#AARRGGBB或者它看起来像#AA#RRGGBB和.不能包括IE或它拒绝#.AARRGGBB.

我错过了一个更简单的方法吗?这可以通过Sass字符串操作或Sass中的任何稍微聪明的色彩转换功能来完成,它已经为我处理了这个问题吗?

Muchas gracias.

css sass cross-browser mixins ruby-on-rails-3.1

20
推荐指数
1
解决办法
1万
查看次数

自定义HTML属性需要自定义帮助程序?

我正在尝试在输入上创建一个包含一些自定义数据属性的表单:

<input type="text" data-family="Dinosaurs">
Run Code Online (Sandbox Code Playgroud)

这似乎是一个很好的干净方式,使用jquery轻松前端访问(哈哈!):

$("[data-family='Dinosaurs']").doSomething()
Run Code Online (Sandbox Code Playgroud)

问题是我无法获得Rails(3.0.3)来呈现属性.

<%= f.text_field :question, :id=>"poll_question", :class=>"BigInput", :style=>"width:98%;", :attributes=>"data-submit_clear='1'" %>
Run Code Online (Sandbox Code Playgroud)

我尝试了许多排列无济于事,无法找到如何做到这一点的例子.我是否需要修改text_field帮助程序以支持任何自定义属性?

ruby-on-rails form-helpers custom-data-attribute

18
推荐指数
2
解决办法
2万
查看次数

Backbone.js适合移动设备?

我最近一直在研究backbone.js,并且非常喜欢哲学和执行.是否有人在HTML5 IOS界面上使用Backbone?

您对这种方法有什么经验?

iphone html5 mobile-website backbone.js

11
推荐指数
1
解决办法
6815
查看次数

优化的数据结构,用于2d空间搜索和Javascript实现?

我正在研究俄罗斯方块式的HTML5游戏,需要加强空间优化算法.需要以最节省空间的方式将不同大小的矩形块添加到画布中.我知道这个块占用了多少空间,我需要找到一个最近的点,块可以添加一个固定的x坐标 - 绝对最近的点是一个不错的选择.

我实现了进行搜寻逐像素值向下推动,直到它找到形状足够的自由空间,在画布上检查版本,然后将其添加.此作品(慢)只有在空间罢了左右的算法可以放心地假设,如果第一像素列是安全的,然后可以加入整个块.

我需要让这个更加强大,这就是我认为应该去的地方.

存储四叉树来表示电路板状态使我能够更快地识别出有空间的位置.

搜索空间

为每个深度级别存储4个节点 - 每个节点为0表示完全为空,或者1表示"在某处有某些东西".每个渐进的深度级别都会提供有关电路板的越来越多的信息.

given(boardstate, block width, block height)
-calculate the largest grid space the block must span
  // a block which is 242x38 MUST span a 16x16 free space 
  // (based on 1/2 of smallest dimension)
-the block width requires n consecutive free spaces
  // (242/16) = 15
-find the first available 15x1 spaces in the board
-check the surrounding tiles at the next level of depth for collisions
  -check the surrounding tiles at …
Run Code Online (Sandbox Code Playgroud)

javascript algorithm bin-packing

9
推荐指数
1
解决办法
1823
查看次数

是否可以附加带有其他类/样式的CSS3背景?

今天我学会了CSS3支持多种背景,这很棒.我真正喜欢的是能够动态组合多个背景,EG:

.Watermarked{
  background: url('text/logo.png') bottom right no-repeat;
}
Run Code Online (Sandbox Code Playgroud)

HTML:

<div class="Watermarked" 
     style="background:url('photos/very_pretty_sunset.jpg') 0 0 no-repeat;">
...
Run Code Online (Sandbox Code Playgroud)

以某种方式产生计算的样式:

 background: url('text/logo.png') bottom right no-repeat,
             url('photos/very_pretty_sunset.jpg') 0 0 no-repeat;    
Run Code Online (Sandbox Code Playgroud)

当然,我可以硬编码额外的背景样式或使用jquery添加它.我正在寻找那种甜美,纯粹,仅限CSS的解决方案.

回答

接受thirtydot的纯CSS答案 - "你不能".

值得强调的是,如果您正在使用SASS(Rails 3.1等),硬编码样式通过可变使用更加可口:

$watermarkImage: url('text/logo.png') left top no-repeat;
...
#very_pretty_sunset{
  background: $watermarkImage, url('photos/very_pretty_sunset.png') right bottom no-repeat;
}
Run Code Online (Sandbox Code Playgroud)

css background css3

8
推荐指数
2
解决办法
2681
查看次数

Rails 3.1 - 强制SCSS变量值刷新?

我在assets/stylesheets目录中设置了一组[object] .css.scss样式,以便与我的应用程序中的不同视图相对应.每个工作表在第一行中包含一组全局样式变量值:

@import "branding.css.scss";
Run Code Online (Sandbox Code Playgroud)

然后在需要时访问变量值($ primaryColor,$ secondaryColor等).

它非常干燥,但不幸的是,当我对_branding.css.scss文件中的变量值进行更改时,Rails不会刷新对象样式表.在SCSS使用更新的变量值重新编译对象样式库之前,我必须去触摸每个文件.

这是一个小小的抱怨,但它对工作流程有破坏性,特别是当我不断清理浏览器缓存试图修复它时:

有没有更好的方法来组织变量?

有没有办法强制刷新?

css caching sass ruby-on-rails-3.1

5
推荐指数
1
解决办法
1537
查看次数

在Rails中从/ public目录提供字体的缺点是什么?

我喜欢资产管道,但对于我的生活,我无法让它服务我的字体.我浪费了几个小时谷歌搜索和尝试SO解决方案(nope,nope,nope).

相反,我创建了/public/fonts,删除了我的所有字体并引用它们url('/fonts/myAwesomeFont.ttf').一切都很完美.

这种方法有不利之处吗?

字体文件是否在资产预编译中压缩?

fonts ruby-on-rails ruby-on-rails-3.1 asset-pipeline

5
推荐指数
1
解决办法
2773
查看次数

在对象命名空间中定义和引用常量值?

我想为 JS 对象定义一个常量默认值,并在同一个命名空间中的进一步声明中引用它,a la:

var Foo = {
  // 'constant' value for default key 
  DEFAULT_KEY : "COOKIE_MONSTER",

  // a map declaration that should ideally reference the default key 
  key_map : {
    a : Foo.DEFAULT_KEY, 
    b : Foo.DEFAULT_KEY
  }
};
Run Code Online (Sandbox Code Playgroud)

Foo不会在 Foo.key_map 之前定义,所以Foo.DEFAULT_KEY不是真的。
设置/使用这些对象常量的正确方法是什么?

javascript namespaces constants

5
推荐指数
1
解决办法
1237
查看次数

Rails 3:模型中的哈希访问器?

除了我已经完成的教程示例之外,我正在努力扩展我对一些基本Rails概念的理解.我找不到任何Q&A/docs/walkthroughs正在做我想做的事情,所以我很有可能以错误的方式解决这个问题.

我有一个包含许多标签的Team对象.Team表有一些标准化字段,但团队的大多数特征都存储为标签,即团队'Virginia Cavaliers'有标签

{[tag_name => 'Conference', tag_value => 'ACC'],
[tag_name => 'Division', tag_value =>'I']}
Run Code Online (Sandbox Code Playgroud)

数据库设计旨在容纳同一表中的许多类型的团队,标签表便于按任意标准搜索团队.

到现在为止还挺好.我无法弄清楚的是如何最好地访问团队的团队属性.

class Team < ActiveRecord::Base
  belongs_to :sport
  has_many :team_subscriptions
  has_many :users, :through => :team_subscriptions
  has_many :tags
  def tagvalue
    #Set up a hash to retrieve tag value by name?
    @tagvalue = {}
    tags.each do |t|
      @tagvalue[t.tag_name] = t.tag_value
    end
    Rails.logger.info(@tagvalues.keys)
  end
end    
Run Code Online (Sandbox Code Playgroud)

哈希就在那里,但我不能按照我喜欢的方式访问它.

<%= @team.tagvalue["Conference"] %>
Run Code Online (Sandbox Code Playgroud)

这是明智的吗?可能?谢谢你的回复.

*根据反馈编辑(本网站很棒)*

第二个建议是语法上的光滑,但我可以看到两个挂起.我必须捕获空值,因为并非所有团队都拥有所有标签,有时它们会出现在同一个列表中:

我笨拙的实施:

has_many :tags do 
  def [](key)
    set = where(:tag_name => key)
    if set.length > 0
      set.first[:tag_value]
    end …
Run Code Online (Sandbox Code Playgroud)

ruby-on-rails

4
推荐指数
1
解决办法
1418
查看次数

Jquery/Javascript速度......我应该真的关心吗?

我已经看到很多帖子比较了各种选择器查询和DOM遍历方法的速度.当然,在具有数百或数千个元素和O ^ n操作的情况下,它很重要,但在99%的Jquery响应用户操作进行DOM操作(或旋转动画或制作吐司)的情况下,速度确实很重要?

几乎所有JQuery操作都不会比往返服务器更快吗?

设计优化优化的服务器端代码是有意义的.在javascript中负责内存分配和清理是有道理的,因此用户的浏览器不会像Flash大约v5一样运行.在浪费时间优化JQuery/Javascript的速度时,我没有任何意义,除非在测试期间显着减慢页面速度.

有人可以告诉我是否以及为什么我应该开始关心JQuery的速度?

编辑

我的语气无疑是狡猾的,但并不意味着争论.当你需要在这里时,有很好的资源来解决如何进行优化的方法,更好的方式来问我的问题:

次优Javascript/Jquery有什么影响?
如果我没注意到,我应该担心吗?

公认

阅读回复后,我认为这个问题的最佳答案取决于您的项目和团队规模.在程序员没有用户将看到的页面的完整视图的情况下,例如团队在哪里

  • 程序员负责页面上的各个功能
  • 程序员独立开发和单元测试
  • 有一个定制的前端API或其他可能影响实际响应时间的代码

然后更谨慎和"过早优化"作为常规是有道理的.如果有专业的,专业的前端设计师什么都不做,这是可行的.

在较小的项目上,例如我目前的双人团队:

  • 缺乏专业化
  • 需要高编程器输出
  • 一个人对整个前端的集中责任

优先级列表中的所有推送优化.@Anurag的回答帮助我找到了问题的核心并做出了最好的决定.

javascript optimization performance jquery frontend

3
推荐指数
1
解决办法
500
查看次数