小编sty*_*yke的帖子

展开浮动元素的父div以适合它们的总宽度?

我正在尝试将一个页面放在一起,上面会有一个水平滚动窗格 - 这是我希望获得的布局示例: 在此输入图像描述 内容是动态添加的,具有不同的维度..

这是一些HTML:

<div class="container">
    <div class="inner">
        <div></div>
        <div></div>
        <div></div>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

基本CSS:

.container {
    width: 100%;
    height: 100%;
}

.container .inner {
    position: relative 
}

.container .inner > div {
    float: left;
}
Run Code Online (Sandbox Code Playgroud)

目前,我可以使其工作的唯一方法是设置显式宽度.inner.否则,我最接近的就是这个答案,但它离我想要的效果还很远.有可能单独使用HTML/CSS实现我正在寻找的东西,还是我必须求助于javascript?

html javascript css css3 responsive-design

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

试图计算圆上两点之间的角度?

首先,让我说我在数学上绝对是残暴的,请耐心等待.

我正在尝试计算圆上两点之间的角度,这两点是用户在一定时间内拖动的距离.

这是我到目前为止:

intervalId = setInterval(function(){

      if(p1x != undefined){
        p2x = Xpos;

      }

      if(p1y != undefined){
        p2y = Ypos;
      }


      if( p1x != p2x || p1y != p2y ){

        p1a = p1x - wheelMiddleVer;
        p1b = p1y - wheelMiddleHor;
        a = Math.sqrt((p1a * p1a) + (p1b * p1b));

        p2a = p2x - wheelMiddleVer;
        p2b = p2y - wheelMiddleHor;
        b = Math.sqrt((p2a * p2a) + (p2b * p2b));

        u = p1x - p2x;
        v = p1y - p2y;
        c = Math.sqrt((u …
Run Code Online (Sandbox Code Playgroud)

javascript math jquery geometry

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

似乎无法在javascript中添加两个整数?

我用HTML5画布构建John Conways的生活游戏.它有一个gameOfLife对象,它包含一个包含所有单元格及其状态(死/活)的数组.以下是构建单元格的代码:

function cell(x,y){
    this.x = x;
    this.y = y;
    this.isAlive = false;
}
Run Code Online (Sandbox Code Playgroud)

我正在探索检查细胞状态周围细胞的方法.据我所知,一种方法是遍历数组并找到一个坐标匹配的单元格,该单元格位于当前已检查的单元格周围.

我在考虑采用不同的方式.通过在被评估的单元格的索引上添加和减去Y(和X)轴上的单元格数(具有+1和-1的小变化),您应该能够得出任何顶部的索引左,左,左下,右上,右,右下单元格.

我无法测试这个想法,因为它不能让我得到所需的索引:

所以,在我的更新循环中:

//I know that there is a cell at the index of exampleIndex + cellsY
exampleIndex = 200;

game.getLivingNeighbours(exampleIndex);


function getLivingNeighbours(i){

    console.log(i) //Logs an integer
    console.log(grid.cellsY) //Logs an integer
    console.log(game.cells[i + grid.cellsY]); //Undefined?!

}
Run Code Online (Sandbox Code Playgroud)

javascript arrays indexing jquery integer

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

Chrome 不会播放 .mp4 文件

我正在尝试让 HTML5 视频正常工作。我正在使用本地服务器。

<video id="headervideo" controls>
   <source src="<?php echo base_url(); ?>assets/home.mp4" type="video/mp4">
   Your browser does not support the video tag.
</video>
Run Code Online (Sandbox Code Playgroud)

但是,该文件拒绝播放。当我使用绝对路径访问它时,它只会显示播放按钮为灰色的播放器。这里可能是什么问题?

html video mp4 localhost

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

Javascript游戏麻烦

我正在使用HTML5的canvas API在Javascript中制作游戏,并且遇到了障碍.

其中一个游戏效果是导弹沿着y轴向上行进,受到阵风(由涡轮机发出)的影响,沿着x轴移动.制作这些涡轮机之一我没有任何问题,但当它们的数量增加到3时,我遇到了麻烦.在一个新的级别,我将这些涡轮机实例化为对象,然后将其推入一个数组,如下所示:

function gameStateNewLevel(){

    for (var i = 0; i < 2; i++){
        turbine = {};
        turbine.width = 10;
        turbine.height = Math.floor(Math.random()*200); //turbine height
        turbine.y = Math.floor(Math.random()*600) //turbine y-axis 
        if (Math.random()*10 > 5){ //indicates turbine side of canvas
            turbine.side = leftSide;
        }else{
            turbine.side = rightSide;
        }
        if(turbine.height <= 100){ //Increases turb. size if it's too small
            turbine.height += Math.floor(Math.random()*100);
        }

        turbines.push(turbine);

    }

    context.fillStyle = "#FFFFFF"       
    switchGameState(GAME_STATE_PLAYER_START);
}
Run Code Online (Sandbox Code Playgroud)

现在,在渲染之前,它们也会通过updateTurbine函数进行更新.所有这些功能应该确保涡轮机不相互重叠,并根据需要在y轴上向上或向下移动(通过循环数组并比较其中的每个对象).我已经开始制作这个功能,但是我在所有循环之间完全迷失了.这就是我所拥有的,我感觉我走错了路:

function updateTurbines(){
    tempTurbine = {}
    turbinePositionTop = tempTurbine.y;
    turbinePositionBottom = tempTurbine.y …
Run Code Online (Sandbox Code Playgroud)

javascript arrays html5 canvas

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

流星尝试创建ObjectID时返回无效的十六进制字符串错误?

我正在向数据库中插入一些东西,并使用jQuery在其他地方更新它(给我一个休息时间,我是新来的),之后我需要能够单击它并显示一些UI东西,这意味着获取ID。因此,我设置了ID变量,然后尝试再在click事件中尝试使用它:

...

"click .message-entry" : function (e) {
    var id = this._id || new Meteor.Collection.ObjectID(newMessageId);
    Session.set('singleMessageId', id);
},

...
Run Code Online (Sandbox Code Playgroud)

原则上应该可以工作,但是返回以下错误:

Uncaught Error: Invalid hexadecimal string for creating an ObjectID

断点显示该ID既是字符串,又是新插入文档的ID。这里可能出什么问题了?

javascript jquery mongodb meteor

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

无法使用CSS定位Google +1按钮?

我在网站上定位Google +1按钮时遇到了一些麻烦.div如下:

<div class="g-plusone"></div>
Run Code Online (Sandbox Code Playgroud)

我正在使用的CSS非常简单:

.g-plusone
{ 
position: absolute; 
top:95px;
left:715px; 
}
Run Code Online (Sandbox Code Playgroud)

尽管看起来很简单,但它很简单并不想动.

我知道有问题的div正在被访问.奇怪的是,其他社交分享按钮,如下面的FB遵循相同的语法,并且定位完美.

.fb-like 
{
position: absolute; 
top:62px;
left:715px; 
}
Run Code Online (Sandbox Code Playgroud)

遗憾的是,添加!值对值没有任何作用.

有任何想法吗?

html javascript css positioning

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

jQuery .width()有时会起作用; 有时不?

简单代码:

$(document).ready(function(){
    console.log($('.slide-background').width());
});
Run Code Online (Sandbox Code Playgroud)

和简单的HTML:

<div class="testdiv">
      <img class="slide-background" src="img/slide.png"/>
</div>
Run Code Online (Sandbox Code Playgroud)

以及简单的CSS:

        body {
            margin: 0; padding: 0;
            height: 100%; width: 100%;
        }

        html {
            margin: 0; padding: 0;
            height: 100%; width: 100%;
        }   
        .testdiv {

            overflow: hidden;
            width: 100%; 
            height: 100%; 
            background-color: black;
        }
Run Code Online (Sandbox Code Playgroud)

为什么它会随时输出宽度?有时宽度实际上会被记录,但大多数时候返回0.

html css jquery

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

用Javascript计算三角形的角度?

抱歉问了这个非常愚蠢的问题。我正在从头开始慢慢学习数学。

我想通过javascript计算三角形的角度。

我计算边长,

Ab = Math.abs(b.x - c.x);
Ac = Math.abs(b.y - c.y);

A = Math.sqrt((Ab*Ab) + (Ac*Ac));

Bb = Math.abs(a.x - c.x);
Bc = Math.abs(a.y - c.y);

B = Math.sqrt((Bb*Bb) + (Bc*Bc));

Cb = Math.abs(a.x - b.x);
Cc = Math.abs(a.y - b.y);

C = Math.sqrt((Cb*Cb) + (Cc*Cc));
Run Code Online (Sandbox Code Playgroud)

然后我谈到这一点:

angleB = Math.cos(((C*C) + (A*A) - (B*B))/(2*C*A));
Run Code Online (Sandbox Code Playgroud)

然而,我得到了一个完全错误的号码。为什么会这样呢?

javascript math trigonometry

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

指定Math.atan2的原点

Math.atan2()是一个非常有用的计算角度的函数.但是,我无法绕过一件事:

$(document).mousemove(function(event){
    r = Math.atan2(event.pageY, event.pageX);
    deg = r * 180/Math.PI;
    console.log(deg);   
})
Run Code Online (Sandbox Code Playgroud)

console.log表示计算角度的0,0位于屏幕的左上角.如何从不同的原点计算角度,比如说屏幕的中心?

javascript math jquery geometry atan2

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