小编Gio*_*ona的帖子

css3-mediaqueries.js VS respond.js

respond.js CSS3,mediaqueries.js

官方文档,特别是css3-mediaqueries.js的文档,是稀疏的.阅读SO,论坛和博客我总结了这些优点和缺点.

respond.js

优点:

  1. 更可靠(?由Modernizr,Twitter Bootstrap 3H5BP推荐)
  2. 更轻(4kb),速度更快
  3. 在任何上下文中解释mediaquery(<link>,内联CSS,@ import-ed CSS)

缺点:

  1. 窗口大小调整时不更新
  2. 仅支持min-widthmax-width
  3. 不支持em单位(巨大的弱点!)

CSS3-mediaqueries.js

优点:

  1. 实时反应(调整大小!)
  2. 支持em单位(真的吗?有人测试过吗?)

缺点:

  1. 更重(15kb)并且更慢
  2. 仅使用显式声明的媒体类型解释内联CSS
  3. 缺乏详细的文档,项目似乎被放弃了

是否有人有要添加到列表中的点,或要分享的个人经历,或者对一个或另一个脚本的特定偏好?如果是这样,为什么?

javascript css3 media-queries polyfills

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

CSS3动画填充模式polyfill

前言

让我们假设一个div从动画opacity:0;opacity:1;,我想保留opacity:1;动画结束之后.

这是什么animation-fill-mode:forwards;.

@keyframes myAnimation {
    from { opacity:0; }
    to { opacity:1; }
}
div {
    opacity:0;
    animation-name:myAnimation;
    animation-delay:1s;
    animation-duration:2s;
    animation-fill-mode:forwards;
}?
<div>just a test</div>?
Run Code Online (Sandbox Code Playgroud)

在jsFiddle上运行它

  • 注1:我在这里没有包含供应商前缀以简化
  • 注2:这只是一个例子,请不要回复"只使用jQuery fadeIn函数"等.

有些事要知道

这个答案中,我读到animation-fill-modeChrome 16+,Safari 4 +,Firefox 5+支持.

但Chrome 1+和Opera也支持animation单独使用.因此,即使不支持,使用Modernizr进行的一般测试也可能会返回正值.fill-mode

目标animation-fill-mode我在Modernizr上添加了一个新的测试:

Modernizr.addTest('animation-fill-mode',function(){
    return Modernizr.testAllProps('animationFillMode');
});
Run Code Online (Sandbox Code Playgroud)

现在我有一个.no-animation-fill-modeCSS和Modernizr.animationFillModeJavaScript 的课程.

我还从CSS3动画规格中读到:

文档样式表中指定的动画将从文档加载开始


最后,问题

是否可以在动画结束的确切秒数内运行简单的jQuery函数

