小编Jam*_*ron的帖子

正确的方法是向Bootstrap主体添加填充以防止内容和标题重叠

我知道要阻止Bootstrap中的主容器位于主体的顶部,并且在导航栏后面,您必须添加填充,如下所示:

<link href="css/bootstrap.css" rel="stylesheet">
    <style>
      body {
        padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
      }
    </style>
<link href="../assets/css/bootstrap-responsive.css" rel="stylesheet">
Run Code Online (Sandbox Code Playgroud)

必须在bootstrap.css和bootstrap-responsive.css之间声明填充,以使填充不会在较小的设备上引起问题,从而破坏站点的响应性.


我的问题:

我正在使用从Bootstrap定制下载的combinde bootstrap.css文件,该文件具有响应和正常的css组合成一个文件.

因为它们被合并到一个文件中,这意味着我无法使用我在本问题开头描述的解决方案,而没有将修复程序实际添加到bootstrap.css文件中(我不想在那里添加它,长篇故事) .

所以我在思考而不是放置这些代码(对于较小的设备使用@media修复):

body {  padding-top: 60px; } 
@media (max-width: 979px) { body { padding-top: 0;  } }
Run Code Online (Sandbox Code Playgroud)

进入我自己的css文件(main.css)并将其包含在bootstrap.css之后,在html中,如下所示:

<link href="css/bootstrap.css" rel="stylesheet" media="screen">
<link href="css/main.css" rel="stylesheet" media="screen">
Run Code Online (Sandbox Code Playgroud)


你认为这个解决方案是否可以接受?

navbar responsive-design twitter-bootstrap

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

如何在Javascript中测试函数的相等性

如何才能对bar和foo的平等进行积极的测试?

 foo = function() {
    a = 1;
 }; 

 bar = function() {
    a = 1;
 }; 

 if (foo === bar) alert('baz');
 if (foo == bar) alert('qux');
Run Code Online (Sandbox Code Playgroud)

以上条件都是错误的.

更新 - 根据要求我需要测试功能相等性的原因

我正在构建一个发布/订阅框架,需要传递回调以取消订阅主题.

请看小提琴:http://jsfiddle.net/jamiefearon/hecMS/47/

javascript equality function

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

解构类构造函数中的参数列表 - Coffeescript

如果我有一个类,我将一些参数传递给:

class Foo

  constructor: (parameters) ->

  @bar = parameters.bar
  @moo = parameters.moo
Run Code Online (Sandbox Code Playgroud)

该类创建如下:

foo = new Foo(bar: 2, moo: 8)
Run Code Online (Sandbox Code Playgroud)

我的问题是,如果传递的变量存在,如果不设置默认值,在构造函数中检测的最优雅方法是什么.我在javascript中这样做的方式是:

this.bar = ( parameters.bar !== undefined ) ? parameters.bar : 10;
Run Code Online (Sandbox Code Playgroud)

其中10是默认值.

谢谢你的帮助 :)

好的答案 - 只是为了总结最好的:

为了检测参数是否存在并定义默认值(如果不存在),在javascript中是:

this.bar = ( parameters.bar !== undefined ) ? parameters.bar : 10;
Run Code Online (Sandbox Code Playgroud)

在coffescript中是:

@bar = parameters.bar ? 10
Run Code Online (Sandbox Code Playgroud)

如此优雅和紧凑!

coffeescript

18
推荐指数
1
解决办法
4100
查看次数

谷歌浏览器和FPS的奇怪行为

我编写了一个小引擎,在Canvas2D中使用javascript显示5个精灵.一切正常,并完全优化.

FPS在30到60之间波动 - 但有趣的是,它在google javascript控制台打开时以恒定的60 fps表示!

有没有其他身体经历过这个?

我正在使用requestAnimationFrame

编辑:

示例:http: //jsfiddle.net/jrPNy/1

玩"粒子"数字,所以你的fps大约是40-50.比打开控制台,它最高可达60 fps.(Chrome 21.0.1180.83)

javascript google-chrome html5-canvas

17
推荐指数
1
解决办法
3708
查看次数

理解<input type ="file">

我正试着在网站上使用所选图像.

假设我有一个简单的网站,让用户可以使用以下系统从系统中选择图像:

<input type="file" id="userImage">
Run Code Online (Sandbox Code Playgroud)

然后在JavaScript中我可以这样做以获取文件:

var userImage = document.getElementById('#userImage').files[0]; 
Run Code Online (Sandbox Code Playgroud)

问题:

1)我现在可以使用userImage吗?比如在画布上绘制它,还是我需要先将它上传到网站服务器?

