将 PHP Glob 与 Retina 配合使用.js 可以提取包括@2x在内的所有图像


Using PHP Glob with Retina.js pulls all images including @2x

我正在使用 http://retinajs.com/(Retina.js)作为我的投资组合网站。Retina.js 要求使用相同的文件名和扩展名将@2x图像放置在同一目录中。例如,当视网膜.js注意到设备正在使用更高的 DPI 时,image01.jpg 将替换为 image01@2x.jpg。

我的问题是我还使用 PHP glob 函数来检索目录中的所有图像文件并将它们显示在页面上。这意味着即使在正常的 72 dpi 屏幕上,它也可以同时拉取@2x图像。但是@2x图像只应该加载到具有更高 DPI 的屏幕上。

我简单的PHP代码是:

$files = glob('images/projects/'.$filename.'/*.{jpg}', GLOB_BRACE);
    foreach($files as $file) {
        echo '<img src="'.$file.'" title="'.$title.'" />';
    }   

有没有办法让视网膜.js和PHP球体一起工作?我的目标是提取目录中的所有图像,除了普通 72dpi 屏幕的@2x图像。

提前感谢!

简单的方法:

foreach($files as $file) {
    //check that the file doesn't have @2x in the name.
    if(strpos($file, '@2x')===false){
        echo '<img src="'.$file.'" title="'.$title.'" />';
    }
}