$(document).ready(function(){ …
Run Code Online (Sandbox Code Playgroud)

jquery animation css3 modernizr polyfills

14
推荐指数
1
解决办法
4729
查看次数

自动调整CSS中的倾斜背景(+图像?)

我要将这个PSD图像转换为CSS.我在多个页面中有多个h2,因此内部文本长度和背景颜色可能会有所不同.因此,背景应自动适应"任何"长度.

偏斜的背景演示

到目前为止,标记是这样的:

<h2 class="sub-heading lab-heading">Laboratori</h2>
Run Code Online (Sandbox Code Playgroud)

我最终可能会将内部文本包装成一个<span>,但保留一个没有任何额外元素的语义有效标记将是♥ly.

内部文本是旋转的,但它不是强制性的.我现在关注的是背景偏差.

我对使用缩放背景png(例如背景大小:封面),伪元素,画布等的任何解决方案持开放态度.但它必须是模块化的.

非常感谢任何建议.


[更新]我正在寻找的图形示例:

我不是图形演示


[重要提示]在h2后面有一个不规则的图案(不是"纯色"背景)

html css background-image autoresize skew

12
推荐指数
2
解决办法
2039
查看次数

php clearstatcache()性能和参数说明

filemtime用于在html中对指纹外部资源进行指纹识别,例如:

<link rel="stylesheet" href="screen-<?=md5(filemtime('screen.css'));?>.css">
Run Code Online (Sandbox Code Playgroud)

我注意到有效更新和返回的时间戳之间存在显着延迟filemtime,所以我clearstatcache()在顶部添加了,这似乎解决了这个问题.但根据php手册:

如果要对同一文件名执行多个操作并且要求不缓存有关该特定文件的信息,则只需调用clearstatcache().

所以我想知道我是否正确使用它.

此外,我担心在每次通话时完全清除缓存的性能.谁能告诉我它是否会导致服务器显着减速?


clearstatcache 还接受两个额外的参数,但我不确定它们的含义:

clear_realpath_cache是否清除realpath缓存.

filename仅清除特定文件的realpath和stat缓存; 仅在clear_realpath_cache为TRUE时使用.

我没有得到"realpath缓存"的意思,我找不到任何有关它的信息.这样称呼是否有意义clearstatcache:

clearstatcache(true,'/path/to/screen.css');
Run Code Online (Sandbox Code Playgroud)

旨在仅清除与该特定文件相关的信息(从而减少"影响" clearstatcache)?

php stat filemtime

8
推荐指数
1
解决办法
3610
查看次数

PHP:在类之外或在构造函数中定义常量?

我是新来的班,哦。我一直在寻找一个基本的MySQL类,然后发现Matthew Saragusa的“一个简单的MySQL类”。

这些是第一行:

define('SIMPLE_DB_SERVER', 'mysqlserver.net');
define('SIMPLE_DB_NAME', 'mydbname');
define('SIMPLE_DB_USERNAME', 'myusername');
define('SIMPLE_DB_PASSWORD', 'mypassword');
class ASimpleMySQLDB {
    public function __construct($server, $database, $username, $password){

        $this->conn = mysql_connect($server, $username, $password);
        $this->db = mysql_select_db($database,$this->conn);
    }
[...]
Run Code Online (Sandbox Code Playgroud)

我想知道是否有特定的原因在类外部定义常量,而不是使用构造函数-示例:

public function __construct(){
    $this->conn = mysql_connect('localhost', 'username', 'password');
    $this->db = mysql_select_db('database',$this->conn);
}
Run Code Online (Sandbox Code Playgroud)

要么:

public function __construct($which_db){
        if($which_db=='firstdb'){
            $server='localhost';
            $username='user1';
            $password='pass1';
            $database='db1';
        }elseif($which_db=='otherdb'){
            $server='localhost';
            $username='user2';
            $password='pass2';
            $database='db2';
        }

    $this->conn = mysql_connect($server, $username, $password);
    $this->db = mysql_select_db($database,$this->conn);

}
Run Code Online (Sandbox Code Playgroud)

或使用开关等。

两种方法有什么区别?您会推荐哪个?非常感谢 :-)

php oop constructor class constants

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

DOMDocument - 如何替换嵌套元素

我有这个html片段:

<font color="#ff0000">Lorem <font size="4">ipsum dolor</font> sit amet</font>
Run Code Online (Sandbox Code Playgroud)

我想使用DOMDocument font用a 替换每个标记span.这是我的功能atm:

$fonts = $xPath->query('//font');
foreach($fonts as $font){
    $style = '';
    $newFont = $dom->createElement('span',$font->nodeValue);
    if($font->hasAttribute('size')){
        $size = $font->getAttribute('size');
        $style.='font-size:'.round($size/2,1).'em; ';
    }
    if($font->hasAttribute('color')){
        $style.='color:'.$font->getAttribute('color').'; ';
    }
    if($style!='') $newFont->setAttribute('style',$style);
    $font->parentNode->replaceChild($newFont,$font);
}
Run Code Online (Sandbox Code Playgroud)

我期待这个输出:

<span style="color:#ff0000; ">Lorem <span style="font-size:2em;">ipsum etc..
Run Code Online (Sandbox Code Playgroud)

但我得到:

<span style="color:#ff0000; ">Lorem ipsum dolor sit amet</span>
Run Code Online (Sandbox Code Playgroud)

为什么?


我想这$font->parentNode->replaceChild($newFont,$font);是因为以某种方式用它的文本值替换外部跨度......或者这个查询可能$xPath->query('//font')是错误的.我很喜欢经验丰富的建议......谢谢

php domdocument domxpath

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