2)如果我使用图像,网站是否必须在我每次使用时上传它,还是留在内存中?

3)我如何知道图像何时可以使用?(出于同样的原因,所有图像都应该在开始之前预先加载在画布上)

非常感谢你的帮助 :)

跟进

谢谢你的回答.因此看起来它可能在html5中但尚未得到普遍支持.

html5 file-upload preloader

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

使用jQuery在Dom Load上自动播放HTML5视频

我正在尝试使用jQuery加载dom时播放视频.这是我的代码:

HTML

<video id="video" width="420">
  <source src="http://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
  <source src="http://www.w3schools.com/html/mov_bbb.ogg" type="video/ogg">
  <p>Your browser does not support HTML5 video.</p>
</video>
Run Code Online (Sandbox Code Playgroud)

JS(script.js)

$(document).ready(function() {
  $(#video).play();
});
Run Code Online (Sandbox Code Playgroud)

当你加载视频时,视频无法播放,我哪里出错了?提前致谢.

html html5-video

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

在 THREE.js 中获取鼠标相对于 3D 空间的坐标

在过去的三个星期里,我一直在努力试图解决这个问题。如果有人能帮助我,我将非常感激。

我正在开发一款类似于《几何战争》的游戏,其中屏幕中间有一个三角形,您可以在其中移动。

问题是我需要三角形旋转并面向鼠标光标的方向。我不需要担心 z 轴,因为我总是将相机置于固定位置 (z=500),并且我将场景视为“2D 场景”——所有动作都发生在 z 轴上=0 平面。

计算三角形和鼠标之间的角度是基本的:

targetAngle = Math.atan2(mouseCoord.y-this.position.y, mouseCoord.x-this.position.x)
Run Code Online (Sandbox Code Playgroud)

这是网格。

问题在于 mouseCoords 采用标准 Dom 窗口格式,而三角形的位置采用 Three.js 格式。

问)如何转换鼠标坐标以表示三角形所在 z=0 平面上的坐标?

我尝试了很多方法,包括射线相交,但没有任何效果;(

感谢大家的帮助,非常感谢你们提供了一个令人惊叹的框架!!!!

three.js

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

实例变量变为未定义 - CoffeeScript

class Game

  foo: null

  play: ->

    @foo = 2
    @animate()

  animate: ->

    requestAnimationFrame( @animate, 1000 )
    console.log('foo = ', @foo)


$ ->
  game = null

  init = ->

    game = new Game()
    game.play()

  init()
Run Code Online (Sandbox Code Playgroud)

Game中animate方法的登录产生:

foo = 2

foo =未定义

所以foo在第一次调用动画时是2,然后是未定义的.有人可以解释为什么以及如何解决这个问题.任何帮助深表感谢.

javascript coffeescript

5
推荐指数
2
解决办法
1352
查看次数

使用HTML 5 File API加载JSON文件

我希望用户能够在那台计算机上选择一个JSON文件,然后应该将这个JSON文件提供给客户端Javascript.

我如何使用FILE API执行此操作,最终目标是用户选择的JSON文件可用作对象,然后我可以在Javascript中使用它.这是我到目前为止:

JsonObj = null 



function handleFileSelect(evt) {
    var files = evt.target.files; // FileList object
     f = files[0];
      var reader = new FileReader();

      // Closure to capture the file information.
      reader.onload = (function(theFile) {
        return function(e) {
          // Render thumbnail.
         JsonObj = e.target.result
         console.log(JsonObj);
        };
      })(f);

      // Read in the image file as a data URL.
      reader.readAsDataURL(f);
    }



document.getElementById('files').addEventListener('change', handleFileSelect, false);
Run Code Online (Sandbox Code Playgroud)

FIDDLE:http://jsfiddle.net/jamiefearon/8kUYj/

我如何将变量JsonObj转换为适当的Json对象,可以添加新的字段等.

html5 json fileapi

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

重命名对象中的字段

如果我有以下对象:

JsonObj = {
    "frames": {
        "cinema": {
            "sourceSize": { "w": 256, "h": 200 },
            "frame": { "x": 0, "y": 0, "w": 256, "h": 192 }
        },
        "tree": {
            "sourceSize": { "w": 128, "h": 110 },
            "frame": { "x": 0, "y": 302, "w": 70, "h": 96 }
        }
    }
};
Run Code Online (Sandbox Code Playgroud)

parsedJSON使用此JavaScript代码将此JSON对象解析为变量:

var parsedJSON = JSON.parse(JsonObj);
Run Code Online (Sandbox Code Playgroud)

如何将"frames"属性重命名parsedJSON为其他内容?

javascript

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