小编Nie*_*sol的帖子

JavaScript中的Object.prototype

我有一些JavaScript代码定义了一个函数getElementsByAttribute如下:

Object.prototype.getElementsByAttribute = function(attr) {
    var children = this.all || this.getElementsByTagName('*'),
        ret = [], i, c;
        for( i=0; i<children.length; i++) {
            c = children[i].getAttribute(attr);
            if( typeof c == "string" && c != "")
                ret.push(children[i]);
        }
    return ret;
}
Run Code Online (Sandbox Code Playgroud)

这适用于我测试过的所有浏览器,除了Internet Explorer 7(并且可能更低) - 这些浏览器抛出"对象不支持此属性或方法".
我唯一能想到的是它不喜欢的是当我定义原型函数时已经创建了对象...
将函数定义为......好吧,一个"正常"函数并传递元素作为参数,有没有办法让这个工作在IE7及以下?

javascript internet-explorer prototype

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

为什么多个setTimeout()调用导致如此多的延迟?

我有一个复杂的动画序列,涉及JavaScript中的淡入淡出和过渡.在此序列中,由四个元素一次变化组成,setTimeout在每个元素上使用a .

在Internet Explorer 9中测试,动画以实时速度运行(它应该需要1.6秒,并且需要1.6秒).任何其他浏览器都会出现可怕的延迟,动画时间为4秒(Firefox 3和4,Chrome,Opera)以及IE 8及以下版本的20秒.

当所有其他浏览器陷入泥潭时,IE9怎么能这么快?

我试图找到将元素合并为一个的方法,以便在任何给定时间都有一个setTimeout,但遗憾的是它不会经受任何干扰(例如点击不同的链接以在之前启动新的动画目前已完成).

编辑:为了回应评论,这里是代码的大纲:

link.onclick = function() {
    clearTimeout(colourFadeTimeout);
    colourFadeTimeout = setTimeout("colourFade(0);",25);

    clearTimeout(arrowScrollTimeout);
    arrowScrollTimeout = setTimeout("arrowScroll(0);",25);

    clearTimeout(pageFadeOutTimeout);
    pageFadeOutTimeout = setTimeout("pageFadeOut(0);",25);

    clearTimeout(pageFadeInTimeout);
    pageFadeInTimeout = setTimeout("pageFadeIn(0);",25);
}
Run Code Online (Sandbox Code Playgroud)

四个函数中的每一个都将淡入淡出一帧,然后在参数递增的情况下设置另一个超时,直到动画结束.

您可以在http://adamhaskell.net/cw/index.html(用户名:knockknock;密码:goaway)看到该页面(它有声音和音乐,可以禁用,但要注意!) - 我的JavaScript非常凌乱,因为我没有真正组织它,但它有点评论,所以希望你可以看到一般的想法是什么.

javascript firefox google-chrome lag

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

设置php.ini的路径

是否有可能只有一个php.ini文件,例如在webroot中(甚至在它之外,以防止人们通过GET访问它),并快速,轻松地告诉PHP它在哪里?

我知道你可以设置php.ini指令.htaccess,但是可以定义一个特定的php.ini文件吗?

php apache

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

在触摸屏上拖放

我一直在寻找关于这些事件如何运作的明确指南,现在我比起初时更困惑.

我网站的某些功能涉及拖放.当前移动设备(或任何没有鼠标的东西)通过让用户选择项目,点击"移动"按钮,然后触摸放置点来支持.虽然这很有效(项目在可见网格上),但它不像拖动那样用户友好.

我最初的理解是,只要我给你element.onmousedown,element.onmousemove而且element.onmouseup我可以简单地也将相同的处理程序element.ontouchstart,element.ontouchmoveelement.ontouchend分别.

但是,这留下了以下问题:

  • 如何获取触摸点的坐标,以及它的相对位置?
  • 是否会平移视图(拖动的默认操作),如果可以取消?
  • 如果一个手指恰好位于可拖动元素上,如何避免干扰多点触摸操作(如捏缩放)?

javascript drag-and-drop touch

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

获取文本节点的宽度

一些(JS 修改的)HTML 可能如下所示:

<div style="width: 50px;">1,234,567</div>
Run Code Online (Sandbox Code Playgroud)

如何检测文本节点是否比容器宽?

javascript width

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

如何垂直偏移CSS中的项目符号或内容?

看这个图片:
子弹

它有点偏离,我想把内容向上移动,或者子弹本身向下移动.我试过填充,边距和定位无济于事.HALP?

html css

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

视口单元,保持纵横比?

所以我刚刚发现了视口单元,我真的想要使用它们.

第一个挑战:我的元素的"基本大小"为760x670像素.我想使用视口单元对其进行缩放,以便高度为100vh或宽度100vw为较小者.

不幸的是,虽然我可以100vmin用来获得两者中较小的一个,但我只能将它应用于宽度或高度,而不是两者.

目前我正在使用:

#root {
    width: 760px;
    height: 670px;
    width: 100vw;
    height: calc(670vw/760);
}
Run Code Online (Sandbox Code Playgroud)

这会缩放宽度以适合屏幕,从而产生垂直滚动.这不是太糟糕,但我更喜欢它,如果我真的能让它适合视口.

css viewport viewport-units

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

在 CSS 中模拟浏览器缩放

好吧,我已经尝试了我所知道的两种缩放方法:

zoom:2;
Run Code Online (Sandbox Code Playgroud)

和...

transform:scale(2);
Run Code Online (Sandbox Code Playgroud)

然而,虽然它们确实有效(某种程度上),但存在一个主要缺陷:JavaScript 鼠标事件被 ----ed。

我似乎无法弄清楚如何获取鼠标坐标,就好像页面没有缩放一样。

此外,我必须添加body{width:50%}以确保它不会导致巨大的水平滚动。

另一方面,如果我只是使用本机浏览器缩放来缩放页面,则结果是完美的。一切都正确显示,鼠标事件正常工作,主体保持其实际宽度等等。

有没有办法让这种自然的浏览器缩放在 CSS 中工作?如果没有,我应该使用哪种 JavaScript 来确保鼠标坐标正确“缩放”?

css zooming

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

存储不变数据的最佳方式

当我处理我的游戏时,我一直在使用MySQL数据库.

但是最近我SELECT在Memcache中投入了很多结果,因为它们不太可能改变.

这让我想知道,仅仅拥有一个定义数据数组的PHP文件会不会更好?当然,这意味着我必须加载整个数组只是为了访问一行,但我相信与无需等待MySQL的时间相比,这是微不足道的.

我是否正确思考这条道路?我应该将我不变的游戏数据(例如角色基础统计数据,兼容性图表,项目数据等)移动到PHP文件中吗?或者我应该继续使用MySQL + Memcache?

哪个更好?为什么?

php mysql

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

左侧的滚动条

我目前使用以下内容使滚动条显示在左侧,而不是右侧:

HTML:

<div class="leftscrollbar"><div>Content here</div></div>
Run Code Online (Sandbox Code Playgroud)

CSS:

.leftscrollbar {
    overflow:auto;
    transform:scaleX(-1);
}
.leftscrollbar>div {
    transform:scaleX(-1);
}
Run Code Online (Sandbox Code Playgroud)

它工作得很好,但有比使用两个变换更好的方法吗?

css

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